jquery asmselect: изменения не запускаются при сортировке
Я использую плагин asmselect, чтобы позволить пользователям выбирать и заказывать несколько элементов из поля выбора.
Я хочу включить кнопку отправки только после внесения изменений пользователем. Следующее работает, но изменение не вызывается при сортировке выбранных элементов:
<script type="text/javascript">
$(document).ready(function() {
$("select[multiple]").asmSelect({
addItemTarget: 'bottom',
highlight: false,
hideWhenAdded: true,
sortable: true
});
// track changes with our own event
$("#mySelect").change(function(e, data) {
$("#submit").removeAttr("disabled");
// if it's a sort or an add, then give it a little color animation to highlight it
if (data.type != 'drop') data.item.animate({ 'backgroundColor': '#ffffcc' }, 20, linear', function() {
data.item.animate({ 'backgroundColor': '#dddddd' }, 500);
});
});
});
</script>
Выбрать и отправить:
<select id="mySelect" multiple="multiple" name="mySelect[]" title="Select Elements">
<% foreach (var item in Model)
{ %>
<option <%= item.Selected ? "selected=selected" : "" %> value="<%= Html.Encode(item.ID) %>">
<%= Html.Encode(item.Text) %></option>
<% } %>
</select>
<input type="submit" value="Save" id="submit" disabled="disabled" />
Как включить отправку, когда выбранные элементы отсортированы?
2 ответа
Вам нужно изменить функцию asm, как показано ниже:
function makeSortable()
{
// make any items in the selected list sortable
// requires jQuery UI sortables, draggables, droppables
$ol.sortable({
items: 'li.' + options.listItemClass,
handle: '.' + options.listItemLabelClass,
axis: 'y',
update: function(e, data)
{
var updatedOptionId;
$(this).children("li").each(function(n)
{
//$option = $('#' + $(this).attr('rel'));
// i'm not sure what this is here for as the return will break ordering
//if($(this).is(".ui-sortable-helper"))
{
// updatedOptionId = $option.attr('id');
// return;
//
}
//$original.append($option);
$original.append($('#' + $(this).attr('rel')));
});
//we want to trigger change event always, even if it is only the order that has been changed.
//if(updatedOptionId) triggerOriginalChange(updatedOptionId, 'sort');
triggerOriginalChange(updatedOptionId, 'sort');
}
}).addClass(options.listSortableClass);
}
Похоже, что в старых версиях jquery/jquery-ui для элемента с атрибутом ui-sortable-helper было инициировано дополнительное событие. Это
Попробуйте мою обновленную версию asmselect. Смотрите код и пример здесь