将值分配到3个输入标记中

时间:2014-05-05 04:30:31

标签: javascript php

我有软件设计,可以将值分配到3个输入标签中。

<?php
while ($row = oci_fetch_array($result, OCI_BOTH)){

       $qtyAvailable = $row['QTY_REQUIRED'] - $row['QTY_CNCED'];   

       echo '<input class="form-control" id="test1" name="quantityToCutCnc" type="number" min="0" max='.$qtyAvailable.' placeholder="CNC">';

       echo '<input class="form-control" id="test2" name="quantityToCutScator" type="number" min="0" max='.$qtyAvailable.' placeholder="Scator">';

       echo '<input class="form-control" id="test3" name="quantityToCutManual" type="number" min="0" max='.$qtyAvailable.' placeholder="Manual">';
       echo '<br/>';
       echo '<strong>Total : </strong><div id="spent"></div>';

       echo '<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>';
       echo '<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.js"></script>';

       echo '<script src="componentRequestJS/qtyDistribution.js"></script>';
}
?>

所以我需要将$qtyAvailable分发到quantityToCutCnc, quantityToCutScator, and quantityToCutManual。所以这3个的总和不能超过$qtyAvailable。我假设我们需要使用jQuery。

1 个答案:

答案 0 :(得分:2)

我认为这是一个很好的起点:

http://jsfiddle.net/X8RFe/2/

// echo from php
var available = 20;

jQuery('.form_control').on('change',function(event) {


    setTimeout(function() {
        var used = 0;
        jQuery('.form_control').each(function() {
            used += (parseInt(jQuery(this).val(),10) || 0);
        });

        if (used > available) {

            var current = parseInt(jQuery(event.target).val(),10);

             jQuery(event.target).val(current-(used-available));    
        }
    },1);

});

你可能想要进一步测试和调整它,因为我只测试了几秒钟。