1

My javascript function is calling my MVC 4 controller, but the parameter is always null. This seems to be a common problem, and I've tried a few things I've researched, but nothing is working. Any idea why it's always null?

My javascript GetEntries() function correctly creates an alert that shows the value:

function GetEntries(firstLetter) {
    alert(firstLetter);
    $.post('/Home/GetEntries',
           firstLetter,
           EntriesReceived());
}

My controller method breakpoint gets hit:

public void GetEntries(string firstLetter)
{
    Debug.WriteLine(firstLetter);
}

However, firstLetter is always null. I'm not sure what to do.

Failed attempts:

I tried posting using JSON.stringify.

function GetEntries(firstLetter) {
    alert(firstLetter);
    var firstLetterAsJson = JSON.stringify(firstLetter);
    $.post('/Home/GetEntries',
           { jsonData: firstLetterAsJson },
            EntriesReceived());
}

I tried adding the HttpPost attribute to my controller:

[HttpPost]
public void GetEntries(string firstLetter)
{
    Debug.WriteLine(firstLetter);
}

I tried changing the parameter name to "id" to match my route mapping:

[HttpPost]
public void GetEntries(string id)
{
    Debug.WriteLine(id);
}

1 Answer 1

4

The following should work

function GetEntries(firstLetter) {
    $.post('/Home/GetEntries', { firstLetter: firstLetter }, EntriesReceived);
}

Also notice how the EntriesReceived callback is passed to the $.post function as third argument. In your code you seem to be calling the function (EntriesReceived()) instead of passing it as callback. Here I assume that this function is defined like this:

function EntriesReceived(result) {
    // handle the result of the AJAX call here
}

And if you want to send it as a JSON request you should use the $.ajax method which allows you to specify the proper request content type:

function GetEntries(firstLetter) {
    $.ajax({
        url: '/Home/GetEntries',
        type: 'POST',
        contentType: 'application/json; charset=utf-8',
        data: JSON.stringify({ firstLetter: firstLetter }),
        success: function(result) {
            // handle the result of the AJAX call here
        }
    });
}

Another problem I see with your controller action is that you defined it as void. In ASP.NET MVC the common established convention is that all controller actions must return instances of the ActionResult class. But if you don't want to return anything to the client then use the specific ActionResult for this case - EmptyResult:

[HttpPost]
public ActionResult GetEntries(string firstLetter)
{
    Debug.WriteLine(firstLetter);
    return new EmptyResult();
}
Sign up to request clarification or add additional context in comments.

2 Comments

That worked. I really appreciate the quick help. In my research of the problem, I didn't see anywhere where it said to do { firstLetter: firstLetter }. Maybe I just missed it. Thank you!
And, yes, there is an EntriesReceived() function defined like you stated. And I agree about not returning void. I just haven't gotten that far yet. Great tips. Your thorough and accurate answer are really appreciated. You've helped me more than you know over the past few months. Thanks again.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.