Пользовательская кнопка удаления в jqGrid
Я хотел бы реализовать свою собственную функцию удаления в jqGrid. В настоящее время я использую встроенный пользовательский интерфейс (выберите строку, нажмите кнопку корзины в нижнем колонтитуле, подтвердите), но я предпочел бы иметь кнопку удаления в каждой строке и реализовать свой собственный пользовательский интерфейс для подтверждения.
Я не вижу ничего в API, что позволяет мне запускать удаление на сервер - просто delRowData, который удаляет его на клиенте. Можно ли это сделать?
(я использую ASP.NET компонент , FWIW).
3 ответов:
В базовом компоненте jqGrid нет части, которая обрабатывает удаление на стороне сервера - даже если вы используете встроенное удаление, оно не удаляет его на стороне сервера для вас, вы должны справиться с этим самостоятельно. Но вот как настроить его так, чтобы ваш скрипт вызывался, когда кто-то нажимает вашу пользовательскую кнопку удаления:
// your custom button is #bDelete $("#bDelete").click(function(){ // Get the currently selected row toDelete = $("#mygrid").jqGrid('getGridParam','selrow'); // You'll get a pop-up confirmation dialog, and if you say yes, // it will call "delete.php" on your server. $("#mygrid").jqGrid( 'delGridRow', toDelete, { url: 'delete.php', reloadAfterSubmit:false} ); });Следующая информация передается через POST на Ваш URL удаления
Array ( [oper] => del [id] => 88 )Где id-это, очевидно, идентификатор, который вы передали в функцию в этом случае, значение
На самом деле я просто сделал это для своего собственного проекта, в ответ на ваш вопрос - хотя у меня было смутное представление о том, как это сделать, прежде чем я увидел вопрос. Так... спасибо, что заставили меня взяться за это!toDelete.
@Erik вывел меня на правильный путь. Его решение работает, но сохраняет существующий псевдомодальный всплывающий интерфейс подтверждения, которого я хотел избежать.
Он также не использует услуги JqGrid ASP.NET компонент обеспечивает. Компонент фактически выполняет все операции CRUD, пока он подключен к правильно настроенному источнику данных (ObjectDataSource, SqlDataSource и т. д.).
Эта недостающая часть для меня была механикой, стоящей за операции CRUD компонента. Порывшись с Fiddler, я смог увидеть, что он отправляет соответствующие данные на ту же страницу, с ClientID объекта JqGrid в строке запроса:
MyPage.aspx?jqGridID=ctl00_ctl00_Content_Content_MyJqGridДля удаления содержимое поста выглядит так, как описывает @Erik:
oper=del&id=18Таким образом, я смог продублировать операцию самостоятельно, чтобы сохранить полный контроль над всем процессом:
$(".DeleteButton", grid).click(function(e) { var rowID = getRowID(this); $(grid).setSelection(rowID, false); if (confirm('Are you sure you want to delete this row?')) { var url = window.location + '?jqGridID=' + grid[0].id; var data = { oper: 'del', id: rowID }; $.post(url, data, function(data, textStatus, XMLHttpRequest) { $(grid).trigger("reloadGrid"); }); } else { $(grid).resetSelection(); } // if }); // click getRowID = function(el) { return $(el).parents("tr").attr("id"); };
Другое решение-программно нажать на значок удаления (если он есть). Идентификатор значок "Удалить" (на самом деле див) - это "del_[GridId]". Это не может быть полностью твердым решением, так как они могут изменить это имя идентификатора. Но вы получаете точно такое же поведение (а также более приятный подтверждающий модальный).
Пример:
$('#MyButton').click(function() { $('#del_' + gridId).click(); });
Comments