использование $ (this) внутри обратного вызова jQuery для обновления текущей строки - PullRequest
Новая
       18

использование $ (this) внутри обратного вызова jQuery для обновления текущей строки

2 голосов
/ 20 декабря 2011

Я пытаюсь обновить содержимое выбранной строки html данными сервера. Я могу обновить выбранную строку html статическими данными или все строки html данными сервера. Я не могу обновить выбранную строку HTML данными сервера. 

$('td.table_with_server_update a').click(function(){    
  var var1=$(this).data('variable1');

Это обновляет выбранную строку html статическим содержимым, это то, что я хочу сделать, но с данными сервера. 

   $(this).parent().prev().html('static content');

   $.post("server_side_process.php",{varone: var1}, function(data){

Выбор всех элементов в HTML-таблице и обновление с данными сервера, это работает, затем я хочу обновить только строку «нажал» с данными сервера 

   $('td.table_with_server_update').prev().html(data); //updates all html rows

Это то, что я хочу, но не знаю, как это выразить. Я думаю, что моя проблема в $ (this) внутри функции обратного вызова 

   $(this).parent().prev().html(data); // no error in firebug, but doesn't rewrite html

   });         
  });                                             
});

... 

<table border="1">
  <tr>
    <td>rewrite this data  </td><td class="table_with_server_update"><a href="javascript:void(0)" data-variable1='1'>Update this row</a> </td>  
  </tr>
  <tr>
    <td>rewrite this data</td><td class="table_with_server_update"><a href="javascript:void(0)" data-variable1='2'> Update this row</a></td>  
  </tr>

Ответы [ 2 ]

2 голосов
/ 20 декабря 2011

this внутри $.post() обратный вызов относится к объекту jQuery XHR, а не к элементу привязки.Вам необходимо сохранить this в контексте элемента привязки в переменную и получить к нему доступ внутри $.post() обратного вызова.

Попробуйте это: 

$('td.table_with_server_update a').click(function() {
    // save "this" into $this variable directly as jQuery object 
    var $this = $(this);  
    var var1 = $this.data('variable1');

    $this.parent().prev().html('static content');

    $.post("server_side_process.php",{varone: var1}, function(data) {
      $('td.table_with_server_update').prev().html(data); //updates all rows
      // use saved "$this" = anchor instead of "this" = jQuery XHR object
      $this.parent().prev().html(data);
    });
});
0 голосов
/ 20 декабря 2011

Другие решения будут работать просто отлично, но альтернативой является использование длинного формата $.post, $.ajax и установка опции context: 

$('td.table_with_server_update a').click(function(){    
    var var1 = $(this).data('variable1'); 

    $.ajax({
        type: 'POST',
        url: "server_side_process.php",
        data: { varone: var1 },
        context: this, /* Set the context of ajax-related callbacks */
        success: function (data) {
            /* "this" is now correct */
            $(this).parent().prev().html(data);
        }
    });
});

Пример: http://jsfiddle.net/vUaUV/

...