ajax call to Controller Action with an Object as parameter

Question

I have an ajax call to a Controller on an ASP.NET MVC solution that looks like this:

$.ajax({
        url: "ControllerClass/ControllerMethod?date=" + date,
        type: "POST",
        dataType: 'json',
        contentType: 'application/json; charset=utf-8',
        success: function (result) {
            globalVariable = result; // This is for later...
            DoSomething(result);
        },
        async: true,
        processData: false
    })

The controller once it has done all the work on the server side, it returns an Object which contains different property types (an Int, an Array of Int and a List of Objects)

The way that I return that data from the controller back to the JS file is...

return Json(new
{
   summary = objectResult
});

The point is that from the JavaScript, now I would like to call a different Controller with the information that I have stored on my globalVariable which is defined in my JavaScript like this:

var globalVariable

That var located at the top of my JS file...

Well, the way I am trying to call back my controller with that variable looks like this:

$.ajax({
                url: "ControllerClass/ControllerMethod?result=" + globalVariable,
                type: "POST",
                dataType: 'json',
                contentType: 'application/json; charset=utf-8',
                success: function (result) {
                    DoSomethingNewWithThisresult(result)
                },
                async: true,
                processData: false
            })

And this is my controller in C#.

public IActionResult ControllerMethod(JsonResult result)
{
     DoSomethingHereWithTheResult(result);       
}

Why if I put a breakpoing on my last controller, the result variable is empty? I checked on Chrome that the variable contains all the data that I am looking for. Actually, if I just pass one of the properties of the object, it goes to the controller just fine but I can't pass the whole Object...

esiprogrammer · Accepted Answer · 2016-03-03 23:32:26Z

1

Try to create your own custom Model instead of using JsonResult as parameter in the action and use it in ajax call this way:

$.ajax({
            url: "ControllerClass/ControllerMethod",
            type: "POST",
            dataType: 'json',
            data: { Summary: globalVariable.summary},
            contentType: 'application/json; charset=utf-8',
            success: function (result) {
                DoSomethingNewWithThisresult(result)
            }
        })


public class YourClass
{
    public string Summary { get; set;}//// string type or whatever it is
}

public IActionResult ControllerMethod(YourClass result)
{
     DoSomethingHereWithTheResult(result);       
}

alternatively you can also use JSON.stringify to serialize your object this way:

   var customObject={
"Summary" : globalVariable.summary
};

  $.ajax({
            url: "ControllerClass/ControllerMethod",
            type: "POST",
            dataType: 'json',
            data: JSON.stringify(customObject),
            contentType: 'application/json; charset=utf-8',
            success: function (result) {
                DoSomethingNewWithThisresult(result)
            }
        })

edited Mar 3, 2016 at 23:32

answered Mar 3, 2016 at 23:26

esiprogrammer

1,4381 gold badge18 silver badges22 bronze badges

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

1 Comment

user3587624 Over a year ago

that was exactly what I needed! I wasn't aware of the data property on ajax :) Thanks!

zaid safadi · Accepted Answer · 2016-03-03 18:56:02Z

0

Assuming this is a Web API controller, there are multiple ways to read a complex type from the URL - (there are also similar options to MVC controllers)

If the parameters are passed in the UrL, and assuming they map 1:1 to your object, you can decorate your object with the [FromUri] attribute, example:

public class GeoPoint
{
    public double Latitude { get; set; } 
    public double Longitude { get; set; }
}

public ValuesController : ApiController
{
    public HttpResponseMessage Get([FromUri] GeoPoint location) { ... }
}

Another option which gives you more flexibility controlling the creation of your object and populating the parameters is by using the IModelBinder interface and [ModelBinder] attribute.

You can implement the IModelBinder interface with the only method "BindModel" to access the HTTP request just right before your Controller method is called, create your object, read the URL query params, set the values in your object then finally assign it to the Model property of the bindingContext:

A simple example would be like this:

public bool BindModel(HttpActionContext actionContext, ModelBindingContext bindingContext)
{
   if (bindingContext.ModelType == typeof(MyComplexType))
   {
      MyComplexType model ;

      //You can use the value provider or get it from the HttpRequest
      //var theValue = bindingContext.ValueProvider.GetValue ( bindingContext.ModelName);
      //var theValue = request.RequestUri.ParseQueryString ( ) ;
      if ( new MyComplexTypeConverter( ).TryParse ( actionContext.Request, out model) )
      { 
         bindingContext.Model = model;

         return true;
      }
      else
      { 
         bindingContext.ModelState.AddModelError( bindingContext.ModelName, "Cannot convert request to MyComplexType");

         return false;
      }
   }

   return false ;
}

Here is a reference documentation: http://www.asp.net/web-api/overview/formats-and-model-binding/parameter-binding-in-aspnet-web-api

edited Mar 3, 2016 at 18:56

answered Mar 3, 2016 at 18:50

zaid safadi

6997 silver badges15 bronze badges

2 Comments

user3587624 Over a year ago

Maybe I misunderstood this information but I think this is not what I really need. I do not need to gather the parameters from the URL but from the JSON data that I have generated after executing the first call to my controller through the first ajax call. My URL doesn't contain any parameter at any time, btw. Thanks!

zaid safadi Over a year ago

In your question you are appending the globalVariable to the URL of the Ajax call like this: url: "ControllerClass/ControllerMethod?result=" + globalVariable, your result parameter value is what needs to be mapped to a controller parameter

Collectives™ on Stack Overflow

ajax call to Controller Action with an Object as parameter

2 Answers 2

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related