0

I am making a simple MVC4 application with C# and jQuery. In this application, when the user presses a button with the id of SaveCheckboxChanges I send two arrays of data to the server. Then the server processes the data and saves it on the DB.

While this is happening, I want the pressed button to change. Currently, when the user clicks the button, the buttons text changes to 'Saving changes' which is good, but then it never changes back.

This happens because the success function that I send in the Ajax request is never being called, only the error function is called even though no errors happen and I get the OK answer.

Controller that receives the request:

[HttpPost]
public ActionResult UpdateCheckBoxes(int[] requiresSetupArray, int[] disabledArray)
{
    //Do operations with the requiresSetupArray and disabledArray Arrays
    DB.SaveChanges();
    return Content("OK");
}

At first i assumed this was happening because the UpdateCheckBoxes method was void and was not returning anything. But now that I changed it to what is above, only the error function is called.

Javascript code being executed:

$("#SaveCheckboxChanges").click(function (event) {
        var button = $("#SaveCheckboxChanges");
        if (!button.hasClass("disabled")) {

            button.attr('value', 'Saving changes');

            var requiresSetupArray = [1, 2];
            var disabledArray = [3, 4];

            $.ajax({
                url: '/Material/UpdateCheckBoxes',
                type: 'POST',
                contentType: 'application/json; charset=utf-8',
                dataType: 'json',
                traditional: true,
                data: JSON.stringify({ requiresSetupArray: requiresSetupArray, disabledArray: disabledArray }),
                success: function (data) {
                    alert("success " +  data);
                    button.attr('value', 'Save Checkbox Changes');
                    button.addClass('disabled');
                },
                error: function () {
                    alert("error");
                }
            });

How do I fix this? Am I forced to return something in the controller's method for the success function to run? If so what should I run?

Flame_Phoenix
  • 16,489
  • 37
  • 131
  • 266
  • "OK" is not JSON. Check out explanation in what I though should be duplicate http://stackoverflow.com/questions/2722750/ajax-datatype, but really duplicate of some "how to return JSON in ASP.Net MVC". – Alexei Levenkov Nov 07 '14 at 15:47
  • What??? I do not undertstand the link between this and datatypes, can you exlpain? – Flame_Phoenix Nov 07 '14 at 15:49
  • I do not want to return anything. All I want is to run the *success* method. – Flame_Phoenix Nov 07 '14 at 15:52
  • 2
    That exactly what happened with the post - you expecting "answer" but random person just provided stupid comment - so complete failure... If you look at your code it expects "json" as result, but your controller returns random text - so the only option for ajax call is to fail. – Alexei Levenkov Nov 07 '14 at 15:52
  • 1
    Can you make sure you always print JSON code? Don't send 'OK', but (for example) send {"message": "OK"} – Emmanuel Delay Nov 07 '14 at 16:02

1 Answers1

1

If you don't expect your method to return anything - don't require JSON as result:

$.ajax({


       url: '/Material/UpdateCheckBoxes',
        type: 'POST',
        contentType: 'application/json; charset=utf-8',
        //  dataType: 'json', - remove this line.
        traditional: true,
        data: JSON.stringify({ requiresSetupArray: requiresSetupArray, disabledArray: disabledArray }),
        success: function (data) {
            alert("success " +  data);
            button.attr('value', 'Save Checkbox Changes');
            button.addClass('disabled');
        },
        error: function () {
            alert("error");
        }
    });
Alexei Levenkov
  • 98,904
  • 14
  • 127
  • 179