Onclick value to display in another output

I’m having a problem when i click the value from dropdown. It should supposedly show me in weightage(total) automatically.

Can someone help me on how to call the value by default from the marks allocation dropdown form automatically into weightage(total).

Marks Allocation code:

<div class="form-row">
  <label>Marks Allocation (%):</label>
  <select name="percentage" class="form-control" oninput="this.className = ''">
    <?php 
    $sql = mysqli_query($connection,"SELECT * FROM continous_assess"); 
    while ($row=mysqli_fetch_array($sql))
    { ?>

    <option value="">
      <?php echo $row['percentage']; ?>
    </option>
    <?php 
    }
    ?>
  </select>
</div>

Weightage code:

<div class="form-group">
  <label>Weightage</label>
  <input type="number" name="first" class="prc" />
  <input type="number" name="second" class="prc" />
  <input type="number" name="third" class="prc" />
  <input type="number" name="fourth" class="prc" />
  <input type="number" name="fifth" class="prc" />
  <label>Total</label>
  <output value="<?php echo $row['percentage'];?>"></output>
</div>

Answer

This should help you on your way;

<script type="text/javascript">
function updateVal() {
    // Get value
    var val = document.getElementById("percentage").value;

    // Set value
    document.getElementById("exampleInput").value = val;    
}
</script>

<select name="percentage" id="percentage" onchange="updateVal()">
    <option value="">- Select something -</option>
    <option value="example1">Example 1</option>
    <option value="example2">Example 2</option>
    <option value="example3">Example 3</option>
</select>

<input type="text" name="exampleInput" id="exampleInput">

Advertisement

Answer