2014-09-04 2 views
0

Добрый день, всем, мне нужна помощь по обходу jQuery (я не могу понять это точно). В моем примере ниже, когда пользователь нажимает на строку таблицы (она подсвечена), это должно заполнить соответствующие входы/выборки div # editField (имя контакта, ответственность и телефон). Я попросил что-то подобное здесь, но мы все еще работали в одном столе (http://jsfiddle.net/7vLdxddr/7/), так что это немного другое.Обновить конкретные входы div с выбранными входами в таблицу

JQuery

$('.table').on('click', 'tr', function (e) { 

    if ($(this).hasClass('selected')) { 
     $(this).removeClass('selected'); 
    } 
    else { 
     $('tr.selected').removeClass('selected'); 
     $(this).addClass('selected'); 
    } 

    for (var i = 0; i < $(this).find("td").length; i++) { 
     // fill input values 
     $(this).closest("#editField").find("div").eq(i).find("input:text") 
     .val($(this).find("td").eq(i).text()); 

     // fill selects               //$(this).closest("table").find("th").eq(i).find("select") 
     //.val($(this).find("td").eq(i).text()); 
    } 
}); 

http://jsfiddle.net/DTcHh/1015/

+0

Будет ли выбор быть предварительно заполненные с содержанием строк, или вы только добавить выбранный вариант (из таблицы) к нему? – denisol

+0

Допустим, добавьте к нему выбранную опцию. – triplethreat77

ответ

1

Пожалуйста, обратите внимание, я с добавлением опций для избранных, так что если вы выбираете несколько строк, то, возможно, придется удалить предварительно выбранные параметры. Однако, если у вас есть предварительно заполненный выбор, вам просто нужно сопоставить значение параметра и его выбор.

$('.table').on('click', 'tr', function (e) { 

    var $this = $(this); 

    if ($this.hasClass('selected')) { 
     $this.removeClass('selected'); 
    } else { 
     $('tr.selected').removeClass('selected'); 
     $this.addClass('selected'); 

     var user = $this.find('td').eq(0).text(), 
      responsibility = $this.find('td').eq(1).text(), 
      phone = $this.find('td').eq(2).text(); 

     // fill input values 
     $('#adduser').val(user); 
     $('#responsibility').append($("<option></option>") 
      .attr("value", responsibility).text(responsibility)); 
     $('#phone').append($("<option></option>") 
      .attr("value", phone).text(phone)); 

    } 

}); 

http://jsfiddle.net/DTcHh/1017/

+0

Красивая, спасибо. – triplethreat77