2

When I click on the delete modal of first row, the modal pops up and the data is getting deleted. If I click on the row other than the first row, it shows the error as id undefined.

Controller:

public function project_show(){
    $this->load->view('project_show',$data);//page where delete button is present
    $this->load->view('project_del');//modal page which opens on delete button
 }

public function delete_get_id($pcode){
    if($this->input->post('deleteproj'))
    {
        $this->project_model->delete_project($pcode);
    }
}

ajax:

$('#deletebutton').click(function(){
  var pcode = $(this).data('id');
  $('#deleteproject').data('id', pcode); 
});

$('#deleteproject').click(function(){
  var pcode = $(this).data('id');
  $('#deletemodal').modal('hide');
  $('body').removeClass('modal-open');
  $('.modal-backdrop').remove();
  console.log(pcode);
  $.ajax({
    type: "POST",
    url: "<?php echo base_url(); ?>" + "index.php/project/delete_get_id/"+ pcode,
    data: {
      pcode: pcode,
      deleteproj: 1,
    },
    success: function (data) {
      $("#deletemodal").modal('hide');
      showproject();
    }
  });
});

view page of button:

<button id="deletebutton" class="btn btn-danger btn-xs" data-toggle="modal" data-target="#deletemodal" data-id="<?php echo $row->project_code;?>"><span class = "fa fa-trash-o"></span> Delete</button>

view page of modal:

<div class="modal fade bs-example-modal-sm" id="deletemodal" ...>
    .....
    <button class="btn btn-danger btn delete" id="deleteproject"><span class="glyphicon glyphicon-trash"></span>Delete</button>

How will I pass the id along with "data-target" tag from page where button is present to modal page so that the particular row gets deleted

Koala Yeung
  • 7,475
  • 3
  • 30
  • 50
Anushree
  • 33
  • 6
  • 1
    You should not use the same ID for multiple HTML elements on the same page. – Koala Yeung Sep 30 '19 at 07:33
  • Use class name instead. – Koala Yeung Sep 30 '19 at 07:33
  • Thanks for answering. It'l be helpful if you let me know how can I do it(retrieving class name) @KoalaYeung – Anushree Sep 30 '19 at 08:28
  • I meant instead of using `id="deleteproject"`, you may use `class="deleteproject btn btn-danger btn delete"` instead. There is no need to retrieve it, right? – Koala Yeung Sep 30 '19 at 08:33
  • Will this provide unique id to the row? I need to add something like `data-target="deletemodalproject_code?>"` and retrive the same as `id="deletemodalproject_code?>"` in modal page, which works fine without using mvc. @KoalaYeung – Anushree Sep 30 '19 at 08:48

1 Answers1

0

Please note that ID selector is supposed to be unique in a HTML document. And jQuery expects that to be true. So instead of using ID, you should use class name for the delete button

$('.deletebutton').click(function(){
  var pcode = $(this).data('id');
  $('#deleteproject').data('id', pcode); 
});

//...

<button
  class="deletebutton btn btn-danger btn-xs"
  data-toggle="modal"
  data-target="#deletemodal"
  data-id="<?php echo $row->project_code;?>"
>
  <span class = "fa fa-trash-o"></span> Delete
</button>

Assuming your showproject() function won't accidentally remove / recreate your #deleteproject button, things should work for you.

Koala Yeung
  • 7,475
  • 3
  • 30
  • 50