Issues with Jquery Code

Gurpreet Singh Randhawa
Gurpreet Singh Randhawa used Ask the Experts™
on
I have the following code:

function updateInsertRecords(){arrys = arry.join(",");$('#insertRecords').val(arrys);}
var cnt = 1;
var container = $(document.createElement('span'));
var newitems = $(document.createElement('span'));
$('.span.fixed').before(container);
var arry = [], arrys = "";
$('#btAdd').click(function() {
    var groupname = $(this).attr('data-id');
    var isselect = $(this).attr('data-coral');
    if (cnt <= 9999) {
        cnt = cnt + 1;
        arry.push(cnt);
            $(container).append('<span class="twodelete" data-cnt="' + cnt + '"><div class="margin5px modal-partition"><label for="Name">Name</label><input data-placement=bottom type=text name="field' + '' + cnt + '"  id="field' + '' + cnt + '" class=form-control data-rule-required=true data-msg-required="Provide field details" /></div><div class="margin5px modal-partition"><label for="status' + '' + cnt + '">Status</label><select name="status' + '' + cnt + '" id="status' + '' + cnt + '" class="form-control" data-rule-required="true" data-msg-required="Provide Status details"><option value="1">Active</option><option value="0">Inactive</option></select></div><input type="button" id="btRemove" rel="' + groupname + '_' + cnt + '" value="X" class="sectionBtn bt" /></span>');
    }
    arrys = arry.join(",");
    $('.buttonsPlaceHolder').before(container);
    $('.buttonsPlaceHolder').after(newitems);
    updateInsertRecords();
});
$(document).on('click', '#btRemove', function(){
    var item = $(this).closest('.twodelete');
    var v = item.data('cnt');
    for(var i = arry.length - 1; i >= 0; i--) {
    if(arry[i] === v) {
      arry.splice(i, 1);
      break;
        }
    }
  updateInsertRecords();
  item.remove();
});

Open in new window


The code works fine, only issue i when ever i am trying to delete, it always delete a wrong row

when I click on the "x" to the right to remove a line element it removed the incorrect element. See print screens. I try to remove row 2 element b but it removes row 3 element c.
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Most Valuable Expert 2017
Distinguished Expert 2018

Commented:
1. No screen grabs attached
2. Based on your earlier question http://www.experts-exchange.com/questions/28708635/JavaScript-issue-with-comma-separated-values.html#a40948619 your code does not match what was posted - line 15 should be removed from the source you posted
3. Please have a look at the sample that demonstrates how this code works - let me know if that code is also deleting the wrong row - I have tested it again and it seems to work correctly.
sample is giving me http 404 error
Most Valuable Expert 2017
Distinguished Expert 2018
Commented:
Brian TaoSenior Business Solutions Consultant
Top Expert 2014

Commented:
Your code inserts elements starting from cnt=2.  I guess that's why.

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial