Euel Domingo Euel Domingo - 6 days ago 4
HTML Question

Add the button under the Rating column JQuery or AJAX

I want to add the buttons after result.date it doesn't seem to work on my code. If I put buttons between td tags then it will show [object Object] error.

$.ajax({
type: 'GET',
url: 'someUrl.php',
data: {op : "demo"},
dataType: 'json',
success: function(data){
$("#restaurantList > td").empty();
$.each(data, function(i,result){
var buttons = $('<button/>', { id: 1, text:"Get Rating", value: "GetRating", click: function(){alert(result.business);}});
var newRow =
"<tr>"
+"<td>" + result.business + "</td>"
+"<td>" + result.address + "</td>"
+"<td>" + result.rating + "</td>"
+"<td>" + result.date + "</td>"
+"</tr>"
$("#restaurantList tbody").append(newRow)
$("#restaurantList tbody").append(buttons)
});
}
});

Answer

This method will append the button in a cell next to the date cell

 success: function(data){
        $("#restaurantList > td").empty();
        $.each(data, function(i,result){
            var buttons = $('<button/>', { id: 1, text:"Get Rating", value: "GetRating", click: function(){alert(result.business);}});
            var newRow = 
               $( "<tr>"
                    +"<td>" + result.business + "</td>"
                    +"<td>" + result.address + "</td>"
                    +"<td>" + result.rating + "</td>"
                    +"<td>" + result.date + "</td>"
                +"</tr>"  );
            var td = $("<td></td>");
            newRow.append(td);
            td.append(buttons);
            $("#restaurantList tbody").append(newRow);

        });                     
    }