diff --git a/dist/dual-list-box.js b/dist/dual-list-box.js index 5fdf03f..669dce8 100644 --- a/dist/dual-list-box.js +++ b/dist/dual-list-box.js @@ -22,19 +22,22 @@ $.fn.DualListBox = function(paramOptions, selected) { return this.each(function () { var defaults = { - element: $(this).context, // Select element which creates this dual list box. - uri: 'local.json', // JSON file that can be opened for the data. - value: 'id', // Value that is assigned to the value field in the option. - text: 'name', // Text that is assigned to the option field. - title: 'Example', // Title of the dual list box. - json: true, // Whether to retrieve the data through JSON. - timeout: 500, // Timeout for when a filter search is started. - horizontal: false, // Whether to layout the dual list box as horizontal or vertical. - textLength: 45, // Maximum text length that is displayed in the select. - moveAllBtn: true, // Whether the append all button is available. - maxAllBtn: 500, // Maximum size of list in which the all button works without warning. See below. + element: $(this).context, // Select element which creates this dual list box. + uri: 'local.json', // JSON file that can be opened for the data. + value: 'id', // Value that is assigned to the value field in the option. + text: 'name', // Text that is assigned to the option field. + title: 'Example', // Title of the dual list box. + json: true, // Whether to retrieve the data through JSON. + timeout: 500, // Timeout for when a filter search is started. + horizontal: false, // Whether to layout the dual list box as horizontal or vertical. + textLength: 45, // Maximum text length that is displayed in the select. + moveAllBtn: true, // Whether the append all button is available. + maxAllBtn: 500, // Maximum size of list in which the all button works without warning. See below. selectClass:'form-control', - warning: 'Are you sure you want to move this many items? Doing so can cause your browser to become unresponsive.' + warning: 'Are you sure you want to move this many items? Doing so can cause your browser to become unresponsive.', + sort: true, // Allow DualListBox to sort select element + onMoveLeft: function(evt,items){}, // Callback called when items moved in the left select + onMoveRight: function(evt,items){} // Callback called when items moved in the right select }; var htmlOptions = { @@ -62,7 +65,7 @@ options['parentElement'] = '#' + options.parent; selected = $.extend([{}], selected); - + if (options.json) { addElementsViaJSON(options, selected); } else { @@ -109,16 +112,22 @@ var unselected = $(options.parentElement + ' .unselected'); var selected = $(options.parentElement + ' .selected'); - $(options.parentElement).find('button').bind('click', function() { + $(options.parentElement) + .unbind("onMoveLeft, onMoveRight") + .bind("onMoveLeft",options.onMoveLeft) + .bind("onMoveRight",options.onMoveRight).find('button').bind('click', function() { switch ($(this).data('type')) { case 'str': /* Selected to the right. */ - unselected.find('option:selected').appendTo(selected); + var slctdElements = unselected.find('option:selected').appendTo(selected); + $(options.parentElement).trigger("onMoveRight",[slctdElements]); $(this).prop('disabled', true); break; case 'atr': /* All to the right. */ if (unselected.find('option').length >= options.maxAllBtn && confirm(options.warning) || unselected.find('option').length < options.maxAllBtn) { - unselected.find('option').each(function () { + var slctdElements = unselected.find('option').filter(":visible"); + $(options.parentElement).trigger("onMoveRight",[slctdElements]); + slctdElements.each(function () { if ($(this).isVisible()) { $(this).remove().appendTo(selected); } @@ -126,13 +135,16 @@ } break; case 'stl': /* Selected to the left. */ - selected.find('option:selected').remove().appendTo(unselected); + var slctdElements = selected.find('option:selected').remove().appendTo(unselected); + $(options.parentElement).trigger("onMoveLeft",[slctdElements]); $(this).prop('disabled', true); break; case 'atl': /* All to the left. */ if (selected.find('option').length >= options.maxAllBtn && confirm(options.warning) || selected.find('option').length < options.maxAllBtn) { - selected.find('option').each(function () { + var slctdElements = selected.find('option').filter(":visible"); + $(options.parentElement).trigger("onMoveLeft",[slctdElements]); + slctdElements.each(function () { if ($(this).isVisible()) { $(this).remove().appendTo(unselected); } @@ -142,8 +154,8 @@ default: break; } - unselected.filterByText($(options.parentElement + ' .filter-unselected'), options.timeout, options.parentElement).scrollTop(0).sortOptions(); - selected.filterByText($(options.parentElement + ' .filter-selected'), options.timeout, options.parentElement).scrollTop(0).sortOptions(); + unselected.filterByText($(options.parentElement + ' .filter-unselected'), options.timeout, options.parentElement).scrollTop(0).filter(function(){return options.sort}).sortOptions(); + selected.filterByText($(options.parentElement + ' .filter-selected'), options.timeout, options.parentElement).scrollTop(0).filter(function(){return options.sort}).sortOptions(); handleMovement(options); }); @@ -158,8 +170,8 @@ } }); - selected.filterByText($(options.parentElement + ' .filter-selected'), options.timeout, options.parentElement).scrollTop(0).sortOptions(); - unselected.filterByText($(options.parentElement + ' .filter-unselected'), options.timeout, options.parentElement).scrollTop(0).sortOptions(); + selected.filterByText($(options.parentElement + ' .filter-selected'), options.timeout, options.parentElement).scrollTop(0).filter(function(){return options.sort}).sortOptions(); + unselected.filterByText($(options.parentElement + ' .filter-unselected'), options.timeout, options.parentElement).scrollTop(0).filter(function(){return options.sort}).sortOptions(); } /** Constructs the jQuery plugin after the elements have been retrieved. */ diff --git a/dist/dual-list-box.min.js b/dist/dual-list-box.min.js index 6de2806..612e211 100644 --- a/dist/dual-list-box.min.js +++ b/dist/dual-list-box.min.js @@ -1 +1 @@ -(function($){$.fn.DualListBox=function(paramOptions,selected){return this.each(function(){var defaults={element:$(this).context,uri:"local.json",value:"id",text:"name",title:"Example",json:true,timeout:500,horizontal:false,textLength:45,moveAllBtn:true,maxAllBtn:500,selectClass:"form-control",warning:"Are you sure you want to move this many items? Doing so can cause your browser to become unresponsive."};var htmlOptions={element:$(this).context,uri:$(this).data("source"),value:$(this).data("value"),text:$(this).data("text"),title:$(this).data("title"),json:$(this).data("json"),timeout:$(this).data("timeout"),horizontal:$(this).data("horizontal"),textLength:$(this).data("textLength"),moveAllBtn:$(this).data("moveAllBtn"),maxAllBtn:$(this).data("maxAllBtn"),selectClass:$(this).data("selectClass")};var options=$.extend({},defaults,htmlOptions,paramOptions);$.each(options,function(i,item){if(item===undefined||item===null){throw"DualListBox: "+i+" is undefined."}});options["parent"]="dual-list-box-"+options.title;options["parentElement"]="#"+options.parent;selected=$.extend([{}],selected);if(options.json){addElementsViaJSON(options,selected)}else{construct(options)}})};function addElementsViaJSON(options,selected){var multipleTextFields=false;if(options.text.indexOf(":")>-1){var textToUse=options.text.split(":");if(textToUse.length>1){multipleTextFields=true}}$.getJSON(options.uri,function(json){$.each(json,function(key,item){var text="";if(multipleTextFields){textToUse.forEach(function(entry){text+=item[entry]+" "})}else{text=item[options.text]}$("