Разное поведение HTML <input>проверено Атрибут

Question

Различное поведение происходит в разных браузерах для атрибута HTML <input>.Я сгенерировал атрибут input из Javascript, нажав кнопку.Флажок отображается в браузере Firefox, но не отображается в браузере Chrome.Сгенерированный HTML-код:

<input id="0" class="col-sm-1" onclick="checkImage(this)" name="images[0].isActiveDefault" type="checkbox">

Браузер FireFox

Браузер Chrome

Буду признателен за любую помощь или предложение по решению этой проблемы.

РЕДАКТИРОВАТЬ добавлен код JavaScript

function addImagerow(tableId) {
    var rowValue = parseInt(document.getElementById('image-add').value);
    var tableData = "<tr><td><input id = '"
        + rowValue
        + "' class='col-sm-1' onclick='checkImage(this)' name='images["
        + rowValue
        + "].isActiveDefault' type='checkbox'></td><td>Default</td>"
        + "<tr>";
    document.getElementById('image-add').value = rowValue + 1;
    $(tableData).appendTo(tableId);
}

Answer 1

Потратив много времени, я нашел проблему.Хотя проблема глупа, я извлек урок из нее.Хорошо, проблема была в дизайне.Из input field я удаляю class='col-sm-1'.И он работает нормально.

Я добавил bootstrap css для input field, но не для table data field.

var tableData = "<tr><td><input id = '"
    + rowValue
    + "' class='col-sm-1' onclick='checkImage(this)' name='images["
    + rowValue
    + "].isActiveDefault' type='checkbox'></td><td>Default</td>"
    + "<tr>";

TO

var tableData = "<tr><td><input id = '"
    + rowValue
    + "onclick='checkImage(this)' name='images["
    + rowValue
    + "].isActiveDefault' type='checkbox'></td><td>Default</td>"
    + "<tr>";

И мой анализ говорит, что когда я добавил col-sm-1 в поле ввода, <td> не расширяется, поэтому input field является скрытым.