Удаление данных на лету не работает

Question

Я пытаюсь использовать jquery ajax для удаления некоторых данных, в частности ингредиентов рецепта, и я использую платформу CodeIgniter, но это не удается. Вот части моего кода:

$(".delete").live('click',function()
{
 var ri_id = $(this).attr('id');
 if(confirm("Are you sure you want to delete this ingredient? Action cannot be undone."))
 { 
  var r_id = "<?php echo $this->uri->segment(3); ?>";
  alert(ri_id +" " +r_id); 
  $.ajax({
     type: "POST",
     url: "/ingredient/delete",
     data: "ri_id="+ri_id +"&r_id=" +r_id,
     success: function(){
      $(this).parent().parent().parent().remove();
     },
     failure : alert('fail')
  });

Тогда вот мой ингредиент. Php:

class Ingredient extends CI_Controller {

    function delete()
    {
        $data['ri_id']= $this->input->post('ri_id');
        $data['r_id']= $this->input->post('r_id');

        if (!empty($data['id']))
        {
            $this->load->model('ingredient_model', '', TRUE);
            $this->ingredient_model->delete_recipe_ingr($data);
            $this->output->set_output('works');
        } 
        else 
        {
            $this->output->set_output('dontwork');
        }
    }

}

и моя модель:

  class Recipe_model extends CI_Model
  {
      public function delete_recipe_ingr($data)
      {
          $this->db->where($data);
          $this->db->delete('st_recipe_ingredients');  
      } 
  }

Я что-то пропустил или мой код неверен? Буду очень признателен за вашу помощь. Заранее спасибо.

Answer 1

Мое первое предположение, что this не то, что вы думаете, это прямо здесь:

success: function(){
  $(this).parent().parent().parent().remove();
},

Из тонкой инструкции :

контекст
Этот объект станет контекстом всех обратных вызовов Ajax. По умолчанию context - это объект, представляющий параметры ajax, используемые в вызове ($.ajaxSettings объединен с параметрами, переданными в $.ajax).

Таким образом, в вашем success обратном вызове this является скорее простым объектом, чем чем-то в DOM.

Существует два стандартных решения. Вы можете сохранить ссылку на this и использовать это:

var self = this;
$.ajax({
    // ...
    success: function() {
        $(self).parent().parent().parent().remove();
    },
    // ...

или используйте опцию context для $.ajax:

$.ajax({
    // ...
    context: this,
    success: function() {
        $(this).parent().parent().parent().remove();
    },
    // ...

И, конечно, исправьте вещи failure, как описано в комментариях.