Question

У меня есть следующие HTML

  <li class='user_attributes'><b>username: </b>{{username}} 
       <input class='user_input form-control edit_fields {{_id}}' id='username_field' type="text" name='username' placeholder="username"> 
       <button type="submit" class="btn btn-default submit_button edit_fields {{_id}}" id='update_username'>update</button> 
      </li> 

И я хотел бы получить значение поля ввода всякий раз, когда <li> «s кнопка отправки нажата (не значение других полей ввода с тем же именем).

У меня есть следующий JQuery, но все это возвращает неопределенное значение:

'click #update_username': function(ev, template){ 
     ev.preventDefault(); 

     // var username_field = template.$('input[id="username_field"]').val(); 

     // var username_field = $(ev.target).find('[name = message]').val(); 

     var input_field = $(this).siblings($('input[id="username_field"]')).val(); 

     console.log(input_field); 

     // Meteor.call('updateUsername', this._id, username_field); 

    } 

EDIT

это вопрос о рамочном Im использованием (Meteor.js) и сфера " это

Answer 1

Попробуйте что

https://jsfiddle.net/zy7qy3v5/3/

$('button').click(function(){ 
    var value = $(this).siblings('input').val(); 
    alert(value); 
}) 

Dont положить ненужный объект Jquery в функции братьев и сестер. Ваш селектор возвращает всех братьев и сестер.

$('button').siblings('input') //Returns 1 element 

не то же самое, как

$(this).siblings($('input[id="username_field"]')) //Returns 2 element 

См https://jsfiddle.net/8x04nbyx/5/

Answer 2

$(document).ready(function(){ 
    $('#update_username').on('click',function(ev, template){ 
     ev.preventDefault(); 

     // var username_field = template.$('input[id="username_field"]').val(); 

     // var username_field = $(ev.target).find('[name = message]').val(); 

      var input_field = $(this).closest('li').find('input').val(); 

     console.log(input_field); 

     // Meteor.call('updateUsername', this._id, username_field); 

    }); 
}); 

Answer 3

Я не уверен, если это это, что вы хотите, но дайте ему попробовать:

$('#update_username').click(function(){ 
 
       var test = $('#username_field').val() 
 
       alert (test) 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<li class='user_attributes'><b>username: </b>{{username}} 
 
       <input class='user_input form-control edit_fields {{_id}}' id='username_field' type="text" name='username' placeholder="username"> 
 
       <button type="submit" class="btn btn-default submit_button edit_fields {{_id}}" id='update_username'>update</button> 
 
      </li>