Niestandardowy przycisk usuwania w jqGrid

Question

Chciałbym wdrożyć własną funkcję usuwania w jqGrid. Obecnie korzystam z wbudowanego interfejsu użytkownika (wybierz wiersz, naciśnij przycisk kosza na śmieci w stopce, potwierdź), ale wolałbym mieć przycisk usuwania w każdym wierszu i implementować mój własny interfejs do potwierdzenia.

Nie widzę niczego w API, która pozwala mi odpalić usunięcie do serwera - po prostu delRowData, które usuwa go na kliencie. Czy można to zrobić?

(Używam ASP.NET component, FWIW).

Answer 1

@Erik postawił mnie na właściwej ścieżce. Jego rozwiązanie działa, ale zachowuje istniejący pseudomodalny komunikat potwierdzający wyskakujące okienko, którego chciałem uniknąć.

Nie obejmuje również usług świadczonych przez JqGrid ASP.NET component. Komponent faktycznie obsługuje wszystkie operacje CRUD, o ile jest podłączony do poprawnie skonfigurowanego źródła danych (ObjectDataSource, SqlDataSource, itp.).

Ten brakujący element był dla mnie mechanikiem odpowiedzialnym za operacje CRUD komponentu. Przez wywiercenie z Skrzypek byłem w stanie zobaczyć, że posty odpowiednie dane do tej samej strony, z ClientID obiektu jqGrid w ciągu kwerendy:

MyPage.aspx?jqGridID=ctl00_ctl00_Content_Content_MyJqGrid

usuwania, zawartość POST są @ Erik opisuje:

oper=del&id=18

więc byłem w stanie powielać pracę na własną rękę, tak że zachowują pełną kontrolę nad całym procesem:

$(".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"); 
}; 

Answer 2

Nie ma części podstawowego składnika jqGrid, która obsługuje usuwanie po stronie serwera - nawet jeśli używasz wbudowanego usunięcia, nie usuwając go po stronie serwera, musisz sam sobie z tym poradzić. Ale oto jak skonfigurować go tak, skrypt jest wywoływana, gdy ktoś kliknie niestandardowego przycisku Usuń:

// 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} 
    ); 
}); 

Poniższa informacja jest przeszłość poprzez POST do usuwania URL

Array 
(
    [oper] => del 
    [id] => 88 
) 

gdzie id jest oczywiście id przeszedłeś do funkcji w tym przypadku, wartość toDelete.

Po prostu zrobiłem to dla mojego własnego projektu, w odpowiedzi na twoje pytanie - chociaż miałem niejasne pojęcie, jak to zrobić, zanim zobaczyłem pytanie. Więc ... dzięki za doprowadzenie mnie do tego!

Answer 3

Innym rozwiązaniem jest programem kliknij prawym przyciskiem myszy ikonę usuwania (jeśli jest obecna). Identyfikator ikony usuwania (w rzeczywistości element div) to "del_ [GridId]". To może nie być całkowicie stabilne rozwiązanie, ponieważ mogą one zmienić nazwę tego identyfikatora. Ale otrzymujesz dokładnie to samo zachowanie (a także ładniejsze potwierdzenie modalu).

Przykład:

$('#MyButton').click(function() { $('#del_' + gridId).click(); });