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">×</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
Post a Comment