pass value to controller by using ajax

Question

I want to pass value from view to controller by using ajax.

 <button onclick="addCommentByAjax()" >Save</button>

My script:

function addCommentByAjax() {
    $.ajax({
        type: "POST",
        url: '/Survey/DoDetailSurvey',

        data: {
            choiceId: "1"
        }


});
}

Controller:

 [HttpPost]
    public ActionResult DoDetailSurvey(SurveyViewModel model, string choiceId)
    {
     //
    }

but choiceId always null

Answer 1

Change couple of things.

First assign an id or class to your button.Second remove inline onclick function and use ajax click function.Then specify the request type as Post.

$('#btnComment').click(function () {       
    var choiceId = $('#YourChoiceId').val();

    $.ajax({
        url: '/Survey/DoDetailSurvey',
        data: { 'choiceId' : choiceId},
        type: "post",
        cache: false,
        success: function (response) {
           //do something with response
        },
        error: function (xhr, ajaxOptions, thrownError) {
             alert('error occured');
        }
    });
});

Then your controller should look like this

[HttpPost]
public ActionResult DoDetailSurvey(string choiceId)
{
     //
}

I don't know how you are populating your viewmodel,so I purposely removed them and shown an working example.

In case you want to pass viewmodel you should construct your data object like this:

var data = {};
data.Property1 = some val;
data.Property2 = "some val";   

$.post('/Survey/DoDetailSurvey', data);

Sample structure of SurveyViewModel I assume:

public class SurveyViewModel 
{
    public int Property1 { get; set; }
    public string Property2 { get; set; }
}

Answer 2

Since there are two parameter in your controller, you need to identify them both form the client side. Further, you should specify the contentType .

You spread the payload like so:

function addCommentByAjax() {
    var payload =  {
        model: {
        // whatever properties you might have
        },
        choiceId: 1
    };

    $.ajax({
        type: "POST",
        url: '/Survey/DoDetailSurvey',
        contentType: 'application/json',
        data: JSON.stringify(payLoad)
    });
}

Answer 3

function addCommentByAjax() {
$.ajax({
    type: "POST",
    url: '/Survey/DoDetailSurvey?choiceId=1'
    }
});
}

You can also pass like this

or for more parameters

function addCommentByAjax() {
$.ajax({
    type: "POST",
    url: '/Survey/DoDetailSurvey?choiceId=1&Name=Arun'
    }
});
}