Select2 With Ajax Asp.net 4.0 webmethod Request

Question

I'm trying to drive the select2 combo box from a very simple web method (for testing only), but nothing seems to work. I've tried with static, without static - no joy.

    [WebMethod]
    [ScriptMethod(ResponseFormat=ResponseFormat.Json)]
    public static String getResults(String q, String page_limit)
    {
        return "{'id':'1','text':'test'}";
    }

Here is the Jquery

$("#myHiddenField").select2({
            placeholder: "Search for item",
            minimumInputLength: 3,
            ajax: {
                url: "mypage.aspx/getResults",
                dataType: 'json',
                type: "POST",
                params: {
                    contentType: 'application/json; charset=utf-8'
                },
                quietMillis: 100,
                data: function (term, page) { 
                    return JSON.stringify({ q: term, page_limit: 10 });
                },
                results: function (data) {
                    return { results: data };
                }
            }
        });

I cannot for the life of me figure it out. Any thoughts or suggestions?

EDIT

I'm following the example for the 'SELECT2' plugin and more specifically the 'Infinite Scroll with Remote Data Section' see here - which works fine with the example. I'm clearly missing something obvious.

What happens when you step through a debugger both in the server code and in the javascript? Is the server sending anything back; what does it look like? Tried watching what's going on in Fiddler2? — imjosh
– imjosh, Commented Dec 30, 2013 at 20:14
I would like to do this too. Sadly Select2 creates a querystring and I do not think there is anything you can do about it :( — Stonedecroze
– Stonedecroze, Commented Mar 22, 2014 at 20:31
I did work around this. Post me your scenario and I'll see if I can assist. I'll also post my resolution a little later — Jon Selby
– Jon Selby, Commented Mar 23, 2014 at 7:58

Tim Visée · Accepted Answer · 2014-07-09 11:12:10Z

3

I know this is an old question, but I was googling the problem, found this, fixed it, thought someone else googling might have the same issue.

So, to fix the problem, replace this;

public static String getResults(String q, String page_limit)
{
    return "{'id':'1','text':'test'}";
}

... with this:

public static String getResults(String q, String page_limit)
{
     return "[{ \"id\": \"1\", \"text\": \"test\" }]";
}

Also, replace this;

results: function (data) {
        return { results: data };
}

...with this:

 results: function (data) {
      return { results: JSON.parse(data.d) };
 }

edited Jul 9, 2014 at 11:12

Tim Visée

3,3084 gold badges48 silver badges59 bronze badges

answered Jul 9, 2014 at 10:50

Sodoshi

1411 silver badge5 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

chappjc · Accepted Answer · 2014-01-21 00:58:23Z

2

Try this:

ajax: {
    url: '<%= ResolveUrl("~/mypage.aspx/getResults") %>',
    dataType: 'json',
    type: "POST",
    params: {
        contentType: 'application/json; charset=utf-8'
    },
    quietMillis: 100,
    data: function (term, page) {
        return JSON.stringify({ q: term, page_limit: 10 });
    },
    results: function (data) {
        console.log(data);
        return { results: data };
    }
}

use: url: '<%= ResolveUrl("~/mypage.aspx/getResults") %>'

instead of: url: "mypage.aspx/getResults"

edited Jan 21, 2014 at 0:58

chappjc

30.6k7 gold badges79 silver badges138 bronze badges

answered Jan 21, 2014 at 0:31

Shaban

211 bronze badge

Comments

asm00 · Accepted Answer · 2013-12-30 20:04:30Z

0

The methods used for WebMethods should be static. See more details here http://encosia.com/why-do-aspnet-ajax-page-methods-have-to-be-static/

EDIT

It seems that you are setting the data property to a function object, that is then probably serialized into a string (with the body of the function as a result maybe?) instead of setting it to a plain string.

Try changing it to something like: data: JSON.stringify({ q: term, page_limit: 10 });

Besides, what is the purpose of results property in there? I don't know about it and cannot seem to find it on jQuery's documentation here: http://api.jquery.com/jquery.ajax/

edited Dec 30, 2013 at 20:04

answered Dec 30, 2013 at 19:54

asm00

7096 silver badges7 bronze badges

1 Comment

Jon Selby Over a year ago

I did try static - it made no difference - I forgot to mention that in my original post. Apologies.

Collectives™ on Stack Overflow

Select2 With Ajax Asp.net 4.0 webmethod Request

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related