Javascript - рендеринг поля ввода текста

Question

Я написал функцию, которая отображает все мои выбранные поля (места) в классе div. Когда я нажимаю на них, они должны отображаться по имени. Теперь я хочу, чтобы эти поля были записаны в поле ввода, которое я выбрал при нажатии ..

var rowRange = 'abcdefghijklmnopqrstuvwxyz'.split('');

var $cart = $('#selected-seats'),
    sc = $('#seat-map').seatCharts({
    map: [
        'aaaaa__aaaaa',
        'aaaaa__aaaaa',
        'aaaaa__aaaaa'
    ],

    naming : {
        top : false,
        getLabel : function (character, row, column) {
            return rowRange[row - 1].toUpperCase() + column;
        },
    },

    click: function () {
        if (this.status() === 'available') {
            $('<li>'+this.settings.label+'</b></li>')
                .appendTo($cart);


            $counter.text(sc.find('selected').length+1);

            return 'selected';
    });
});

и это мое поле ввода формы

 <input type="text" id="selected-seats" class="form-control"  size="20">

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

if (this.status() == 'available') {
            $('<li>'+this.settings.label+'</b></li>')
                .appendTo($cart);

Это не ..

if (this.status() == 'available') {
            document.getElementById('selected-seats')
                .appendTo($cart);

Answer 1

Я только что исправил это!

Мне нужно было вернуть значение для поля ввода.

$('#selected-seats')
                 .attr('id', 'cart-item-'+this.settings.id)
                 .val(this.settings.label)
                 .appendTo($cart);

Answer 2

document.getElementById('selected-seats')

Строка выше возвращает чистый элемент DOM, не обернутый никаким объектом jQuery. Элементы DOM не имеют метода appendTo, однако объекты jQuery имеют. Так что вам нужно либо использовать jQuery для получения элемента по ID (первый пример ниже), либо использовать его для переноса результата нативного метода getElementById (второй пример ниже).

// First example
$('#selected-seats').appendTo($cart)

// Second example
var selectedSeatsElement = document.getElementById('selected-seats');
$(selectedSeatsElement).appendTo($cart)