Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Jquery autocomplete on select event

Tags:

I am using jQuery autocomplete and its working fine, now I want to store a variable in session from jQuery when following condition occurs.

When someone types any word jQuery shows suggestion dropdown, if someone select an item from that suggestion dropdown.

I want to capture above point and store a variable in session.

I searched Google, StackOverflow but find no relevant solution. My code for autocomplete is following:

  $(".autosearch-smart").autocomplete('Home/GetCompanyNames', {     minChars: 1,     width: 402,     matchContains: "word",     autoFill: true }); 

and this is what I tried to do:

  $(".autosearch-smart").autocomplete('Home/GetCompanyNames', {     minChars: 1,     width: 402,     matchContains: "word",     autoFill: true,     select: function (a, b) {         alert("selected");     }  }); 

EDIT : Select event handler is also not working

I am using asp.net MVC3 with C#. Please help me out and thanks in advance.

like image 468
smart boy Avatar asked Oct 04 '12 08:10

smart boy


People also ask

How to select Autocomplete value in jQuery?

In the process of searching a specific value, the jQuery UI autocomplete selection feature provides the user with some string suggestions for the input area which effectively saves time. The autocomplete select action is triggered when the user selects one of the options from the pre-populated list.

How does jQuery autocomplete work?

The autocomplete (options) method declares that an HTML <input> element must be managed as an input field that will be displayed above a list of suggestions. The options parameter is an object that specifies the behavior of the list of suggestions when the user is typing in the input field.

Which are jQuery ui widgets?

a jQuery UI widget is a specialized jQuery plug-in. Using plug-in, we can apply behaviours to the elements. However, plug-ins lack some built-in capabilities, such as a way to associate data with its elements, expose methods, merge options with defaults, and control the plug-in's lifetime.


2 Answers

So if I understand correctly you want to store the selected value in a variable sessions

you can get the value out of the selected item through following code:

  $(".autosearch-smart").autocomplete('Home/GetCompanyNames', { minChars: 1, width: 402, matchContains: "word", autoFill: true, select: function (event, ui) {     var label = ui.item.label;     var value = ui.item.value;    //store in session   document.valueSelectedForAutocomplete = value  } }); 

the value and label are json objects that came from the server

Hope this helps

like image 122
iBoonZ Avatar answered Sep 28 '22 10:09

iBoonZ


Well, if you want to store in session using asp.net mvc3 then do the following

$(".autosearch-smart").autocomplete('Home/GetCompanyNames', {     minChars: 1,     width: 402,     matchContains: "word",     autoFill: true,     select: function (event, ui) {   //must be cleared with function parameter         //alert(ui.item.label);  //will show you the selected item         $.ajax({           type: 'POST',           url: '/Controller/Action1',  //whatever any url           data: {label: ui.item.label},           success: function(message) { if(message.data == true) ... else ... },           dataType: 'json'        });      }  }); 

and controller

[HttpPost]   public JsonResult Action1( string label ) {       this.Session["AnyValue"] = label;       return Json( new {         data = true      }, JsonRequestBehavior.AllowGet );   } 
like image 25
Snake Eyes Avatar answered Sep 28 '22 09:09

Snake Eyes