У меня есть таблица, созданная с данными из JSON. Поведение, которое я пытаюсь создать, - это когда они щелкают любую ячейку (точнее, строку) в таблице, значения отображаются в тексте в нижней части экрана. У меня все работает, но когда он получает значения, он объединяет их без пробелов.

Вот части моего кода:

HTML

<div class="container" id="table-container">
    <table class="table table-bordered table-hover" id="table">
        <thead>
        <tr>
            <th data-field="make" data-sortable="true">Make</th>
            <th data-field="model" data-sortable="true">Model</th>
            <th data-field="year" data-sortable="true">Year</th>
        </tr>
        </thead>
    </table>
</div>

<hr/>
<div class="container">
    <h3>Reviews</h3>
    <br/>
    <h4 id="car-id"></h4>
</div>

JS

$('#table').on("click", "tbody tr", function () {
    $('#car-id').text(($(this).closest("tr").text()));
});

Результат этого при щелчке строки выглядит примерно так ...

HondaCivic2012

Но то, что я пытался получить, было

Honda Civic 2012 года

Наилучший сценарий - попытаться выяснить, как изолировать значения после щелчка по строке, чтобы я мог выполнять действия с каждым текстом марки, модели и года. Например, если я смогу выяснить, как изолировать значения, я сделаю что-то, что выводит

Марка: Honda

Модель: Civic

Год: 2012

0
Joey 10 Янв 2017 в 19:22

1 ответ

Лучший ответ

Лучшим вариантом было бы циклическое переключение ячеек по отдельности.

Вот, это должно помочь вам начать

$('#table').on("click", "tbody tr", function () {
    $('td', this).each(function () {
        $('#car-id').append($(this).text() + " ");
     })
});
1
Tim Barnett 10 Янв 2017 в 19:29
Вау, это именно то, что я искал! Это было настолько простое решение, что я немного разочарован, что не смог его понять. Спасибо.
 – 
Joey
10 Янв 2017 в 20:55