show dynamic result using javascript

Question

In my _value form table 3 input as voltage ,type and length AS show image.r,x,b value came from type table as type select.

Value Submit

page not refresh on submit
on submit temp result=r*length

Again when enter value and submit then show second result in below first one till user do. on clear all result clean. "how we can achieve using javascript append and prepend"

Your calculation is being done on server side? via PHP or any server side technology? — progrAmmar, Jan 29 '16 at 06:14
replace form with div so that on submit nothing will happen anyhow you will doing javascript for submitting the values. — Harshal Patil, Jan 29 '16 at 06:20
Your requirement were not clear. specify exactly what you are trying to achieve. — Insane Skull, Jan 29 '16 at 06:31

score 1 · Answer 1 · answered Jan 30 '16 at 09:55

For your solution, call a javascript function on onClick() of Submit button and add following code:

<?php echo CHtml::submitButton('Submit', array('onClick' => 'js: return submitForm(this);')); ?>
<?php echo CHtml::button('Clear', array('onClick' => 'js: return clearForm(this);')); ?>

<script type="text/javascript" language="Javascript">
  function submitForm(obj) {
    var r = document.getElementById("TestpageForm_r").value;
    var len = document.getElementById("TestpageForm_length").value;
    var result = 0;

    if (r != "" && len != "") {
      result = r * len;      
      var strAppend = '<div class="row"><span>Result: </span><span>' + result + '</span></div>';
      $('#mainDiv').append(strAppend);
    }
    else{
      alert('Please enter value of r and length');
    }
    return false;
  }
  function clearForm(obj) {
    document.getElementById('mainDiv').innerHTML = "";
  }
</script>

show dynamic result using javascript

1 Answers1