CODEWITHSUNDEEP
phpjquery
devofash
devofash

Reputation: 328

jQuery clone row - insert value in specific field

Need some assistance here.

So basically I've got a form which has below fields. Once "Add More Products" button is clicked it clones the product, stock and qty fields and creates a new row. The Product field is a dropdown list of products (query from mysql)

What I need help with is if someone chooses a product I need it to query the database and show stock levels on the chosen product. I've got it working with one row but can't get it to work on the cloned elements (respectively). Code is below. Would really appreciate some assistance.

<select name="product[]" id="product">
    <option value="product 1"> Product 1</option>
    <option value="product 2"> Product 2</option>
    <option value="product 3"> Product 3</option>
    <option value="product 4"> Product 4</option>
</select>
<input type="text" id="stockclass="inputfield" name="stock" size="8" />


$('#product').on("change", function() {
    var val = $(this).val();
    $("#stock").val(val2);                        
});

$("#add").on("click", function() {
    var row = $('#item tbody > tr:last').clone(true);            
    row.insertAfter('#itemsTable tbody > tr:last');
   return false;            
});

Upvotes: 2

Views: 523

Answers (1)

Dipesh Parmar
Dipesh Parmar

Reputation: 27364

Use .on() because .live() is depreciated from now on.

$(document).on('click','SELECTOR',function(){ /*...*/ });

You are cloning DOMs with the same ID that is totally wrong. Use Class.

Example

<select name="product[]" class="product">
    <option value="product 1"> Product 1</option>
    <option value="product 2"> Product 2</option>
    <option value="product 3"> Product 3</option>
    <option value="product 4"> Product 4</option>
</select>
<input type="text" class="quantity inputfield" name="quantity[]" size="8" value="" />
<input type="text" class="target_price inputfield" name="target_price[]" size="8" value="" />
<input type="text" class="stock_availability inputfield" name="stock_availability[]" size="8" value="" readonly="readonly" />

Now other one is you have click event for selectbox that is wrong it should be change event.

AS

$('.product').on('change',function()
{

    $.ajax(
    {
        //ajax params and options and in success set value
    });

});

Upvotes: 2

Related Questions