Passing a parameter through AJAX but displayed null in the MVC method

Question

I new with MVC and I'am trying to display a method with AJAX. The problem is that the parameter that I am passing into the method is display to be null, but when I debug the ajax code the parameter is not null. I don't know what I'm doing wrong.

This is my c# method

 public JsonResult AllAccountList(int accountID)
{
    Client myClient = new AccountServiceClient().GetClientByUsername(System.Web.HttpContext.Current.User.Identity.Name);

    IEnumerable<Account> myAccounts = new AccountServiceClient().GetAccountWithClient(myClient.ClientID);
    List<AccountModel> myList = new List<AccountModel>();

    foreach (Account a in myAccounts.Where(a => a.AccountID == Convert.ToInt32(accountID)))
    {
        myList.Add(new AccountModel() { AccountID = a.AccountID,TypeID_FK = a.TypeID_FK, FriendlyName = a.FriendlyName, Currency = a.Currency, AvailableBalance = a.AvailableBalance});
    }

    return Json(myList, JsonRequestBehavior.AllowGet);
}

and this is my AJAX

function btnSelectClicked(AccountID) {
            var params = '{"accountID":"' + AccountID + '"}';
            $.ajax({
                type: "POST",
                url: "/Account/AllAccountList",
                data: params,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (data) {
                    var gridview = "<table>";
                    gridview += "<tr><td id='titleCol'>AccountId</td><td id='titleCol'>Account Type</td><td id='titleCol'>Friendly Name</td><td id='titleCol'>Currency</td><td id='titleCol'>Available Balnce</td></tr>";
                    for (var i = 0; i < data.length; i++) {
                        gridview += "<tr><td>" + data[i].AccountID +
                                    "</td><td>" + data[i].TypeID_FK +
                                    "</td><td>" + data[i].FriendlyName +
                                    "</td><td>" + data[i].Currency +
                                    "</td><td>" + data[i].AvailableBalance + "</td></tr>";
                    }
                    gridview += "</table>";
                    $("#display2").html(gridview);
                },

                error: function (xhr,err) {
                    alert(xhr.responseText + "An error has occurred during processing your request.");
                }
            });
        };

Have you tried using fiddler to monitor what is actually being sent to the server from your client? — JP.
– JP., Commented Apr 5, 2013 at 14:11
I fond the error, one need to remove this part "contentType: "application/json; charset=utf-8"," — Eliza
– Eliza, Commented May 15, 2013 at 15:40

Nick Albrecht · Accepted Answer · 2013-04-05 14:16:26Z

1

Try changing

var params = '{"accountID":"' + AccountID + '"}';

to

var params = {accountID: AccountID };

And see if that helps

UPDATE: I didn't expect that to complain about a function... granted when ever I use the jquery ajax methods I use the specific one I need rather than the root ajax() method. Try this maybe.

function btnSelectClicked(AccountID) {
    var params = {accountID: AccountID };
    $.post("/Account/AllAccountList", data, function(data) {
        var gridview = "<table>";
            gridview += "<tr><td id='titleCol'>AccountId</td><td id='titleCol'>Account Type</td><td id='titleCol'>Friendly Name</td><td id='titleCol'>Currency</td><td id='titleCol'>Available Balnce</td></tr>";
            for (var i = 0; i < data.length; i++) {
                gridview += "<tr><td>" + data[i].AccountID +
                            "</td><td>" + data[i].TypeID_FK +
                            "</td><td>" + data[i].FriendlyName +
                            "</td><td>" + data[i].Currency +
                            "</td><td>" + data[i].AvailableBalance + "</td></tr>";
            }
            gridview += "</table>";
            $("#display2").html(gridview);
        });
    })
    .fail(function(jqXHR, textStatus, errorThrown ){
        alert(jqXHR.responseText + "An error has occurred during processing your request.");
    });
};

edited Apr 5, 2013 at 14:16

answered Apr 5, 2013 at 14:04

Nick Albrecht

17k11 gold badges72 silver badges101 bronze badges

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

1 Comment

Nick Albrecht Over a year ago

What happens if you hit something like /Account/AllAccountList?accountid=1234 in your browser? If you have an [HttpPost] atttribute on your AllAccountList action, try taking off for testing the url.

Collectives™ on Stack Overflow

Passing a parameter through AJAX but displayed null in the MVC method

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related