简体   繁体   中英

jquery-ui-autocomplete How can I set the ID into the textBox and it will return me the text value

I'm having a lot of trouble making jQuery's autocomplete widget work for me. I am using a list of key/value pairs from a server.

I have the following requirements:

  1. If the user set the id of the value, like he knowes the code of the city and instad of typing the name of a city he put the code of the city-- I want that the autocomplete will put the name of the city, and it dosn't!!
    I edit My Code, now it works!
    I add this lines
    if (data.d.length == 1 && request.term.match(/\\d+/g)) SetValue(textbox, hidden, data.d[0]); else

and the function
function SetValue(textbox, hidden, value){ textbox.focus().val(value.Text); hidden.val(value.Semel);}

  1. Another thing is if one is using the same page for creation and editting - on reloading the page while editting, you have to recreate all the spans etc for the values, and I want to send from the server just the code of the autocomplete, not the text value, and I want when i will set the value into the textBox, the autoComplete will start to work and will bring the value from the server
    But with this I get still stuck:
    I Dont know how to trigger the “autocomplete” event with send the value (the request value)
    Here is My C# code:

     [WebMethod(EnableSession = true)] [ScriptMethod] public List<IEntityBase> FetchList(string Text, string Code, string Dspl, int NumRecordes, string TableName) { Text = Server.UrlDecode(Text); List<Tavla> tvListById = null; int ignored = 0; if (int.TryParse(Text, out ignored)) tvListById = TvList.GetTvListById(TableName, ignored, Code, Dspl);if (tvListById != null && tvListById.Count != 0) return tvListById.Cast<IEntityBase>().ToList(); var fetchShem = TvList.GetData(TableName, Code, Dspl) .Where(m => m.Shem.ToLower().Contains(Text.ToLower())) .Take(NumRecordes); return fetchShem.Cast<IEntityBase>().ToList(); 

    }

and here is my Jquery Code:

enter code here

 textbox.autocomplete({
        source: function (request, response) {
            $.ajax({
                url: "AutoComplete.asmx/" + funcName,
                data: "{ 'Text': '" + escape(request.term) + "','Code':'" + code + "','Dspl':'" + dspl + "','NumRecordes':'" + numrecordes + "','TableName':'" + tablename + "'}",
                type: "POST",
                contentType: "application/json; charset=utf-8",
                dataFilter: function (data) { return data; },
                success: function (data) {                      
                    if (data.d.length == 1 && request.term.match(/\d+/g))
                            SetValue(textbox, hidden, data.d[0]);
                        else
                        response($.map(data.d, function (item) {
                            return {
                                label: item.Text,
                                value: item.Semel
                            }
                        }));
                    }
                },
                error: function (msg) { alert(msg); }
            });
        },
        minLength: minLength,
        select: function (event, ui) {
            var selectedObj = ui.item;
            if (selectedObj) {
                textbox.val(selectedObj.label);
                hidden.val(selectedObj.value);
            }       return false;   },

    });function SetValue(textbox, hidden, value) {
textbox.focus().val(value.Text);
hidden.val(value.Semel);

}

For your first question, it all depends the logic you have tried , just in case if you have an id for any country then this shouldnt be any difficult.

Second query is all about performance of the page, this also shouldnt be any tougher if you try updating the elements based on the search pattern using ajax, where in you have to update just the realted elements,while keeping rest of your Page intact .

refer http://jquery.com/ for better understanding of the same

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM