Kala J Kala J - 5 months ago 11
jQuery Question

How can I prevent passing in multiple parameters to controller?

Right now I have a form that contains 6 security questions and 6 security answers. I've been trying to refactor my code and I'm running into an interesting situation that I'm not sure on how to proceed.

Here's my view:

var RequestSecurityQuestions_Submit = function () {

ValidationAttribute.BlankValue(true);
var form = $('form#RequestSecurityQuestions');
$.validator.unobtrusive.parse(form);

var d = $('form#RequestSecurityQuestions').serialize();
SecurityQuestionsValid = true;

var inputs = $('form#RequestSecurityQuestions').find('input[data-val]');
$.each(inputs, function (index) {
var input = inputs[index];
if (!$(input).valid()) {
SecurityQuestionsValid = false;
}
});

var dataObject = {}, dropdowns = $("input.customdropdownlist");

for (var i = 0; i < 6; i++) {
dataObject['question' + i] = $(dropdowns[i]).data("kendoDropDownList").value()
}

for (var i = 1; i < 7; i++) {
dataObject['answer' + i] = $('#idAnswer' + i).val();
}

var dataToPass = JSON.stringify(dataObject);

if (SecurityQuestionsValid) {

$.ajax({
url: Url.getFullUrl('Account/RequestSecurityQuestions_Submit'),
type: 'Post',
data: { securityInfo: dataToPass },
dataType: 'json',
cache: false,
success: function (data) {

//Next Dialog
},
error: AjaxLog.HandleAjaxCallFail
});
}
return SecurityQuestionsValid;
}


I get a dataObject which contains all the values from my view and I want to pass it to the controller.

Currently this works:

[AllowAnonymous]
[HttpPost]
public ActionResult RequestSecurityQuestions_Submit(string answer1, string answer2, string answer3, string answer4, string answer5, string answer6, string question1, string question2, string question3, string question4, string question5, string question6)
{
SecurityQuestions securityQuestions = new SecurityQuestions();

if (!string.IsNullOrEmpty(answer1))
{
securityQuestions.ChallengeA1 = answer1;
}
if (!string.IsNullOrEmpty(answer2))
{
securityQuestions.ChallengeA2 = answer2;
}
if (!string.IsNullOrEmpty(answer3))
{
securityQuestions.ChallengeA3 = answer3;
}
//etc....
}


However, I am passing in 12 parameters to my controller which sounds like a no-no to me. Is there another way to pass in my data from my view to my controller without having to pass in 12 parameters?

EDIT:

New controller attempt:

/*Problem: securityInfo array looks like: ""{\"question0\":\"2\",\"question1\":\"3\",\"question2\":\"4\",\"question3\":\"5‌​\",\"question4\":\"7\",\"question5\":\"1\",\"answer1\":\"fgfg\",\"answer2\":\"fgf‌​gf\",\"answer3\":\"fgfg\",\"answer4\":\"fgfgfg\",\"answer5\":\"fgfg\",\"answer6\"‌​:\"fggf\"}"" */

[AllowAnonymous]
[HttpPost]
public ActionResult RequestSecurityQuestions_Submit(string[] securityInfo)
{
SecurityQuestions securityQuestions = new SecurityQuestions();

}

Answer

There are multiple ways to achieve this of course, the following is one of them. A better one would be to restructure your code as per other answers/comments.

// Creating your array
var dataObject = [], 

dropdowns = $("input.customdropdownlist");

//Populate your array. [0-5] will be questions and [6-11] will be answers .

    for (var i = 0; i < 6; i++) {
        if (i < 6){
            dataObject[i] = $(dropdowns[i]).data("kendoDropDownList").value()
        }
        else {
            var d = i - 5;
            dataObject[i] = $('#idAnswer' + d).val();
        }
    }

// Your AJAX call with contentType

            $.ajax({
                url: Url.getFullUrl('Account/RequestSecurityQuestions_Submit'),
                type: 'Post',
                data: JSON.Stringify(dataObject), //Change data format to JSON array, will be received as array in backend
                contentType: "application/json",
                cache: false,
                success: function (data) {

                    //Next Dialog
                },
                error: AjaxLog.HandleAjaxCallFail
            });

And simply receive the array in your backend

public ActionResult RequestSecurityQuestions_Submit(List<String> data)
        {
//Your code here
        }
Comments