autocomplete(): Spring mvc with jquery: I am not getting correct value in the text filed. Please help me

Hi have develop the jsp to populate related birds whenever we give input in the text field. But i am getting the wrong bird value in the text filed.

MultipleRemote.java :

  package net.viralpatel.spring.autocomplete;

import java.util.ArrayList;
import java.util.List;
import java.util.StringTokenizer;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.servlet.ModelAndView;

@Controller
public class MultipleRemote {

    @RequestMapping(value = "/mr", method = RequestMethod.GET)
    public ModelAndView index() {

        ModelAndView mv=new ModelAndView();
        mv.setViewName("MultipleRemote");
        return mv;
    }

    @RequestMapping(value = "/birds", 
                    method = RequestMethod.GET, 
                    headers="Accept=*/*")
    public @ResponseBody List<String> getCountryList(@RequestParam("term") String query) {
        List<String> list = new ArrayList<String>();
        list.add("parrot");
        list.add("crow");
        list.add("dove");
        System.out.println("list="+list);
        return list;
    }
}

MultipleRemote.jsp:

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>jQuery UI Autocomplete - Multiple, remote</title>

<link rel="stylesheet"
    href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css" />

<script>

$(function() {
    $( "#birds" ).autocomplete({
        source: '${pageContext. request. contextPath}/birds.html'
    });
});

</script>
</head>
<body>
    <div class="ui-widget">
        <label for="birds">Birds: </label> <input id="birds" size="50" name="term" />
    </div>
</body>
</html>

Problem: whenever we send the request to server with http://localhost:8089/Spring3MVCMultipleRow_Submit/mr.html url, the controller is sending request to MultipleRemote.jsp. If whenever i type message like "pa" in the text filed then the text filed is successfully populated all bird names , but whenever i selected any bird in the text filed the am getting the result in text field like "birdname," . Hear i am not getting why the "," is appending to bird name.

How can i get only bird name without "," in the text filed?.

Please help me

Thanks...

View Answers

November 15, 2013 at 10:44 AM

Thanks lot

November 6, 2013 at 9:03 PM

Hi Basha,

I saw your problem today itself. If you still facing the same issue.I can suggest you to go through the below URL where i given good example with code snippets.

Let me know if you have any issues further. Ajax Request Processing using Spring with Auto Complete Example
Thank You.

November 6, 2013 at 9:03 PM

Hi Basha,

I saw your problem today itself. If you still facing the same issue.I can suggest you to go through the below URL where i given good example with code snippets.

Let me know if you have any issues further. Ajax Request Processing using Spring with Auto Complete Example
Thank You.