2016-03-30 5 views
1

Я пытался найти три входа (тип = текст), которые были добавлены динамически с помощью jQuery. Я пытался использовать .closest(), .parents(), .find() и .children(), но мне не удалось.Найти поле ввода с помощью jQuery

Я также пробовал с document.getElementsByName, но он не возвращает правильное значение, если я создаю несколько групп входов (которые можно добавить динамически, как я сказал ранее).

Мой код выглядит следующим образом:

function update(username, row) { 
    affiliation_val = $(document.getElementsByName('affiliation')).val(), 
    comments_val = $(document.getElementsByName('comments')).val(), 
    role_val = $(document.getElementsByName('role')).val(); 
//the search above does not work when I add multiple inputs… it returns only the first three inputs 
    console.log($(row).closest(“input”)); //one of my attempts... I also did using a combination of parents("tbody") and children("input"), for example... and many others 
} 


function format(d) { 
     var message1 = '<table cellpadding="8" cellspacing="0" border="0" style="padding-left:50px;">'+ 
     '<tr>'+ 
      '<td class="text-right"><b>User ID:</b></td>'+ 
      '<td class="text-left"> &nbsp; '+username+'</td>'+ 
     '</tr>'+ 
     '<tr>'+ 
      '<td class="text-right"><b>Password last set:</b></td>'+ 
      '<td class="text-left"> &nbsp; '+d.pwd_last_set+'</td>'+ 
     '</tr>'+ 
     '<tr>'+ 
      '<td class="text-right"><b>Uid number:</b></td>'+ 
      '<td class="text-left"> &nbsp; '+d.uid+'</td>'+ 
     '</tr>'+ 
     '<tr>'+ 
      '<td class="text-right"><b>Email:</b></td>'+ 
      '<td class="text-left"> &nbsp; '+d.email+'</td>'+ 
     '</tr>'+ 
     split_projects(d.projects_name, d.projects_role), 
     message2 = '<tr>'+ 
      '<td class="text-right"><b>Affiliation:</b></td>'+ 
      '<td class="text-left"><input type="text" name="affiliation" value="'+d.affiliation+'" '+readonly+' /></td>'+ 
     '</tr>'+ 
     '<tr>'+ 
      '<td class="text-right"><b>Comments:</b></td>'+ 
      '<td class="text-left"> <input type="text" name="comments" value="'+d.comment+'" '+readonly+' /></td>'+ 
     '</tr>'+ 
     '<tr>'+ 
      '<td class="text-right"><b>Role:</b></td>'+ 
      '<td class="text-left"><input type="text" name="role" value="'+d.role+'" '+readonly+' /></td>'+ 
     '</tr>', 
     message3 = show_inconsistency(inconsistent)+ 
     show_miss_uid(miss_uid)+ 
     '<tr>'+ 
      '<td>&nbsp; </td>' + 
     '<td>'+ 
       '<button type="button" class="btn btn-default" onclick="sendMail(\'' +username+ '\'); return false">' + 
       '<span class="glyphicon glyphicon-envelope" aria-hidden="true"></span> Request change of permission' + 
       '</button> <br/><br/> ' + 
      '</td>' + 
     '</tr>' + 
    '</table>', 

     button = '<tr><td>&nbsp;</td><td><button class="btn btn-default" onclick="update(\''+username+'\', this)">Update</button</td></tr>'; 

    return message1+message2+button+message3; 
} 

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

+0

Я немного смущен вашим синтаксисом/структурой ха-ха, это то, что вы пытаетесь сделать, это получить все входные значения данной строки, когда вы нажимаете кнопку в этой строке? мы могли бы увидеть структуру html (нет той, которую вы создали в js) – indubitablee

+1

Я обновил код. Надеюсь, теперь будет ясно. Я создаю один стол и возвращаю его. Затем пользователь меняет значения входов. Как только пользователь нажимает кнопку обновления, я хочу получить значения трех входов в этой таблице и работать с ними на моем бэкенде. – mk2

ответ

1

Следующая должна работать в качестве селектора, изменить «Роль»:

$('#tableId input[name="role"]').val(); 

Отредактировано после более подробной информации (см. Комментарии ниже)

+1

Это приводит к той же проблеме, что и у document.getElementsByName. Он возвращает только значение первой таблицы – mk2

+2

@rennomarcus Если это работает, но вам нужно несколько feilds, просто используйте 'each()' например. '$ ('input [name =" role "]') .each (function() {alert ($ (this) .val())})' – DBS

+1

А, ок. Есть ли причина, по которой вы не можете вводить идентификаторы, возможно, с именем и индексом группы входов (таблица 1 имеет role1, таблица 2 имеет role2 и т. Д.) И использовать их в качестве селекторов? – Michael

3

Используйте селектор jQuery("[attribute='value']")

affiliation_val = $("input[name='affiliation']").val(); 
comments_val = $("input[name='comments']").val(); 
role_val = $("input[name='role']").val(); 
+0

Это не сработает, так как оно ищет значение в отличие от имени – Michael

+0

Спасибо, я предназначено для того, чтобы поместить имя вместо значения –

+1

То же самое, что комментарий @MikeSprague – mk2

2

Как также предлагает @DBS, используйте .each().

$('[name="role"]').each(function(index, element){ 
    console.log($(element).val()); 
}); 

Это будет проходить через каждый элемент в настоящее время на странице с именем «role» и распечатать их значение на консоли.

Если вам нужно только найти элементы (чтобы сделать что-то еще с ними, как вы предлагаете в своем вопросе), вы можете использовать element внутри цикла .each(), чтобы делать что-то с каждым элементом.

Вот еще одна идея. Если вы знаете, родитель элементов (так как это звучит, как у вас есть более чем один из каждого из этих элементов на странице), и заинтересованы в particulare один, попробуйте следующее:

$('#myParentID [name="role"]');

Это будет выберите только вход role внутри #myParentID.

Смежные вопросы