CODEWITHSUNDEEP
asp.net-mvc-3model-view-controllerjquerykendo-ui
ProfK
ProfK

Reputation: 51063

How to compose and post a JSON object from jQuery to an MVC3 action method?

I have the following JavaScript code that gets the Id property (Guid) from every user row in a Kendo UI grid. Now I am wondering how best to compose these Id's and the owner roleId into a JSON object that I can pass to an MVC3 action method. Versus my silly string concat.

$("#command-add-selected").click(function () {
    var json = "roleId: '51FC554E-353C-4D55-BE52-1B4BF9D2F17F', users: [";
    var avail = $("#availableUsersGrid").data().kendoGrid._data;
    for (var i = 0; i < avail.length; i++) {
        json += "{ Id: '" + avail[i].Id + "'},";
    }
    json = json.slice(0, -1);
    json += "]";
    alert(json);
    return false;
});

The action method can be GET or POST and need not return any value (this is another puzzle here, no returned view). All it does is domain updates that are fetched by other ajax code subsequent to the above code.

How can I pass the above type JSON to an action method essentially of void return type?

EDIT: This question answered the minor part of my question nicely, with how to dynamically add items to an array with push.

Upvotes: 0

Views: 1670

Answers (3)

Parv Sharma
Parv Sharma

Reputation: 12705

1.first of all u dont need to create the full json ur self use JSON.Stringify() method to change the javascript object to JSON string.
2.after u have created the JSON string u can GET or POST it to any normal method in any MVC Controller of visibility public. even if the signature of the action method is like public ActionResult MehodName(string jsonString) u can always return null.
3. u can use built in JavaScriptSerializer class in System.Web.Script.Serialization namespace to deserialize the json string u recieve in the action to create an object with the same propertiese
Edit:-
make a javascript array names users then inside the for loop use .push() function of javascript to insert the objects like this 

var users = [];
for(something)
{
var user = {"Id":"YOUR ID VALUE"};
users.push(user)
}
var objectToSerialize = {"roleId":"YOUR ROLE GUID","Users":users};
var jsonString = JSON.stringify(objectToSerialize);

Edit 2:-
so going by your previous comments u dont want that u need to deseralize the whole JSON object. going by your object architecture even if ur action method has a signature like this

public ActionResult GetUsersByRole(Users users)
{
//some code 
}

and Users class like this one

class Users
{
public string RoleId{get; set;}
public User[]{get; set;}
}

and User class like this

class User
{
string Id{get; set;}
}

it would automatically bind property with your complex users object

Upvotes: 4

Steve Mallory
Steve Mallory

Reputation: 4283

In conjunction with Parv Sharma's solution:

function User(id) { this.Id=id; }

$("#command-add-selected").click(function () {

    var avail = $("#availableUsersGrid").data().kendoGrid._data;
    var userArray = array();
    for (var i = 0; i < avail.length; i++) {
        userArray.push(new User(avail[i].Id));
    }
    var obj = {roleId:'51FC554E-353C-4D55-BE52-1B4BF9D2F17F',users:userArray};
    alert(JSON.stringify(obj));
    return false;
});

Upvotes: 1

Phillip Schmidt
Phillip Schmidt

Reputation: 8818

Should just be able to use Url.Action("NameofAction","nameofcontroller", json); You may have to add an AcceptVerbs attribute to the action method as well, depending on if you want it to be a GET or a POST. As far as the building part goes, I would suggest not using strings at all. Jsons are objects, not strings, so I would go ahead and build a "users" object with your foreach loop and then throw that object into your json return object.

edit: forgot to mention stringify. Yeah. Use that.

Upvotes: 0

Related Questions