onclick - javascript click function not working on multiple buttons -


here javascript code. problem last create function working not other.for example here have 4 create() function last 1 working properly. if have 3 3rd 1 work fine not others........please suggest wrong code....please i'm new javasript.

please check code in codepen here

window.onload=function() { var number_operation_table=document.getelementbyid('number_operation_table');   create('lt','<'); create('gteq','>='); create('lteq','<='); create('gt','>');   function create(prefix,operator) {  number_operation_table.innerhtml+="<tr><td><input type='text' name='"+prefix+"_val1' id='"+prefix+"_val1'/>"+operator+"<input name='"+prefix+"_val2' type='text' id='"+prefix+"_val2'/></td>         <td><button id='check_"+prefix+"'>check</button></td>         <td id='"+prefix+"_result'></td>       </tr>";     eval("var "+prefix+"check=document.getelementbyid('check_"+prefix+"');"); console.log(eval(prefix+"check"));  console.log("button created name:"+prefix+"check") ;  eval(prefix+"check.onclick=function()  {    calculate(prefix,operator);     };");   }  function calculate(prefix,operator) { var val1=parseint((document.getelementbyid(prefix+'_val1')).value); var val2=parseint((document.getelementbyid(prefix+'_val2')).value); var result_div=document.getelementbyid(prefix+'_result');    if((eval(''+val1+ operator +val2))==false)   {  result_div.innerhtml="<span class='fail'>"+val1+ operator +val2 +" = false</span>";   }  if((eval(''+val1+ operator +val2))==true)   { result_div.innerhtml="<span class='success'>true</span>";    }   }    };

your problem (among others) when concatenate element using innerhtml destroy event listeners on contents of element. every time call create, code destroys created onclick handlers.

instead, try:

var newrow = document.createelement("tr"); newrow.innerhtml = "<td><input type='text' name='"+prefix+"_val1' id='"+prefix+"_val1'/>"+operator+"<input name='"+prefix+"_val2' type='text' id='"+prefix+"_val2'/></td>         <td><button id='check_"+prefix+"'>check</button></td>         <td id='"+prefix+"_result'></td>";  number_operation_table.appendchild( newrow);

alternatively, have single event listener attached table instead of 1 each button

other issues:

you should not need 'eval' in create method @ all:

var mybutton = document.getelementbyid('check_"+prefix+"'); mybutton.onclick = function() { calculate( prefix, operator) };

you should need 1 test in calculate method:

if((eval(''+val1+ operator +val2))==false) {   result_div.innerhtml="<span class='fail'>"+val1+ operator +val2 +" = false</span>"; } else {    result_div.innerhtml="<span class='success'>true</span>"; }

Comments

Post a Comment

Popular posts from this blog

javascript - Using jquery append to add option values into a select element not working -

i'm looking dynamically populate select element names of items stored array. for reason it's not working , i'm not sure why. html: <div class="col-md-4 col-md-offset-4"> <select class="select1"> </select> , <select class="select2"> </select> </div> note i'm using bootstrap layout. here's jquery i'm using try , populate ".select1" jquery: select: function() { $.each(state.greens, function(index, value) { $(".select1").append("<option value =' " + index + " '>" + state.greens[index].name + "</option>"); }); } note function 'select' stored within object called 'display'. state.greens name of array i'm trying access. so @ end of html page call display.select(); call function. no error messages showing in console. also, saw question: appending
Read more

Android soft keyboard reverts to default keyboard on orientation change -

i'm building android soft keyboard , can't seem fix bug - have arabic , qwerty keyboard , when rotate device on qwerty keyboard (or arabic shift), it's if program has "restarted" , becomes arabic keyboard without shift. the onsaveinstancestate(bundle savedinstancestate) not work because application not extend activity inputmethodservice . i put following in android manifest android:configchanges="keyboard|keyboardhidden|orientation" android:windowsoftinputmode="stateunchanged|adjustresize"> i tried using @override public void onconfigurationchanged(configuration newconfig) { super.onconfigurationchanged(newconfig); log.i(mydebug, "config changed " + currentkeyboard.equals(qwerty)); } however, currentkeyboard.equals(qwerty)) results false , made sure true before orientation change. any appreciated. i think applications fault. if application restarting on orientation change
Read more

Rendering JButton to get the JCheckBox behavior in a JTable by using images does not update my table -

i rendering jbutton image on simulate jcheckbox behavior. why don't let jtable render jcheckbox? because need bigger checkboxes , there's no way can resize them (as far know). so, have own table cell renderer , editor. both renders jbutton , checkbox images on them. trying change image checked image unchecked image (or vice versa) , update cell value (boolean true or false). however, reason, getcelleditorvalue() not update table. so, release mouse, value goes original one. any appreciated! lot! public class tableexample extends jframe { jscrollpane pane; jpanel panel; jtable table; object[][] data; mytablemodel tm; renderer buttoncolumn; public tableexample(object[][] data) throws ioexception { string[] columns = {"column#1", "column#2", "column#3", "column#4", "column#5", "column#6"}; this.data = data; this.setpreferredsize(new dimension(700, 500));
Read more