Как присваивать в сразу несколько значений через запятую?

Question

[Сергей Шилов]

Приветствую, тосторовчане. Я пытаюсь по клику на элемент, записывать в инпут определенные значения, но получается пока только одно, как вписать сразу и .item-name и .item-structure итд ?

<div class="item-description">
                                <div class="item-name">Название</div>
                                <div class="item-structure">Описание</div>
                                <span class="item-weight">Вес</span>
                                <span class="item-price">Цена</span>
                                <div class="item-add">Добавить</div>
                            </div>

<input class="items-cart" type="text">

Вот что я делаю:

$('.item-add').click(function() {
                    $('.items-cart').attr('value', $(this).closest('.item-description').find('.item-name').text());
                });

Надо, разумеется, чтобы добавлялся не только .item-name, но и значения остальных блоков.
В итоге должно получиться как-то так:

<input type="text" value="имя описание вес цена">

Answer 1

[rmaksim]

совсем не обязательно все свойства собирать одной строкой, можно же и отдельно )
а потом просто объединить "пробелом" как-то так

$('.item-add').click(function() {
    var $desc   = $(this).closest('.item-description')
      , t_name  = $desc.find('.item-name').text()
      , t_price = $desc.find('.item-price').text()
      , ...
    $('.items-cart').attr('value', [t_name, t_price].join(" "));
});

а можно написать небольшой "сборщик" полей и потом просто указывать нужные, например вот так

$('.item-add').click(function() {
    $('.items-cart').attr('value', get_items($(this), "name structure weight price", " "));
})

function get_items($el, fields, separator) {
    var $desc = $el.closest('.item-description')

    return ($.map(fields.split(" "), function(field_name){
        return $desc.find(".item-" + field_name).text()
    })).join(separator)
}

Comments

[Сергей Шилов]

Это отлично! А что, если у меня несколько .item и разные значения надо вписывать в то же поле, но через запятую?

[Сергей Шилов]

как тут же: jsfiddle.net/5uck20w8/2

[rmaksim]

Сергей Шилов: так? jsfiddle.net/5uck20w8/3

[Сергей Шилов]

rmaksim: спасибо! Это как раз то, что нужно!

[Сергей Шилов]

rmaksim: Единственный вопрос. Откуда взялась эта строчка?

$input.attr( 'value', value + get_items($(this), "name structure weight price", " ") );

Каким образом name structure итд определяются?

[rmaksim]

Сергей Шилов:
когда мы вызываем get_items($(this), "name structure weight price", " ")
то соотв. в function get_items($el, fields, separator) подставляются соотв. переменные с которыми мы потом что-то делаем - так?
из вышенаписанного имеем что fields = "name structure weight price"
и далее мы разбиваем строку по пробелам и делаем из нее массив, пробегаем по созданному массиву с конкретными значениями в каждой итерации, например второй элемент это будет field_name=structure, и ищем наше "поле" $desc.find(".item-" + field_name).text() и т.д.

Answer 2

[asdz]

начинай с корневого элемента и последовательно проходи по его потомкам

$(this).closest('.item-description').find('item-description').text().end().find('item-structure').text().end().....

Comments

[Сергей Шилов]

консоль пишет: Uncaught TypeError: $(...).closest(...).find(...).text(...).end is not a function

Answer 3

[Александр Кондауров]

Вы не знакомы с js фреймворками? Angular например. Что то мне кажется у вас получится спагетти js с этим jquery

Comments

[asdz]

Какой еще ангулар, человек не знает элементарное...

[Илья Шатохин]

Целый angular ради простейшего действия? Мда...

[Александр Кондауров]

Илья Шатохин: Из таких простейших действий вылезает лапша кода в сумме. Я не думаю что его проект состоит из одной функции конкатенирующей дочерние дивы.
asdz: Я тоже когда то писал так же на jquery и жалею что раньше не узнал об ангуляре. Проще раз разобраться с ним и не писать потом код который в себе содержит и модель и представление и бизнес логику

[asdz]

Илья Шатохин: Также можно сказать "целый джиквери ради простешего действия..."

[Александр Кондауров]

asdz: Нужно узнать у человека сколько js кода он написал в своем проекте. Там рассудим