Search jQuery

jQuery Forum

need help for autocomplete UI with JSON String

in Using jQuery UI • 7 months ago

Hi All,

I am trying to include autocomplete option in my application and I want to get this while loading the page without any AJAX call. So, I am collecting all the details from DB and set it as a JSON string and passing it to my JSP.

In my JSP file, I am trying to get the values directly from that JSON string. But I am not getting the autocomplete option in my text box.

code to set it to JSON

while(voGroup.hasNext()){

dataMap = new HashMap();

// iterate over each row and add it to dataList

rGroup = voGroup.next();

dataMap.put("grpCd", rGroup.getAttribute("No"));

dataMap.put("grpDesc", rGroup.getAttribute("Name"));

dataList.add(dataMap);

}

dropdownDataMap.put("mainGrp", dataList);

response.setContentType("application/json");

java.io.PrintWriter out = response.getWriter();

request.setAttribute("mainGrpList", JSONValue.toJSONString(dataList));

==========================================

Code in JSP

It is inside Javascript code

var availableGrps = $("#mainGrpList").val();

$("#grpCodeLbl").autocomplete({

source: availableGrps

});

Please help me to find out the reason, why it is not coming in the page.

Regards,

Joby Joseph

Replies(6)

mike_laird

Re: need help for autocomplete UI with JSON String

7 months ago

You are taking an approach that I have not seen before (and I've seen many, many Autocomplete postings here), and I don't have the background to understand everything you are doing. That said, I understand you to say you want to create a variable during page load that has all the items in the dropdown list. Thus, in your Autocomplete code, availableGrps has to be a Javascript array. The form of that array will look like

var availableGrps = [ 'name1', 'name2', 'name3', etc. ];

I'll leave that to you to create from your server. The current declaration for availableGrps is not an array, so Autocomplete does not work. You need an array, not JSON, in the approach you are taking.

If you want to use an ajax call to the server, take a look at my comments in the following posting.

https://forum.jquery.com/topic/autocomplete-how-to-use-mysql-data

It has a link to a tutorial for a server (in several code bases), some working Autocomplete code, and some tips.

Jobz

Re: need help for autocomplete UI with JSON String

7 months ago

Hi,

Thank you for your reply.

Yes ... you are right. The result I am getting from server was not an array. It was just a String. So I decided to convert it to an Array and now it works fine. and one more doubt from my side.

The array is like....

[{"value":6,"label":"Admin&HR"},{"value":8,"label":"Driver & Helper"},{"value":2,"label":"Finance & Accounting"}] and I want to select Admin&HR as my group. I selected it from the drop down list and after select, it displays 6 in the text box, the value and not the label. How can I resolve it

kalekushal

Re: need help for autocomplete UI with JSON String

7 months ago

this must be becoz you must be doing something like this in your query "select value, label from table"

try doing "Select label, value from table"

You can always capture the select: event of autocomplete where you can get the value or label and set it to text box(but i wont recommend this, since its not needed)

Jobz

Re: need help for autocomplete UI with JSON String

7 months ago

Hi Mr kalekushal,

Thank you for your information. Now I resolved it by adding

event.preventDefault();

as the first line in the select method. Now I can select and display the selected label in the text filed. Thank you for all the valuable time spent for reading and sending information to my questions.

Regards,

Joby Joseph

kalekushal

Re: need help for autocomplete UI with JSON String

7 months ago

@Joby .... glad that your problem is solved... i dont know how event.preventDefault(); solved your problem but hope you know what it actually does..

Jobz

Re: need help for autocomplete UI with JSON String

7 months ago

Hi Mr kalekushal,

actual problem was, I am not able to get the autocomplete functionality in my text box. That is because, I am passing a String rather than Array as source and I converted it to Array. Then it works. Second problem, I cannt set the label value to that filed. For that I added vent.preventDefault(); on the select funtion.

Regards,

Joby joseph

Top Reply

Response title

Attachments

jQuery Forum

need help for autocomplete UI with JSON String

Replies(6)

Re: need help for autocomplete UI with JSON String

Re: need help for autocomplete UI with JSON String

Re: need help for autocomplete UI with JSON String

Re: need help for autocomplete UI with JSON String

Re: need help for autocomplete UI with JSON String

Re: need help for autocomplete UI with JSON String

Statistics

Tags

Actions

Related Posts