2016-07-23 1 views
0

양식에서 비율 값 (다른 텍스트 입력)을 입력 할 때 금액 (텍스트 입력) 값을 삽입하고 싶습니다. 금액에 삽입되는 값은 비율과 수량의 곱셈입니다. 수량 값은 데이터베이스에서 가져옵니다. 여기서, rate의 값은 사용자에 의해 삽입 될 것입니다. 금액 삽입 후 값을 변경할 수 없습니다. 내가 어떻게 할 수 있니?또 다른 값이 다른 입력 텍스트에 주어질 때 입력 텍스트에 값을 자동으로 삽입합니다.

내가 코드를 아래에 시도했지만 결과가 0 때마다 보여주고있다 :

보기

<div class="form-group"> 
    <label for="exampleInputPassword1">Rate</label> 
    <input type="text" class="form-control" name="rate" placeholder="Rate" required> 
</div> 
<div class="form-group"> 
    <label>Quantity</label> 
    <input type="text" class="form-control" name="quantity" placeholder="quantity" value="<?php echo $object['sheet']; ?> " required readonly> 
</div> 
<div class="form-group"> 
    <label for="exampleInputPassword2">Amount</label> 
    <?php 
    $sheet = $object['sheet']; 
    $rate = $this->input->post('rate'); 
    $amount = $sheet*$rate; 
    echo $amount; 
    } 
    ?> 
    <input type="text" class="form-control" name="amount" value="<?php echo $amount;?>" placeholder="Amount" required> 
</div> 
당신은 할 jQuery를 사용할 수
+0

비율의 값이 변경 될 때마다 입력 금액을 rate * quantity 값으로 변경하고 싶습니다. – Martijn

+0

예, 값을 쓰면 금액을 쓰고 금액을 표시해야합니다. –

답변

1

: 잊지 마세요

$(document).ready(function() { 
$('input[name="rate"]').on('change',function() { 
    var amount = $(this).val()*$('input[name="quantity"]').val(); 
    $('input[name="amount"]').val(amount); 
}) 
}); 

을 jQuery API를 포함한다. 또한 사용자가 입력 값을 쉽게 조작 할 수 있으므로 양식을 제출 한 후 금액을 확인하는 것을 잊지 마십시오.

+0

이 코드를 입력 유형의 'value'속성 내에 쓸 수 있습니까? –

+0

아니요, 의

0

이를 사용할 수 있습니다

먼저 계산 상단

// use correct path to jQuery file 
<script src="<?php echo base_url().'js/jquery.min.js'; ?>"></script> 

// Or just use this 
<script src="https://code.jquery.com/jquery-2.2.4.js"; ?>"></script> 

// after jQuery 
<script> 
$(document).ready(function() { 
    $('input[name="rate"]').on('change',function() { 
     var quantity = $('input[name="quantity"]').val(); 

     if (quantity) { 
       var amount = $(this).val() * quantity; 
       $('input[name="amount"]').val(amount); 
       $('input[name="amount"]').prop('readonly', true); 
     } 
    }) 
}); 
</script> 
0

를 사용하여 자바 스크립트에서 jQuery를 추가 할 수 있습니다.

요구 사항에 맞게 코드를 수정했습니다. 데이터베이스에서 동적으로 비율 값을 설정해야합니다. 귀하의 코드는 다음과 같습니다 :

<div class="form-group"> 
    <label for="exampleInputPassword1">Rate</label> 
    <input type="text" class="form-control" name="rate" placeholder="Enter Rate" id="rate" required> 
</div> 
<div class="form-group"> 
    <label>Quantity</label> 
    <input type="text" class="form-control" name="quantity" placeholder="quantity" value="2" id="qnty" required readonly> 
</div> 
<div class="form-group"> 
    <label for="exampleInputPassword2">Amount</label> 
    <input type="text" class="form-control" name="amount" value="" id="amt" placeholder="Amount" required> 
</div> 
<script src="https://code.jquery.com/jquery-3.1.0.js" integrity="sha256-slogkvB1K3VOkzAI8QITxV3VzpOnkeNVsKvtkYLMjfk=" crossorigin="anonymous"></script> 
<script> 
    $('#rate').keyup(function(){ 
    var rate = parseInt($('#rate').val()); 
    var qnty = parseInt($('#qnty').val()); 
    var amt = parseInt(rate*qnty); 
    if(isNaN(amt)){ 
     $('#amt').val('Enter valid rate'); 
    } else { 
     $('#amt').val(amt); 
    } 

    }); 

</script> 
관련 문제