数据从 AJAX 调用传递到 Controller 但得到 null 值

Question

From below code i want to send data to my controller but when i add debug point to my controller function then receiving all the values null. I dont to replace datatype is text to json.

jQuery.ajax({
            url: "../VisitorEntry/SaveVisitorEntry",
            type: "POST",
            //data: "{visitpurpose:'" + visitpurpose + "'}",
            data: {
                visitpurpose: visitpurpose,
                txt_visitor_name: txt_visitor_name,
                txt_company_name: txt_company_name,
                txt_emp_name: txt_emp_name,
                txt_phone: txt_phone,
                txt_designation: txt_designation,
                txt_address: txt_address,
                txt_country_name: txt_country_name,
                txt_state_name: txt_state_name,
                txt_city_name: txt_city_name
            },
            dataType: "text",
            traditional: true,
            //contentType: "application/json; charset=utf-8",
            processData: false,
            success: function (response) {

                debugger
                jQuery("#wait").css("display", "none");
                
                QrCodeImage.setAttribute('src', "data:image/jpg;base64," + response);

            },
            error: function (response) {
                debugger
                jQuery("#wait").css("display", "none");
                console.log(response.responseText);
            }
        });

Below is my function on controller where i want to receive all the values but receiving null.

[HttpPost]
        public ActionResult SaveVisitorEntry(string visitpurpose, string txt_visitor_name, string txt_company_name, string txt_emp_name, string txt_phone,
            string txt_designation, string txt_address, string txt_country_name, string txt_state_name, string txt_city_name, string txt_emp_number)
        {
            VisitorEntryDA pdm = new VisitorEntryDA();
            DataSet dataSet = new DataSet();
            Bitmap qrCodeImage = null;
            dataSet = pdm.visitorEntry(visitpurpose, txt_visitor_name, txt_company_name, txt_emp_name, txt_phone,
                txt_designation, txt_address, txt_country_name, txt_state_name, txt_city_name, txt_emp_number);
            
            for (int i = 0; i < dataSet.Tables[0].Rows.Count; i++)
            {
                string iserror = dataSet.Tables[0].Rows[i]["iserror"].ToString();
                string message = dataSet.Tables[0].Rows[i]["message"].ToString();
                string id = dataSet.Tables[0].Rows[i]["visitor_id"].ToString();
                QRCodeGenerator qrGenerator = new QRCodeGenerator();
                //var data = { "visitpurpose":visitpurpose};
                QRCodeData qrCodeData = qrGenerator.CreateQrCode(id, QRCodeGenerator.ECCLevel.Q);
                QRCode qrCode = new QRCode(qrCodeData);
                qrCodeImage = qrCode.GetGraphic(20);
                ImageConverter converter = new ImageConverter();
            }
            
            return Content(Convert.ToBase64String(BitmapToBytes(qrCodeImage)));
        }

Answer 1

For one, make your life easier by changing your parameter list in c# to a single class (in my example DTO just means Data Transfer Object):

public class VisitorDto 
{ 
    public string visitpurpose {get;set;} 
    public string txt_visitor_name {get;set;}  
    public string txt_company_name {get;set;} 
    public string txt_emp_name {get;set;} 
    public string txt_phone {get;set;} 
    public string txt_designation {get;set;} 
    public string txt_address {get;set;}  
    public string txt_country_name {get;set;}  
    public string txt_state_name {get;set;} 
    public string txt_city_name {get;set;} 
    public string txt_emp_number {get;set;} 
 }

And have that in your method like:

public ActionResult SaveVisitorEntry(VisitorDTO model){
   ...
}

You could also then remove the prefixing of txt_ as it's a bit cumbersom but I'll leave that up to you.

It might just work after that.

Since in your Ajax class your Data: is an object as you've declared it like Data: {} .

{} - is object syntax in javascript. So likely the reason it's null when arriving at your controller is because you've sent an object but the controller is expecting strings.