как обновить таблицы данных (подключаемый модуль jquery) без перезагрузки страницы

#jquery #ajax #datatable

Вопрос:

пожалуйста, помогите мне, я очень новичок, у меня есть вопрос о таблицах данных (подключаемом модуле jquery).

в каждой строке данных в таблице таблиц данных у меня есть кнопка для удаления данных. когда я нажимаю кнопку удаления, данные в этой строке удаляются.

вопрос в том, могу ли я обновить таблицу данных без перезагрузки страницы? таким образом, строки могут уменьшаться, когда я нажимаю кнопку удаления без перезагрузки страницы.

это мой код: (к вашему сведению, мой идентификатор таблицы для datatble: id=»mydatatable»)

 html delete button on each rows data:
-------------------------------------

<button onclick="delete('id')">Delete</button>


javascript:
-----------

delete(id)
{
    delete_ajax(id);            //deleting data using ajax

    window.location.reload()    //reloading page, this what i want to change 
                                //(just refresh datatable grid without reload the page)
}

большое спасибо 🙂

Ответ №1:

Это один из многих способов быстрого обновления таблицы

 const table=$("table.datatable").dataTable();
table.fnPageChange("first",1);

Ответ №2:

Взгляните на api. Вы должны иметь возможность вызывать fnDeleteRow для вашего объекта datatables.

http://www.datatables.net/api

1. на самом деле мне нужно не только удалить, но также добавить и отредактировать. так что, возможно, мне нужно обновить таблицы данных 🙂

2. Перейдите к связанной документации. Есть fnAddData и fnUpdate, которые, вероятно, будут соответствовать вашим потребностям.

Ответ №3:

если ваша delete_ajax() функция обрабатывает бизнес-логику и если вы хотите удалить текущую строку, вы можете легко удалить строку с помощью $('rowobject').hide().

Ответ №4:

Это сделает свое дело ->

oTable.fnDraw(false);

Вы можете вызывать следующим образом

      setInterval(function ref(){
    oTable.fnDraw(false);
    },8000);

Ответ №5:

Если вы хотите перезагрузить только данные текущей страницы, вы можете использовать этот код.

 table.ajax.reload();

Пожалуйста, обратитесь к этому DataTable ajax.reload()

Ответ №6:

Мы можем использовать DataTable API.

 var currentPage = ListTable.page();

ListTable.page(0).draw( 'page' );