JQuery check for empty listbox item

0
votes

I have code that adds items from a dropdown menu into a listbox. When the user submits the form it goes though the listboxes and selects all the items and then updates the tables.

If the user removes all items from the listbox, I added in code to add a blank item to the listbox so the listbox can still be updated. I had to do this because if there was no items in the listbox then it wouldn't be updated and the old items would remain.

    $.each(aListBoxes, function (idx, listBox) {
    //If nothing in listbox add blank item so it can get updated
    if ($("#" + listBox + " option").length < 1) {
    ($("#" + listBox).append('<option value=""></option>'));
    }

Now, I want to check if there is more than 1 item in the listbox, and if so remove this blank item if it exists.

    if ($("#" + listBox + " option").length > 1) {
    $("#" + listBox + " option").each(function () {

    //if item value is empty then remove

Entire script so far:

<script type="text/javascript">
    //for pre-selection of all elements in every list box
    $(document).ready(function () {
        var aListBoxes = [];
        // get a list of all the listboxes on the form
        $("[id*=" + "lbx" + "]:visible").each(function () {
            aListBoxes.push(this.id);
        });

        //on btnSubmit click because the form gets posted each time an autopostback field is hit.
        $("input[name=btnSubmit]").click(function () {
            //just before submission, go through each of the listboxes and if they contain anything, select everything.
            $.each(aListBoxes, function (idx, listBox) {
                //If nothing in listbox add blank item so it can get updated
                if ($("#" + listBox + " option").length < 1) {
                    ($("#" + listBox).append('<option value=""></option>'));
                }
                //If more than 1 item check for blank and remove
                if ($("#" + listBox + " option").length > 1) {
                    $("#" + listBox + " option").each(function () {
                        //if empty
                        //remove
                        });
                }

                //select all before submitting
                if ($("#" + listBox + " option").length > 0) {
                    $("#" + listBox + " option").each(function () {
                        $(this).prop('selected', 'selected')
                    });
                }
            });
        });
    });
</script>
2
jquerylistbox

2 Answers

1
votes

I hope by blank options you mean their values are empty . Try this :- 

    if ($("#" + listBox + " option").length > 1) {
          $(this).each(function () {  
               if($(this).val()=="")
                    $(this).remove();
          });
    }

if you mean text is empty for blank options , then write $(this).text()=="" instead of $(this).val()==""

0
votes

jQuery filter is specifically designed for this type of thing and avoids using an each:

if ($("#" + listBox + " option").length > 1) {
      $(this).filter( function () {
          return $(this).val()=="";
      }).remove();
}