I am doing an MVC app and I have a 3 dropdown list. When it change the value from any or those, it load a third dropdowlist multiselect defined like this
@Html.DropDownListFor(model => model.ListEntityItem, Model.EntityItems, new { id = "lstData", multiple = "multiple" })
it is loaded like this
function loadData()
{
var source = $("#ddlOrigin").val();
var entity = $("#ddlEntity").val();
$.ajax({
url: '@Url.Action("GetData","EntitySync")',
data: { entity: entity, source: source },
cache: false,
type: "POST",
success: function (data) {
document.body.style.cursor = "auto";
var markup = "";
$("#lstData").css("display", "block");
for (var x = 0; x < data.length; x++) {
markup += "<option value=" + data[x].Value + ">" + data[x].Text + "</option>";
}
$("#lstData").append(markup).show();
$('#lstData').multiselect({
columns: 1,
placeholder: 'Select Workflow Items',
});
$('input[type=checkbox]').change(function () {
if ($('input[type=checkbox]:checked').length > 0)
$("#btnSync").prop("disabled", false);
else
$("#btnSync").prop("disabled", true);
});
},
error: function (response) {
}
})
}
From this moment... the DropDownList lstData is Inaccessible. If i want to hide it, Nothing happends.
$("#lstData").css("visibility", "hidden");
If i change the options in the firsts DropDownList... its draws another DropDownList... above the first one.
I read differents pages, but nothing works.. here or here
How can i solve this..?
Thanks