DataTables получают ID - PullRequest
       1

DataTables получают ID

0 голосов
/ 22 октября 2018

Я работаю с DataTables и CodeIgniter, и сейчас я хочу иметь возможность редактировать любую строку в моей таблице, и я уже делаю это!Но я только обновляю строку с ID = 1, потому что в моем контроллере я определил это:

        $this->db->set('NameContact', $_POST['Name']);
        $this->db->set('NumberContact', $_POST['Number']);
        $this->db->where('IdContact', 1);
        $this->db->update('contacts');

Как вы видите, мне нужно получить идентификатор выбранной строки в таблицепередать его методом $ _POST.Но я не могу найти правильный способ сделать это через JS.Любая помощь, пожалуйста?

Мой HTML:

{Contacts}
                <tr>
                    <td id="{IdContact}">{IdContact}</td>
                    <td>{NameContact}</td>
                    <td>{NumberContact}</td>
                    <td><a data-toggle="modal" data-target="#EditNumber"> <i class="fa fa-edit"></i></a></td>
                </tr>
                {/Contacts}

Мой JS:

function EditPhoneNumber(){
var Name = document.getElementById("EditName").value;
var Number = document.getElementById("EditNumber").value;
console.log(Name);
console.log(Number);

jQuery.ajax({
  type: "POST",
  url: 'http://localhost/projeto/index.php/Backoffice_Controller/EditContacts',
  data: {Name: Name, Number: Number},
  success: function (response) {
    console.log("success");
    console.log(response); 
  },
  error: function(response){
    console.log("error");
     console.log(response); 
  }
});
}

Здесьмой модал:

<div id="EditNumber" class="modal fade" role="dialog">

<!-- Modal content-->
<div class="modal-content">
  <div class="modal-header">
    <h4 class="modal-title">Editar Contacto</h4>
  </div>
  <div class="modal-body">
    <input type="text" name="NameContact" placeholder="Name" id="EditName"><br>
    <input type="text" name="NumberContact" placeholder="Number" id="EditNumber">
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    <button type="button" class="btn btn-default" onclick="EditPhoneNumber()">Editar</button>
  </div>
</div>

1 Ответ

0 голосов
/ 22 октября 2018

Передайте data-id в ваш html-тег, как показано ниже, и по щелчку тега вам нужно управлять функцией, а не открывать модальный напрямую. Посмотрите на приведенный ниже код.

HTML

{Contacts}
    <tr>
        <td id="{IdContact}">{IdContact}</td>
        <td>{NameContact}</td>
        <td>{NumberContact}</td>
        <td><a href="javascript:void(0)" data-id="{IdContact}" onclick="editNumberModal(this)"> <i class="fa fa-edit"></i></a></td>
    </tr>
{/Contacts}

В вашем модале

<div id="EditNumber" class="modal fade" role="dialog">
<!-- Modal content-->
    <div class="modal-content">
        <div class="modal-header">
            <h4 class="modal-title">Editar Contacto</h4>
        </div>
        <div class="modal-body">
            <input type="text" name="NameContact" placeholder="Name" id="EditName"><br>
            <input type="text" name="NumberContact" placeholder="Number" id="EditNumber">
            <input type="hidden" name="NumberContactId" id="EditId">
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button type="button" class="btn btn-default" onclick="EditPhoneNumber()">Editar</button>
        </div>
    </div>
</div>

JS

function editNumberModal(obj){
    vat id = jQuery(obj).attr('data-id');
    jQuery('#EditNumber').modal();
}

function EditPhoneNumber(){
    var Name = document.getElementById("EditName").value;
    var Number = document.getElementById("EditNumber").value;
    var Id = document.getElementById("EditId").value;
    console.log(Name);
    console.log(Number);

    jQuery.ajax({
      type: "POST",
      url: 'http://localhost/projeto/index.php/Backoffice_Controller/EditContacts',
      data: {Name: Name, Number: Number, Id:Id},
      success: function (response) {
        console.log("success");
        console.log(response); 
      },
      error: function(response){
        console.log("error");
        console.log(response); 
      }
    });
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...