jqGrid: Eigene Buttons mit custom Form & Function

[lindo]

Hallo Forum,

vielleicht hat jemand von Euch Erfahrungen mit jqGrid sammeln können. Bis jetzt habe ich es geschafft, dass das Grid befüllt wird und die Standard-Funktionen im Pager (add, edit, delete) funktionieren. Ebenso habe ich es hinbekommen, dass individuelle Buttons (Reservieren und Bestellen) erscheinen, denen ich auch zuverlässig POST-Daten übergeben kann, jedoch fehlt mir noch ein Dialog, quasi eine Sicherheitsabfrage, in dem ich den Event mit Ja/Nein/Abbrechen bestätigen muss. Im zweiten Step, sollen dort auch noch custom Formfelder erscheinen, um zusätzliche Angaben machen zu können. Hier mein Code mit Kommentaren:

                    <table id="listVP"></table>
                    <div id="pagerVP"></div>

                    <script>
                        $("#listVP").jqGrid({
                            url: 'lager_nur_vp.php',
                            datatype: 'json',
                            mtype: 'POST',
                            editurl: 'insertDB.php',
                            height: 640,
                            width: 1740,
                            colNames: ['Stellplatz', ... usw.],
                            colModel: [
                                {
                                    name: 'place_code',
                                    index: 'place_code',
                                    width: 80,
                                    sorttype: 'string',
                                    searchoptions: {sopt: ['eq', 'bw', 'bn', 'cn', 'nc', 'ew', 'en']},
                                    editable: true,
                                    edittype: "select",
                                    editoptions: {
                                        value: "<?php $placesList = new Papiermanagement(); echo $placesList->getPlaces(); ?>"
                                    }
                                // gekürzt: DEFINITION WEITERER ZELLEN
                                }
                            ],
                            rowNum: 50,
                            rowTotal: 200,
                            rowList: [20, 30, 50],
                            loadonce: true,
                            rownumbers: true,
                            rownumWidth: 40,
                            gridview: true,
                            pager: '#pagerVP',
                            sortname: 'item_id',
                            viewrecords: true,
                            sortorder: "asc"
                        });
                        $("#listVP").jqGrid('filterToolbar', {searchOperators: true});
                        $('#listVP').navGrid('#pagerVP',
                            // the buttons to appear on the toolbar of the grid
                            {
                                edit: true,
                                add: true,
                                del: true,
                                search: false,
                                refresh: true,
                                view: true,
                                position: "left",
                                cloneToTop: false
                            },
                            // options for the Edit Dialog
                            {
                                editCaption: "Papier bearbeiten",
                                recreateForm: true,
                                checkOnUpdate: true,
                                checkOnSubmit: true,
                                closeAfterEdit: true,
                                afterSubmit: function () {
                                    $(this).jqGrid('setGridParam', {datatype: 'json'}).trigger('reloadGrid'); // Grid sofort neuladen um Werte zu sehen
                                    $("#cNew").trigger('click'); // schließen des Formfeldes
                                },
                                errorTextFormat: function (data) {
                                    return 'Error: ' + data.responseText
                                }
                            },
                            // options for the Add Dialog
                            {
                                closeAfterAdd: true,
                                closeAfterSubmit: true,
                                recreateForm: true,
                                errorTextFormat: function (data) {
                                    return 'Error: ' + data.responseText
                                }
                            }
                            ,
                            // options for the Delete Dailog
                            {
                                errorTextFormat: function (data) {
                                    return 'Error: ' + data.responseText
                                }
                            }
                            // gekürzt auf einen Zusatzbutton als Beispiel
                        ).navButtonAdd('#pagerVP',
                            {
                                caption: 'Bestellen',
                                buttonicon: 'ui-icon-add',
                                onClickButton: function () {
                                    var line = $('#listVP').jqGrid('getGridParam', 'selrow');
                                    if (line == null) {
                                        alert("Bitte eine Zeile wählen!");
                                    }
                                    else {
                                    // Hier sende ich an insertDB.php die item_id der betroffenen Zeile
                                        $.post('insertDB.php', {item_id: line, oper: 'best'}, function (line) {
                                        // die folgende Zeile sollte den Dialog öffnen, es folgt aber immer
                                        // Uncaught TypeError: Cannot read property 'info_dialog' of undefined
                                            $.jqGrid.info_dialog('Papier bestellen', line, $.jqGrid.edit.bClose, {
                                                buttonalign: 'center',
                                                width: 'auto',
                                                resize: true,
                                                align: 'left'
                                            });
                                        });
                                    }
                                },
                                position: 'last'
                            }
                        );
                    </script>

Hier dann noch meine AJAX-Datei, wo ich die Werte letztendlich an die Class übergebe:

<?php

require_once('config/config.php');
require_once('classes/Papiermanagement.php');

switch ($_POST['oper']) {
    case 'edit':
        $task = new Papiermanagement();
        $task->editPlace($_POST);
        break;
    case 'del':
        $task = new Papiermanagement();
        $task->deletePlace($_POST);
        break;
    case 'add':
        $task = new Papiermanagement();
        $task->addPlace($_POST);
        break;
    case 'best':
        $task = new Papiermanagement();
        $task->moveToOrders($_POST);
        break;
}

Wenn jemand ein funktionierendes Beispiel auf Lager hätte, wäre das super. Ich google schon eine Weile und komme nicht weiter. Es kann auch der falsche Ansatz sein, die eigentliche Verarbeitung in eine eigene Klasse zu verschieben???

Ich danke für jede Hilfe
Gruss Dom

[fanderlf]

Warum frägst Du nicht im dazugehörigen Forum?

http://guriddo.net/?forum=guriddo-js

Das Grid ist relativ speziell. Das wird hier vermutlich auch noch keiner benutzt haben Vielleicht findest Du ja dort auch ein Beispiel.