html - Javascript dynamic array window with multiple answer options -
i'm working on multiple arrays , occured 1 problem. when have 1 question div generated can add additional questions without problem, if add question div, can't add additional questions neither of both windows(same applies other number too), error newdiv[counterq] undefined. can me issue? thanks!
also, how can move div addoption below created new 1 option input?
i'm new @ programming sorry if won't explain in correct terms. thanks!
edit: updated new problem. didn't wanted create seperate topic.
html :
var counterq = 0; var limitq = 3; var countero = 0; var limito = 5; function addcontent(divname) { countero = 0; if (counterq == limitq) { alert("you have reached limit of adding " + counterq + " inputs"); } else { var newdiv = new array() newdiv[counterq] = document.createelement('div'); newdiv[counterq].classname = "contentwindow[" + counterq + "]"; newdiv[counterq].innerhtml = "<p class='contentquestion'>question " + (counterq + 1) + " </p> <input type='text' class='addquestioninput' value='type question' name='myquestion[" + counterq + "]'>"; if (countero == limito) { alert("you have reached limit of adding " + countero + " options"); } else { newdiv[counterq].innerhtml += "<div class='optioninputouterwindow'><span class='optioninputdescription'>option " + (countero + 1) + "</span> <input type='text' class='addoptioninput' name='myquestion[" + counterq + "]"+"[myinputs]"+"[" + countero + "]'></div>"; newdiv[counterq].innerhtml += "<div class='optioninputouterwindow'><span class='optioninputdescription'>option " + (countero + 2) + "</span> <input type='text' class='addoptioninput' name='myquestion[" + counterq + "]"+"[myinputs]"+"[" + (countero+1) + "]'></div>"; document.getelementbyid(divname).appendchild(newdiv[counterq]); countero += 2; addoption = function() { var counterq = 0; var limito = 5; if (countero == limito) { alert("you have reached limit of adding " + countero + " options"); } else { newdiv[counterq].innerhtml += "<div class='optioninputouterwindow'><span class='optioninputdescription'>option " + (countero + 1) + "</span> <input type='text' class='addoptioninput' name='myquestion[" + counterq + "]"+"[myinputs]"+"[" + countero + "]'></div>"; $("div[class*=contentwindow]").css("height", "+=27"); countero++; } }; } $(".container").css("height", "+=344"); newdiv[counterq].innerhtml += "<div class='addoption' onclick='addoption();'><img src='/img/plussmall.png'>add option</div>"; counterq++; } }<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="content"></div> <div class="addcontent" onclick="addcontent('content');" > <img src="/img/plussmall.png">add content </div>
if want counter increase 2, use countero += 2 instead of countero++.
var counterq = 0; var limitq = 3; var countero = 0; var limito = 5; function addcontent(divname) { if (counterq == limitq) { alert("you have reached limit of adding " + counterq + " inputs"); } else { var newdiv = new array() newdiv[counterq] = document.createelement('div'); newdiv[counterq].classname = 'new-rect'; if (counterq == limito) { alert("you have reached limit of adding " + countero + " options"); } else { newdiv[counterq].innerhtml = "entry " + (countero + 1) + " <br><input type='text' name='myinputs[" + countero + "]'><br>entry " + (countero + 2) + " <br><input type='text' name='myinputs[" + countero + "]'><br>"; document.getelementbyid(divname).appendchild(newdiv[counterq]); countero += 2; } counterq++; } }.new-rect { width: 300px; height: 100px; border: 1px solid black; }<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="content"></div> <input type="button" class="addcontent" value="add content" onclick="addcontent('content');">
Comments
Post a Comment