this is the jquery that is selecting .select-service
and on change, I need to add data to the input field #rate1
.
$(document).on('change', '.select-service', function(e) {
e.preventDefault();
var serviceID = $(this).val();
$.ajax({
method: "POST",
url: "async/service-selected.php",
data: {service_id: serviceID},
success: function (data) {
$('#rate1').val(data);
}
});
});
this is the PHP file service-selected.php
that is echoing data
include_once '../includes/class.Main.php';
$dbf = new User();
$service_id = $_POST['service_id'];
$output = "";
foreach($dbf->fetchOrder("service", "id='$service_id'") as $services){
$output = $services['price'];
};
echo $output;
this is the jquery that is dynamically adding inputs when add button is clicked.
<script>
var i=1;
$(function () {
$("#btnAdd").bind("click", function () {
var div = $("<tr />");
div.html(GetDynamicTextBox(""));
$("#TextBoxContainer").append(div);
});
$("body").on("click", ".remove", function () {
$(this).closest("tr").remove();
// GrandTotal();
});
});
function GetDynamicTextBox(value) {
i++;
return '<td><select class="form-control select2 select-service" style="width: 100%;" id="service-select'+i+'" required name="product[]"><option value="">--Select Product--</option> <?php foreach($dbf->fetchOrder("service") as $services){?><option value="<?= $services['id'];?>"><?= $services['service'];?></option><?php }?></select></td>' +
'<td><input class="form-control rate" name = "rate[]" type="text" placeholder="Rate" id="rate1'+i+'" required readonly/></td>' +
'<td><input class="form-control" placeholder="Quantity" name = "qty[]" type="number" id="qty1'+i+'" onkeyup="QuantityPrice('+i+')" onclick="QuantityPrice('+i+')" autocomplete="off" /></td>' +
'<td><input class="form-control" placeholder="Sub Total" name = "sub_total[]" type="text" id="sub_total1'+i+'" readonly required/></td>' +
'<td><input type="text" class="form-control payment-type" placeholder="payment type" name="pay_type[]" id="pay_type1'+i+'" ></td>' +
'<td><input type="text" class="form-control discount" placeholder="discount" name="discount[]" id="discount1'+i+'" ></td>' +
'<td><input type="text" class="form-control total" placeholder="total" name="total[]" readonly id="total1'+i+'" ></td>' +
'<td><input type="text" class="form-control paid-amount" placeholder="paid amount" name="paid[]" id="paid1'+i+'" ></td>' +
'<td><input type="text" class="form-control due-amount" placeholder="due amount" name="due[]" readonly id="due1'+i+'" ></td>' +
'<td><button type="button" class="btn btn-danger remove"><i class="glyphicon glyphicon-remove-sign"></i></button></td>'
}
</script>
and this is the static input HTML
<td>
<div class="form-group">
<select class="form-control select-service" style="width: 100%;" id="service-select" required name="product[]">
<option value="">--Select Services--</option>
<?php foreach($dbf->fetchOrder("service") as $services){?>
<option value="<?= $services['id'];?>"><?= $services['service'];?></option>
<?php }?>
</select>
</div>
</td>
<td><div class="form-group rate"><input type="text" class="form-control rate" placeholder="Rate" readonly name="rate[]" id="rate1" required></div></td>
<td><div class="form-group"><input type="number" min="1" class="form-control qty" placeholder="Quantity" name="qty[]" id="qty1" ></div></td>
<td><div class="form-group"><input type="text" min="1" class="form-control sub_total" placeholder="Sub Total" name="sub_total[]" readonly id="sub_total1" ></div></td>
<td><div class="form-group"><input type="text" min="1" class="form-control payment-type" placeholder="payment type" name="pay_type[]" id="pay_type1" ></div></td>
<td><div class="form-group"><input type="text" min="1" class="form-control discount" placeholder="discount" name="discount[]" id="discount1" ></div></td>
<td><div class="form-group"><input type="text" min="1" class="form-control total" placeholder="total" name="total[]" readonly id="total1" ></div></td>
<td><div class="form-group"><input type="text" min="1" class="form-control paid-amount" placeholder="paid amount" name="paid[]" id="paid1" ></div></td>
<td><div class="form-group"><input type="text" min="1" class="form-control due-amount" placeholder="due amount" name="due[]" readonly id="due1" ></div></td>
<td><button type="button" class="btn btn-danger remove" ><i class="glyphicon glyphicon-remove-sign"></i></button></td>
Price is only changing for static inputs
and it (static price input) also changes when the dynamically select option is changed.
question from:
https://stackoverflow.com/questions/65680181/on-change-of-select-option-add-value-to-dynamically-created-input-field-through 与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…