jQuery переменные scope undefined после формы submit

Question

Я захватываю атрибут данных при щелчке для идентификатора, который я хочу опубликовать. Если I console.log() мой идентификатор IO может видеть его, однако у меня есть функция отправки для формы и данные не определено здесь ... Не знаю, почему, вот мой код:

$('[data-id="add_child_notification"]').unbind().bind('click', function(){ 

    var data = []; 
    var message; 
    var parent_id; 
    var user_id; 

    parent_id = $(this).attr('data-parent-id'); 

    user_id = $(this).attr('data-user-id'); 

    data.push({ name: 'parent_id', value : parent_id, nameUid: 'user_id', valueUid : user_id }); 

    console.log('before: '+parent_id); 

    $('[data-form="send_child_notification"]').unbind().bind('submit', function(){ 

     console.log('after: '+data[1].parent_id); 

     message = $('[data-input="child-message-textarea"]:last').val(); 

     console.log('msg: '+message); 

     data.push({ nameMsg: 'message', valueMsg: message }); 

     $.post(URL+'notifications/send_child_notification', data, function(e){ 

     if(e.status){ 

      $('body').append('<div class="success_box"><span class="glyphicon glyphicon-thumbs-up"></span><p>Notification sent</p></div>'); 
       $('.success_box').delay(1000).fadeOut(); 
       window.location = window.location.href; 
      } else { 
       alert(e); 
       //alert('Uh oh! Something went wrong, please try again..'); 
      } 

     }); 

    }); 

}); 

Answer 1

data представляет собой массив, содержащий объекты.

data == [ {name: 'parent_id', value : parent_id, name: 'user_id', value : user_id } ] 

Таким образом, вы должны использовать data[0].value, какое значение parent_id.

EDIT 1:

Как Джеймс заметил, ключ «значение» определяется в два раза, так что в последний раз он определен перекрывает предыдущий (ы), и вы получите user_id.

В этом отношении «имя» также определено дважды.

Иными словами, есть недостаток в вашем дизайне, и вы не можете достичь parent_id. Исправьте двойные ключи Definiton что-то вроде:

data.push({ name: 'parent_id', value : parent_id, uidName : 'user_id', uidValue : user_id }) 

EDIT 2:

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

data == [ { name: 'parent_id', value : parent_id, nameUid: 'user_id', valueUid : user_id }, 
{ nameMsg: 'message', valueMsg: message } ] 

... который практически не является удобным и стандартным. Я думаю, вы хотите этот объект данных:

data == { 
    'parent_id' : parent_id, 
    'user_id' : user_id, 
    'message' : message } 

Таким образом, вы можете получить доступ к свойствам просто с data.parent_id или data.message.

Если да, то это:

$('[data-id="add_child_notification"]').unbind().click(function(){ 

    var data = { 
     'parent_id' : $(this).data('parent-id'), 
     'user_id' : $(this).data('user-id') 
    } 

    $('[data-form="send_child_notification"]').unbind().submit(function(){ 

     data.message = $('[data-input="child-message-textarea"]:last').val(); 

     $.post(URL+'notifications/send_child_notification', data, function(e){ 

      .... 

Кроме того, селекторы как $('[data-input="child-message-textarea"]:last') выглядят очень неуклюжими тоже, но так как вы не размещать HTML-код, это трудно угадать право один и правильный.

Answer 2

Я оказался не чем иным, как областью видимости, а тем, чем я являюсь, я объявляю объект с помощью jQuery, и вы не можете нажать на объект. Вместо этого вам нужно назначить вар на объект так:

data.user_id = user_id; 
data.message = message; 

После этого мои вары были определены правильно, и все работало!

Спасибо за помощь!