javascript - How can I extract the values entered in the input boxes generated dynamically and pass it to controller using jquery? -


i have form wherein user can enter input boxes , remove them @ click. want extract values entered in these input boxes , pass them controller using jquery. how do that?right using ids extract values not think better method because suppose add 4 options , remove of them , again add inputs, not able track these ids , extract values.

here html code:

<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> 

here 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; });  

here jquery using pass data controller:

    $("#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 further page enter courses         }}     ,'json');       }  

please use below mentioned code read through displayed options.

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 further page enter courses                     }                 }                 , 'json');           } 

Comments

Popular posts from this blog

c# - How to get the current UAC mode -

postgresql - Lazarus + Postgres: incomplete startup packet -

javascript - Ajax jqXHR.status==0 fix error -