JSFiddle - React, Tailwind, and code Playground

by Tim BĂĽthe

HTML

<table id="clients">
    <tr><td>test</td></tr>
</table>

JavaScript

var porcAbandoned = "a";
var porcAnswered = "b";
var secAbandoned = "c";
var secAnswered = "d";
var name = "e";

alert("1");
var data = 'action=insert&porcab=' + porcAbandoned + '&porcan=' + porcAnswered;
        data = data + '&secab=' + secAbandoned + '&secan=' + secAnswered + '&name=' + name;
        $.ajax({
        type: "POST",
        // url: "manager.php",
            url: "/echo/xml/",
        async: false,
        data: data,
        cache: false,
        success: function(response){
                    alert("2");
            
                    var result = Number(response);
                    var row = '<tr id="'+result+'"><td class="edit porcAbandoned '+result+'>'+name+'</td>';
                    row = row + '<td style="text-align: center;" class="edit porcAbandoned '+result+'>'+porcAbandoned+' %</td>';
                    row = row + '<td style="text-align: center;" class="edit secAbandoned '+result+'>'+secAbandoned+'</td>';
                    row = row + '<td style="text-align: center;" class="edit porcAnswered '+result+'>'+porcAnswered+' %</td>';
                    row = row + '<td style="text-align: center;" class="edit secAnswered '+result+'>'+secAnswered+'</td>';
                    row = row + '<td style="text-align: center;">-</td>';
                    row = row + '<td style="text-align: center;"><a class="delete" href="#"><img src="assets/delete.png" /></a></td></tr>';
                    //$('#clients > tbody:last').append(row);
                    $('#clients').append(row);
                    alert("3 " + $('#clients').length);
                }
        });