Saturday 15 February 2014

html - html5/javascript multiplying input types and displaying in table -



html - html5/javascript multiplying input types and displaying in table -

how create button onclick takes these 2 values entered, , multiply them , display them in table? if can't help me table part multiplication helpful!

lets html is:

<form> <label>first number</label> <input type="text" id="number-1"> <label>second number</label> <input type="text" id="number-2"> <input type="submit" value="multiply" id="multiply"> </form> <table> <thead> <tr> <th>value 1</th> <th>value 2</th> <th>result</th>

and javascript, having jquery, is:

$(function(){ $('#multiply').click(function(event){ event.preventdefault(); var value1 = $("#number-1").val(); var value2 = $("#number-2").val(); var result = value1 * value2; var newrow = $("<tr></tr>"); var firstcell = $("<td></td>"); var secondcell = $("<td></td>"); var resultcell = $("<td></td>"); var valueone = $("#number-1").val(); var valuetwo = $("#number-2").val(); var result = valueone * valuetwo; firstcell.append( valueone ); secondcell.append( valuetwo); resultcell.append( result ); newrow.append(firstcell); newrow.append(secondcell); newrow.append(resultcell); $('#table-body').append(newrow); }); }); </script>

that should trick if understood want :-)

javascript html

No comments:

Post a Comment