current community

your communities

more stack exchange communities

Stack Exchange
tour help
careers 2.0
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 2 down vote favorite
1

I want to move items between two Listboxes in ASP.Net using JQuery/Javascript and below is my code which is 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) to 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) is reached. You cannot add any 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 only 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 this code is limited for only one set of ListBoxes as I have hard coded the ListBox names 'ListITProgramming' and 'ListMyITProgramming'.

Can anyone make this dynamic with two parameters in existing function?

share|improve this question
    
just don't hard-code things. You'll make the code easier to extend and fix both for yourself and for others –  acudars Aug 7 '13 at 9:43
    
Can you please help me on the concatenation of ListBox name as I have tried with "var selectedOptions = jQuery('#<%=' + variable +' option:selected');" statement and got compilation error. –  Dhaval Panchal Aug 7 '13 at 9:49

1 Answer 1

up vote 0 down vote

Enclose the list control in an old-fashioned HTML tag with a known, hardcoded ID. Example:

<DIV id="List1Container">
    <ASP:ListBox runat="server" id="list1"/>
</DIV>

In your Javascript, access the list control using the div's ID (List1Container) and jquery's ":first-child" selector. Ta da! You can now reference the list control without knowing its ID at all, so you don't have to do that messy code injection any more.

Bonus: Using this technique, you can now write fully static .js files, which means you can use minification and caching and greatly improve performance.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.