Johny
Johny

Reputation: 129

Finding cell value of dynamically generated table row

I am trying to delete an array record based on what table row is clicked.

This function adds a button to a row and appends it to the end of the table

function addButtons(table, tr){
    var delBtn = document.createElement("button");
    delBtn.innerHTML = "×"
    delBtn.onclick = deleteBu(tr)
    tr.appendChild(delBtn);
    table.children[1].appendChild(tr)
}

The function below is meant to delete an array record based on the row clicked. For example, in row 1, the first cell is "45". Based on this, the record is deleted if it is found in the array storageProblem.

Here is what I have so far. The issue is because I am using tr as the action listener, so simply clicking on the row will delete the row, it is not localized to the button. But using tr is the only way I have found to get the first td of a row.

function deleteBu(tr){
    $(tr).click(function(){ 
        var value=$(this).find('td:first').html();
        for(i = 0; i < storageProblem.length; i++){
            if(value == storageProblem[i][0]){
                storageProblem.splice(i, 14)
                loadCallProblemTable()
            }
        }
    })
}

Upvotes: 0

Views: 40

Answers (1)

Jonas0000
Jonas0000

Reputation: 1113

I'm not sure if I've understood your question right but maybe try this solution:

function deleteBu(x) {
    var Index = $(x).closest('tr').index();
    console.log("Row index: " + Index);
}

Upvotes: 1

Related Questions