MVC Ajax 调用 Controller 方法与参数连接但参数值为 null

Question

I am able to connect my ajax call to the controller, but the parameter is showing as null when it reaches the controller. What is the correct way for me to pass parameters with this call? '''

  //In the Index Controller
  [HttpGet]
    public IActionResult TestFunction(string par1)
    {
        int i = 2;
        return view()
    } 

    function onDropDownChange() {
    alert('We are starting to call function');

    var url = '/Index/TestFunction/Cat'
    $.ajax({
        url: url,
        data: {},
        type: 'GET',
        datatype: 'json',
        success: function (data) { alert('Successful call') },
        error: function () {alert('Failed Call')}
        })
}  

   '''

Answer 1

Use data option of ajax. You can send data object to server by data option in ajax.

Example--

 function onDropDownChange() {

    var url = '/Index/TestFunction/Cat'
    $.ajax({
        url: url,
        data: {par1: "Some value"},//pass your obect
        type: 'GET',
        datatype: 'json',
        success: function (data) { alert('Successful call') },
        error: function () {alert('Failed Call')}
        })
}  

Answer 2

Please check this bind drop-down value in controller action

function onDropDownChange(elem) {
    alert('We are starting to call function');

    var url = '/Index/TestFunction/Cat'
    $.ajax({
        url: url,
        data: {par1:$(elem).val()},
        type: 'GET',
        datatype: 'json',
        success: function (data) { alert('Successful call') },
        error: function () {alert('Failed Call')}
        })
}  

In view need to pass this argument while calling this function.

Like eg

<select onchange="onDropDownChange(this)">
///<option> tag
</select>