$(document).ready(function () {
var rowIdx = 1;
var uniq = rowIdx;
optionList(uniq);
$('#addrow').on('click', function () {
uniq = new Date().getUTCMilliseconds()+''+Math.floor(Math.random() * 100);
$('#tbody').append('<tr id="R'+ ++rowIdx +'">'
+'<td class="row-index text-center"><p>'+rowIdx+'</p></td>'
+'<td class="text-center"><select id="inputcountry" name="inputcountry" class="form-control '+uniq+'_inputcountry"></select></td>'
+'<td class="text-center"><button class="btn btn-danger btn-sm btn-remove" type="button"><i class="fa fa-trash"></i></button></td>'
+'</tr>');
optionList(uniq);
});
// jQuery button click event to remove a row.
$('#tbody').on('click', '.btn-remove', function () {
if($(".table-count #tbody tr").length > 1){
// Getting all the rows next to the row
// containing the clicked button
var child = $(this).closest('tr').nextAll();
// Iterating across all the rows
// obtained to change the index
child.each(function () {
// Getting <tr> id.
var id = $(this).attr('id');
// Getting the <p> inside the .row-index class.
var idx = $(this).children('.row-index').children('p');
// Gets the row number from <tr> id.
var dig = parseInt(id.substring(1));
// Modifying row index.
idx.html(dig - 1);
// Modifying row id.
$(this).attr('id', 'R'+dig - 1);
});
// Removing the current row.
$(this).closest('tr').remove();
// Decreasing total number of rows by 1.
rowIdx--;
}else{
alert("You cannot delete first tr");
}
});
});
function optionList(nbr){
var min = 0,max = 100;
var elm;
elm = ""+nbr+"_inputcountry";
for (var i = min; i<=max; i++){
var opt = document.createElement('option');
opt.value = i;
opt.innerHTML = i;
opt.title = i;
document.getElementsByClassName(elm)[0].appendChild(opt);
}
}