Psy Chotic Psy Chotic - 10 months ago 52
Javascript Question

obJect Object showing instead of button

I have a table that I am building via js, and it this table the rows ar being populated from a jquery modal dialog upon closing, the data displays on each row, but what I want also is a button to display in each row for further processing is need be.

When I add the button to the column it shows [object Object] instead of the button. I have looked at a similar question here and getting nothing in the column. I am quite knew to JS and could use some assistance The code is below. I can't seem to figure out what I am doing wrong.

$(function () {
var dialog, form,

skuNumber = $("#skuNumber");
productName = $("#productName");
description = $("#description");
quantity = $("#quantity");
border = $("#border");
inkColor = $("#inkColor");
allFields = $([]).add(skuNumber).add(productName).add(description).add(quantity).add(border).add(inkColor);
tips = $(".validateTips");

function addItem() {
var remove = $('<input type="button" id="remove" value="remove" style="width:80px" class="btn btn-danger" />');
var td = $("<td></td>");
var valid = true;


if (valid) {
$("#myTest tbody").append("<tr>" +
"<td>" + skuNumber.val() + "</td>" +
"<td>" + productName.val() + "</td>" +
"<td>" + description.val() + "</td>" +
"<td>" + quantity.val() + "</td>" +
"<td>" + border.val() + "</td>" +
"<td>" + inkColor.val() + "</td>" +
"td" +

return valid;

dialog = $("#dialog-form").dialog({

autoOpen: false,
height: 550,
width: 650,
modal: true,
buttons: {
"Add A Line Item": addItem,
Cancel: function () {
close: function () {

form = dialog.find("form").on("submit", function (event) {

$("#add").button().on("click", function () {

I am appending the td to this table below, I have the td's commented out in code

<table id="myTest" class="table table-responsive">
<td>Sku Number</td>
<td>Product Name</td>
<td>Ink Color</td>
<td><input type="button" id="remove" value="remove" style="width:80px" class="btn btn-danger" /></td>*@

Answer Source

Just append the td var to the table:

   $('#myTest> tbody tr:last').append(td);

Exmaple here: