javascript - Want to prevent selecting specific item in jQuery UI AutoComplete -
i developing textbox autocomplete using jquery ui autocomplete. after that, can create textbox autocomplete, 1 issuce has occured now.
in textbox, want prevent selecting specific item autocomplete list. if select specific item, autocomplete list display again or not close.
$(function (prefixtext) { $("textbox").autocomplete({ autofocus: false, minlength: 0, delay: 50, source: function (request, response) { var data = "{ 'prefixtext': '" + prefixtext + "','count': '" + 30 + "','pixwidth': '" + 100 + "' }"; $.ajax({ type: "post", url: "example.asmx/" + method, cache: false, data: data, datatype: "json", contenttype: "application/json; charset=utf-8", success: function (data) { response($.map(data.d, function (item) { return { label: item.name, id: item.id, name: item.name } })) } }); }, select: function (event, ui) { var id = ui.item.id //not match guid type if (id.match(/[0-9a-z]{8}-[0-9a-z]{4}-[0-9a-z]{4}-[0-9a-z]{4}-[0-9a-z]{12}/) === null) { if ($("text_id") !== null) { $("text_id").val(-1); } return false } else { if ($("text_id") !== null) { $("text_id").val(ui.item.id); } $("textbox").val(ui.item.name); } } }); }); }); if know answer, please teach me.
based on example here: how disable element in jquery autocomplete list think code work you:
$(function (prefixtext) { $("textbox").autocomplete({ autofocus: false, minlength: 0, delay: 50, source: function (request, response) { var data = "{ 'prefixtext': '" + prefixtext + "','count': '" + 30 + "','pixwidth': '" + 100 + "' }"; $.ajax({ type: "post", url: "example.asmx/" + method, cache: false, data: data, datatype: "json", contenttype: "application/json; charset=utf-8", success: function (data) { response($.map(data.d, function (item) { return { label: item.name, id: item.id, name: item.name } })) } }); }, select: function (event, ui) { var id = ui.item.id //not match guid type if (id.match(/[0-9a-z]{8}-[0-9a-z]{4}-[0-9a-z]{4}-[0-9a-z]{4}-[0-9a-z]{12}/) === null) { if ($("text_id") !== null) { $("text_id").val(-1); } return false } else { if ($("text_id") !== null) { $("text_id").val(ui.item.id); } $("textbox").val(ui.item.name); } } }).data("ui-autocomplete")._renderitem = function (ul, item) { //add .ui-state-disabled class , don't wrap in <a> if value empty var id = item.id if (id.match(/[0-9a-z]{8}-[0-9a-z]{4}-[0-9a-z]{4}-[0-9a-z]{4}-[0-9a-z]{12}/) === null) { return $('<li class="ui-state-disabled">'+item.label+'</li>').appendto(ul); } else{ return $("<li>") .append("<a>" + item.label + "</a>") .appendto(ul); } }; }); if can provide working version of code (the items can predefined list, not based on ajax call) easier help.
Comments
Post a Comment