如何提取在动态生成的输入框中输入的值，并使用jquery将其传递给控制器​​？

Question

我有一个表单，其中用户可以输入输入框并单击删除它们。我想提取在这些输入框中输入的值，并使用jQuery将它们传递给控制器​​。我该怎么做？现在我正在使用id来提取值，但我不认为这是一个更好的方法，因为假设我添加4个选项然后我删除所有这些然后再添加输入，我将无法跟踪这些ID并提取值。

这是我的HTML代码：

<button type="button" class="addoption" id="addoption_btn">Add more option</button>
<div id="Options">
<input type="text" name="mytext[]" id="option_1" placeholder="Option 1"/>
</div>

这是我的JavaScript：

var MaxOptions       = 4; //maximum input boxes allowed
    var Optionsform   = $("#Options"); //Input boxes wrapper ID
    var AddButton       = $("#addoption_btn"); //Add button ID
    var x = Optionsform.length; //initial text box count
    var OptionCount=1; //to keep track of text box added  
    $(AddButton).click(function (e)  //on add input button click
{
        if(x <= MaxOptions) //max input box allowed
        {
            OptionCount++; //text box added increment
            //add input box
            $(Optionsform).append('<div><input type="text" name="mytext[]" id="option_'+ OptionCount +'" placeholder="Option '+ OptionCount +'"/><a href="#" class="removeclass">&times;</a></div>');
            x++; //text box increment
        }
return false;
});

$("body").on("click",".removeclass", function(e){ //user click on remove text
        if( x > 1 ) {
                $(this).parent('div').remove(); //remove text box
                x--; //decrement textbox
        }
return false;
}); 

这是我用来将数据传递给控制器​​的jQuery：

    $("#addquestion_btn").click(function(){
        var val= CKEDITOR.instances['question_topic'].getData();
           storequestion(val);        
    });


function storequestion(ques)
    {
        $.post("/instructor/store/question",{
            question: ques,
            option1: $("#option_1").val(),
            option2: $("#option_2").val()
        },function(data){
            if(data[0]==="success")
                {
                    window.location.href = '/instructor/create/topics';
                }
                else
                    {
                        alert("fails");
                        window.location.href = '/instructor';
            //redirect to further page to enter courses
        }}
    ,'json');


    } 

Answer 1

请使用下面提到的代码来阅读所有显示的选项。

function storequestion(ques) {
            obj = {};
            obj[question] = ques;
            $("#Options:input[name*='mytext']").each(function (index) {
                obj['option' + index] = $(this).val();
            });

            $.post("/instructor/store/question", obj
                , function (data) {
                    if (data[0] === "success") {
                        window.location.href = '/instructor/create/topics';
                    }
                    else {
                        alert("fails");
                        window.location.href = '/instructor';
                        //redirect to further page to enter courses
                    }
                }
                , 'json');


        }