samedi 25 juin 2016

Input Reset to value

Goal

I'm trying to create a button that Onclick resets each individuals values to the Original value of each individual input value.

I've setup a Codepen example here: http://codepen.io/coryk/pen/QEGrXp

Problem

When the user clicks the reset button it does reset, but it resets to the firsts inputs value and I need it to reset it to each individual value.

Here is my code:

HTML

   <tr>
      <td>Max Pumping Distance</td>
    <td>
        <input name="custom_coverage" class="input_green custom_coverage" id="max-pumping" type="number" value="44000">
    </td>
    <td>ft</td>
</tr>

<br/>
<tr>
    <td>Avg. Pumping Distance</td>
    <td>
        <input name="custom_coverage"  class="input_green custom_coverage"  id="avg-pumping-distance" type="number" value="30000">
    </td>
    <td>ft</td>
</tr>

<br/>
<tr>
    <td>Head Pressure</td>
    <td>
        <input name="custom_coverage"  class="input_green custom_coverage"  id="avg-pumping-distance" type="number" value="45000">
    </td>
    <td>ft</td>
</tr>
<br/>

<button id="reset">Reset</button>

JavaScript

//Reset to Default Input values 
var $input = $('.custom_coverage'),
    $reset = $('#reset')
$('#reset').data('default', $input.val() );

$reset.on('click', function() {
   $input.val($(this).data('default')); 
});

Aucun commentaire:

Enregistrer un commentaire