CODEWITHSUNDEEP
jqueryasp.netajaxjson
niao
niao

Reputation: 5070

jQuery autocomplete and getJSON

I want to use jquery autocomplete plugin with cooperation with jquery GetJson In my client page i have the following code:

<script>
          $(document).ready(function () {
              var test;
              $.getJSON("getData.aspx", function (json) {
                  alert("function dome");
test=json;
              });
              $("input#autocomplete").autocomplete({
                  source: test
              });
          });

      </script>

and my getData.aspx Page_Load method contains the following:

protected void Page_Load(object sender, EventArgs e)
        {
            List<string> test = new List<string>() { "Java", "Javascript", "sss", "sqre" };
            StringBuilder sb = new StringBuilder();
            JavaScriptSerializer jsSerializer = new JavaScriptSerializer();
            jsSerializer.Serialize(test, sb);
            Response.Clear();
            Response.ContentType = "application/json";
            Response.Write(test.ToString());

        }

why even alert("function done") is not executed? Why my autocomplete is not working? Can someone please help me?

Upvotes: 0

Views: 1562

Answers (2)

scurker
scurker

Reputation: 4753

You can't use AJAX in that way, since you have no way of knowing when the request returns. You need to perform your actions within the callback:

$.getJSON("getData.aspx", {}, function (json) {
  $("input#autocomplete").autocomplete({ source: json });
});

Also, you can use a remote datasource directly without having to call $.getJson:

$("input#autocomplete").autocomplete({ source: 'getData.aspx' });

The downside of this approach is that it'll make an asynchronous any time it needs to fetch an updated data set. The first approach is better if you have a small set of data that is fixed, the second approach is better if you have a large dataset with results that need to be filtered.

Upvotes: 0

Richard Dalton
Richard Dalton

Reputation: 35793

Try changing it to do this:

 $(document).ready(function () {
      $.getJSON("getData.aspx", null, function (json) {
          alert("function dome");
          $("input#autocomplete").autocomplete({
              source: json
          });
      });              
  });

Upvotes: 2

Related Questions