Making an AJAX request to an MVC controller and getting the data from the response in js

Question

On button click I am trying to send a product name value that the user enters into a textbox to the server to be modified and then back to the page using AJAX. I am getting into the ChangeName method in the controller but not getting into my success function to alert the new name.

The JS:

    $("#changeNameButton").click(function () {
        var productName = $("#Name").val();

        $.ajax({
            url: '/Products/ChangeName/',
            type: 'POST',
            dataType: 'JSON',
            data: {name: productName},
            success: successFunc
        });
    });


    function successFunc(data) {
        alert(data);
    }

The controller:

    public string ChangeName(string name)
    {
        string changedName = ChangeNameHelper(name);
        return changedName;
    }

If anyone can give recommendations on the proper way to make asynchronous calls to a controller in MVC5/6 this would be great.

My main problem is that I am never getting into the successFunc() on response.

You might wanna return name; rather than return ChangeName(name) as you're making recusive calls. — guysigner
– guysigner, Commented Jan 19, 2016 at 19:19
It looks like the ChangeName function just calls itself, which would result in an infinite loop. It never gets to success because the server would never return a response to the client. — neilsimp1
– neilsimp1, Commented Jan 19, 2016 at 19:20
@remdevtec I am now setting the new changed name to a variable then trying to return it, but the alert still isn't happening. Can you return just a string back to AJAX? Or do I have to return a JsonResult or ActionResult instead? — Blake Rivell
– Blake Rivell, Commented Jan 19, 2016 at 19:32
@BlakeRivell It looks like it's doing the same thing. By calling ChangeName(name) as the first line, you'll just keep calling the ChangeName function infinitely. You either need to call another function (to do some work) or just return name; — neilsimp1
– neilsimp1, Commented Jan 19, 2016 at 19:35
I apologize! in my actual code ChangeName is a helper function with a different name. Now look at my updated code. — Blake Rivell
– Blake Rivell, Commented Jan 19, 2016 at 19:37

guysigner · Accepted Answer · 2016-01-19 19:37:29Z

1

Regarding your comment, if you return just a string MVC will convert that to json.

Now, in your updated code you still call a method inside itself. Please call string changedName = ChangeNameForResult(name); or any function with another name.

answered Jan 19, 2016 at 19:37

guysigner

2,9221 gold badge21 silver badges24 bronze badges

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

1 Comment

Blake Rivell Over a year ago

I think my problem is that I am never getting into my success function. Not sure what could be going wrong. I see in the debugger in the controller that it returns the changed name string.

lyz · Accepted Answer · 2016-01-19 19:49:22Z

0

Install Newtonsoft.Json via nuget package manager and in your controller do this

Public ActionResult ChangeName(string name)
{
     // get your object you want to serialize let's say res
     return JsonConvert.SerializeObject(res);

}

edited Jan 19, 2016 at 19:49

answered Jan 19, 2016 at 19:47

lyz

5587 silver badges17 bronze badges

7 Comments

Blake Rivell Over a year ago

I think you have me on the right track but I am not dealing with objects in this case. Just a simple string that I want to return. Can res be a string? Intellisense is saying no.

lyz Over a year ago

return Content(YourString, "application/json");

Blake Rivell Over a year ago

Still not able to alert the response. I am getting a 200OK in the network tab which is strange.

lyz Over a year ago

Did you change your action returning ActionResult instead of string ??

Blake Rivell Over a year ago

Yes, but still not getting into the success function to alert the data result. And by the way is that something that is required when using jQuery AJAX?

|

Blake Rivell · Accepted Answer · 2016-01-20 15:40:54Z

0

I needed to set dataType: 'text' rather than JSON since I am returning a simple string.

dataType is the type of data being returned and contentType is the type of data being sent.

answered Jan 20, 2016 at 15:40

Blake Rivell

14k33 gold badges133 silver badges261 bronze badges

Collectives™ on Stack Overflow

Making an AJAX request to an MVC controller and getting the data from the response in js

3 Answers 3

1 Comment

7 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

7 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related