CODEWITHSUNDEEP
jquerybootstrap-modalbootstrap-select
Ris
Ris

Reputation: 1164

Dynamic table rows with Bootstrap select

I am trying to add Bootstrap select field in my dynamic table which gets dynamic data from other field but unable to manage when more than one row added.

I believe someway I need to give them a unique name or array of objects but not sure how to do it.

My new row add function,

addRows:function(tblID){
            var removeRow='<td><button type="button" class="btn btn-xs btn-danger remove500Row" title="Remove" ><i class="fa fa-times"></i></button></td>';
            var rcRow='<td><select class="form-control"  id="inv_RootCause" name="inv_RootCause"></select></td>';
            var rcNo='<td><input type="input" id="inv_RootCauseNo" name="inv_RootCauseNo[]" class="form-control" /></td>';

            $('#'+tblID).append('<tr valign="top">'+removeRow+rcRow+rcNo+'</tr>');

            $("select#inv_RootCause").change(populateRootCause());
        }

populateRootCause:function(){
            if ( $('#Personnel').val() != '' ){
                var arr =  $('#Personnel').val().split(',');
                var opts = '<option value=""></option>';

                $.each(arr, function(n, val) {
                    opts += '<option value="'+ val + '">' + val+ '</option>';
                });

                $('#inv_RootCause').html(opts).trigger('chosen:updated');
            } 
    }

Two things happening, Only populating dropdown in first row only and second when next row is added selection disappears in first row.

enter image description here

Upvotes: 0

Views: 915

Answers (1)

Asav Vora
Asav Vora

Reputation: 61

Togive unique name to your dyanmic dropdown, you can use class for manipualte commonly or generate id dynamically with count or some other value like:

$("#inv_RootCause'+countval)

maintain your countval on adding row.

This will resolve your both issue. Because of you are using the same id on next row so it gets re-initilize when you create and select for new row.

Upvotes: 1

Related Questions