Formatting and redirecting users (using jQuery UI auto-complete)

Question

I am new to jQuery and stack overflow. I am doing my school project and have done a basic search for autocomplete to work with an ASP.NET team web application. I agreed with this guide: http://www.magic-dev.com/autocomplete-textbox-aspnet-database.htm .

I can search for names (taken from the database), but what I'm trying to do is allow the user to select a name (by clicking on the name) from the result and redirect them to the profile page (for example, profile.aspx? Id = 25).

I searched for qaru and came across user redirection when choosing from autocomplete? . I tried to implement codes on this issue, but to no avail.

The current result for the search box is something like this (format [user ID] - [Name] ):

25-Dennis Ferrell 

I do not want to display the ID as a result, but only show the name. An identifier was added to it because I wanted to use the ID for profile.aspx? Id = 25.

** EDIT 1 **

I read that formatItem and formatResult both amortized from jQuery UI ( http://www.learningjquery.com/2010/06/autocomplete-migration-guide ). So, right now, I got the code to redirect the user by click, but the format is still 25-Dennis Ferrell .

Here is my updated code:

  $('#<%= searchMenu.ClientID %>').autocomplete({ source: function (request, response) { $.ajax({ type: "POST", contentType: "application/json; charset=utf-8", url: "PredictiveSearch.asmx/GetAllNames", data: "{'nameKeyword':'" + request.term + "'}", dataType: "json", async: true, success: function (data) { response(data.d); } }); }, select: function (event, data) { window.location = "profile.aspx?id=" + data.item.value.split("-")[0]; } }); 

Can someone help me with formatting? Just remove 25- from 25-Dennis Ferrell and use 25 to redirect the user with an identifier.

** EDIT 2 **

I tried to do this:

 success: function (data) { response($.map(data.d, function (item) { return item.split("-")[1]; })); } 

The result will be Dennis Ferrell , but 25 cannot be passed to the select: function (which is needed to redirect the user).

Answer 1

Ok, so I got it to share. The result in the search box displays Dennis Ferrell , and the select: function gets the value ID 25 . Not the best answer, I think, but still here is the code for the success: function::

 success: function (data) { response($.map(data.d, function (item) { return { id: item.split("-")[0], value: item.split("-")[1], } })); } 

And the code for the select: function::

 select: function (event, data) { //use data.item.value if want to get the name [Dennis Ferrell] window.location = "profile.aspx?id=" + data.item.id; } 

Answer 2

You should get the identifier from ui.item.id within the select function.

 location.href = "profile.aspx?id=" + ui.item.id 

hope this helps

Answer 3

you can use

 window.location = "page.aspx?userid="+ui.item.id;