javascript - Move items between two ListBoxes in ASP.Net using JQuery -
i want move items between 2 listboxes in asp.net using jquery/javascript , below code working perfectly.
function additems() { var totalitemsselected = 0; var currentitems = 0; var messagelabel = document.getelementbyid('<%=lblitprogrammingmessage.clientid%>'); var selectedoptions = jquery('#<%=listitprogramming.clientid %> option:selected'); if (selectedoptions.length == 0) { messagelabel.innerhtml = "please select skill(s) add."; jquery('#<%= lblitprogrammingmessage.clientid %>').fadeout(2000, function () { messagelabel.innerhtml = ""; }); jquery('#<%= lblitprogrammingmessage.clientid %>').fadein(500, function () { }); return false; } jquery('select[name$=listmyitprogramming] > option').each(function () { currentitems++; }); if (currentitems == 30) { messagelabel.innerhtml = "maximum limit (30) reached. cannot add more skills."; jquery('#<%= lblitprogrammingmessage.clientid %>').fadeout(2000, function () { messagelabel.innerhtml = ""; }); jquery('#<%= lblitprogrammingmessage.clientid %>').fadein(500, function () { }); return false; } totalitemsselected = currentitems + selectedoptions.length; if (totalitemsselected > 30) { messagelabel.innerhtml = "you can select " + (30 - currentitems) + " item(s) more."; jquery('#<%= lblitprogrammingmessage.clientid %>').fadeout(2000, function () { messagelabel.innerhtml = ""; }); jquery('#<%= lblitprogrammingmessage.clientid %>').fadein(500, function () { }); return false; } if (selectedoptions.length == 1) { if (jquery("#<%=listmyitprogramming.clientid %> option[value='" + selectedoptions.val() + "']").length > 0) { } else { jquery('#<%=listmyitprogramming.clientid %>').append(jquery(selectedoptions).clone()); } } else if (selectedoptions.length > 1) { jquery(selectedoptions).each(function () { if (jquery("#<%=listmyitprogramming.clientid %> option[value='" + this.value + "']").length > 0) { } else { jquery('#<%=listmyitprogramming.clientid %>').append(jquery(this).clone()); } }); } jquery(selectedoptions).remove(); var hdn2 = ""; jquery('select[name$=listmyitprogramming] > option').each(function () { hdn2 += jquery(this).attr('value') + ','; }); jquery("#<%= listmyitprogrammingvalues.clientid %>").val(hdn2); return false; }
but code limited 1 set of listboxes have hard coded listbox names 'listitprogramming' , 'listmyitprogramming'.
can make dynamic 2 parameters in existing function?
enclose list control in old-fashioned html tag known, hardcoded id. example:
<div id="list1container"> <asp:listbox runat="server" id="list1"/> </div>
in javascript, access list control using div's id (list1container) , jquery's ":first-child" selector. ta da! can reference list control without knowing id @ all, don't have messy code injection more.
bonus: using technique, can write static .js files, means can use minification , caching , improve performance.
Comments
Post a Comment