In my project i'm using a kendo sortable to do the reorder of my image thumbnail. It is filter by the thumbnail div class "col-md-6 up". Everything is fine except that i have a dropdownlist inside the div which is not working now when clicking it.
This is mycode:
$("#ImageListView").kendoSortable({
filter: ">div.col-md-6.up",
cursor: "move",
autoScroll: true,
placeholder: function (element) {
return element.clone().css("opacity", 0.1);
},
hint: function (element) {
return element.clone().removeClass("k-state-selected");
}
});
And this is my thumbnail div:
div class="col-md-6 up">
<div>
<label class="docLabel" id="docLabe style="display:none;float:right;">Dropdown</label>
<select class="docSelect" id="docSelect" style="display:none;float:right;">
<option value="A">A</option>
</select>
</div>
</div>
Does anyone know how to solve this problem?
You need the ignore configuration of kendoSortable
to make it work. I would do it like :
$("#ImageListView").kendoSortable({
filter: ">div.col-md-6.up",
cursor: "move",
autoScroll: true,
ignore: "#docSelect",
placeholder: function (element) {
return element.clone().css("opacity", 0.1);
},
hint: function (element) {
return element.clone().removeClass("k-state-selected");
}
});