Why disable the previous added combobox in autocomplete?

See more:

jQuery

auto-complete

Hi,

I use autocomplete in my code as below.

function BindSaveFoodItem(result) {

    for (var i = 0; i < gTotalMealCount; i++) {
    
        for (var j = 0; j < gTotalRowCount[i]; j++) {
           (function ($) {
                $.widget("ui.combobox", {
                    _create: function () {
                        var self = this;
                        var select = this.element,
           theWidth = select.width(),
           selected = select.children(":selected"),
           theTitle = select.attr("title"),
           value = selected.val() ? selected.text() : "";
                        select.hide();
                        var input = $("<input style=\"width:85%\" onpaste=\"return false;\" onclick=\"OnChangeMealTime(" + i + ");\"  önkeyup=\"KeyUpOnFoodItem('" + i + "_" + j + "',event);\">")
           .val(value)
           .attr('id', 'drpFoodItem_' + i + "_" + j)
           .attr('title', '' + theTitle + '')
           //.autocomplete("destroy")
    //               .blur({
    
    //                $.ui.autocomplete("destroy")
    
    //               })
           .autocomplete({

               delay: 0,
               minLength: 0,
               source: function (request, response) {
                   var matcher = new RegExp($.ui.autocomplete.escapeRegex(request.term), "i");
                   response(select.children("option").map(function () {
                       var text = $(this).text();
                       if (this.value && (!request.term || matcher.test(text)))
                           return {
                               label: text.replace(
                             new RegExp(
                                "(?![^&;]+;)(?!<[^<>]*)(" +
                                $.ui.autocomplete.escapeRegex(request.term) +
                                ")(?![^<>]*>)(?![^&;]+;)", "gi"
                             ), "<strong>$1</strong>"),
                               value: text,
                               option: this
                           };
                   }));
               },
               select: function (event, ui) {
                   ui.item.option.selected = true;
                   //select.val( ui.item.option.value );
                   self._trigger("selected", event, {
                       item: ui.item.option
                   });
    
                   var id = new Array();
                   id = $(this).attr("id").split('_');
                   ChangeFoodItem(id[1] + "_" + id[2]);
               },
               change: function (event, ui) {
                   if (!ui.item) {
                       var matcher = new RegExp("^" + $.ui.autocomplete.escapeRegex($(this).val()) + "$", "i"),
                       valid = false;
                       select.children("option").each(function () {
                           if (this.value.match(matcher)) {
                               this.selected = valid = true;
                               return false;
                           }
                       });
                       if (!valid) {
                           // remove invalid value, as it didn't match anything
                           $(this).val("");
                           select.val("");
                           return false;
                       }
                      
                   }
               }
           })
           .addClass("ui-widget ui-widget-content ui-corner-left");
                        var span = $("<span style="\" hold=" /&gt;                  .append(input).insertAfter(select);&lt;br mode=" autocomplete=")._renderItem = function (ul, item) {&lt;br mode="><li></li>")
              .data("item.autocomplete", item)
              .append("<a>" + item.label + "</a>")
              .appendTo(ul);
                        };
    
                        $("<a></a>")
           .attr("tabIndex", -1)
           .attr("title", "Show All Items")
           .insertAfter(input)
           .button({
               icons: {
                   primary: "ui-icon-triangle-1-s"
               },
    
               text: false
           })
                        //.css("height", "13px")
           .removeClass("ui-corner-all")
           .addClass("ui-corner-right ui-button-icon")
           .click(function () {
               // close if already visible
               if (input.autocomplete("widget").is(":visible")) {
                   input.autocomplete("close");
                   return;
               }
             
               //pass empty string as value to search for, displaying all results
               input.autocomplete("search", "");
               input.focus();
           });
                    }
                });
            })(jQuery);
            $("#drpFoodItem1_" + i + "_" + j).combobox({
                // And supply the "selected" event handler at the same time.
    
            }); 
        }
    }
}

disable the combobox when i add new combobox using the above code. How to solve this issue?.

Thanks..