Hinzufügen von jqGrid Benutzerdefinierte Navigation zum Oberen Symbolleiste

Ist es möglich, fügen Sie Navigations-Elemente, um die "top-pager" in einem jqGrid? Und wenn ja, wie ist die syntax dafür?

Habe ich einen HTML Code auf meine Seite, die sieht aus wie diese

<table id="mygrid">
</table>
<div id="mygrid_pager"></div>

Dann ein jqGrid Initialisierung, die etwa wie folgt aussieht

$('#mygrid').jqGrid({
    ..., //full config string removed for brevity,
    pager:jQuery('#mygrid'),
    toppager:true
}); 
$('#mygrid').jqGrid('navGrid', '#mygrid_pager'),{
    'add':false,
    'del':false,
    'edit':false,
    'search':false,
    'refresh':false,
    'cloneToTop':true,  
}).navButtonAdd('',{...}); //config navbutton string for button removed for brevity

Einen "top-pager" mit der id #mygrid_toppager wird automatisch in die Seite eingefügt, aber dessen benutzerdefinierte buttons (die auf der Unterseite pager) nicht zusammen kommen für die Fahrt.

Ich sehen, dass es eine "cloneToTop" - option für die navGrid, aber seine Beschreibung verwirrend, und ich kann nur davon ausgehen, verwende ich es falsch.

Klone alle Aktionen, die von der Unterseite pager der pager Spitze
wenn Sie definiert ist. Beachten Sie, dass die navGrid angewendet werden können, um die oben
pager nur. Die id des top-pager ist eine Kombination aus Netz-id und
"_toppager"

Mein Verständnis von der option ist wird es dauern, Schaltflächen Hinzugefügt, um den Boden pager, und Klonen Sie Sie an die Spitze. Allerdings ist die Beschreibung geht dann auf zu sagen, "die navGrid angewendet werden können, um die top-pager nur, die macht keinen Sinn da Sie Sie Klonen. Der pont wird, habe ich deutlich über ein tiefes Missverständnis darüber, wie die API genutzt werden soll.

Ob jemand kann mich in die richtige Richtung (auch nur ein Beispiel irgendwo), ich würde es zu schätzen wissen. Ich würde es vorziehen, diese über die offiziellen APIs, im Gegensatz clever DOM-manipulation, wie man Sie anderswo auf StackOverflow.

InformationsquelleAutor Alan Storm | 2010-10-14

17

OK, es scheint, dass ich einen Weg gefunden, die aussieht wie besser. Die Idee ist navButtonAdd mit der "#list_toppager_left" statt "#pager".

Modifizierte ich die alte Antwort so, dass eine benutzerdefinierte Schaltfläche Hinzugefügt werden, über die oben in der Navigations-Symbolleiste wird zusammen mit einer Schaltfläche "standard". Andere Elemente aus der oberen Navigationsleiste, Symbolleiste entfernt werden. Die Ergebnisse sieht

Finden Sie die entsprechenden demo-live -hier.
- Ah, ich denke, dass ich jetzt Folgen. Im Interesse der Unterstützung der nächsten Programmierer, der kommt, wusste ich nicht, dass die "cloneToTop" - option nur Kopien der Standard-grid-Tasten und nicht alle benutzerdefinierten Schaltflächen Hinzugefügt. Ich hatte versucht, mit navButtonAdd auf mygrid_toppager ich nicht erkennen, die Sie brauchte, damit die api wissen, auf welcher Seite des Gitters man wollte es auf (Links/rechts), beim Umgang mit toppager.
- In Ihrem demo (und, was ich gerade erleben) die 'cursor: pointer' style wird nicht angewendet, wenn die Maus über die top-custom-nav-icons. Haben Sie irgendwelche Lösungen? Vielen, vielen Dank!
- Es ist eine sehr gute Frage! Die Probleme in CSS für .ui-jqgrid .ui-jqgrid-pager .ui-pg-button, aber die toppager hat Klasse ui-jqgrid-toppager und keine ui-jqgrid-pager wie der untere pager. So um das problem zu beheben sollte man hinzufügen, CSS -.ui-jqgrid .ui-jqgrid-pager .ui-pg-button { cursor: pointer }. Es ist ein Fehler in ui.jqgrid.css
- Ah, einfach! Sie meinte .ui-jqgrid-toppager statt .ui-jqgrid-pager, richtig? - Also: .ui-jqgrid .ui-jqgrid-toppager .ui-pg-button { cursor: pointer }. Danke!!
- Ja, natürlich, das cut&pased Fehler.
- Ausgezeichnete Antwort... meine Stimme +1
- Sie sind herzlich willkommen!
- Hi @Oleg ich habe ein Problem in meinem Netz, wenn auf ich auf die Schaltfläche "Bearbeiten" auf jqgrid das Bearbeiten Fenster wird geöffnet, aber wenn ich auf submit-button zeigt es "Keine url gesetzt ist', wie kann ich eine url für das navigieren zu einer anderen Seite. Ich möchte die Navigation aus 'CustomTopToolbar.htm' Seite 'addCustomTopToolbar.htm' Seite. Können Sie mir sagen.
- Klickt der Benutzer auf "Senden" - Knopf, der Edit-Formular die Formular-Daten werden per Ajax-request an die angegebene URL durch editurl Möglichkeit, jqGrid. Wenn Sie brauchen, um zu haben, verschiedenen URLs Hinzufügen und Bearbeiten-Formular des gleichen raster können Sie die URL, die überschreiben die option editurl. Es ist url option, die aufgenommen werden können, da die Immobilie url des 3-TEN oder 4-TEN parameter von navGrid.
- Danke, das problem ist gelöst. Ich möchte die Bearbeiten Schaltfläche in der ersten Spalte Feld für die Bearbeitung von Zeilen, in jqgrid zeigt sich auf der linken Ecke der Seite.
- können Sie eine Spalte hinzufügen mit formatter: "Aktionen". Ich persönlich mag das nicht, weil man dieselbe "Bearbeiten" - Schaltflächen in jeder Zeile des Rasters. Es zu reduzieren, nützlich Stelle auf der Seite. Ich selbst benutze Kontext-Menü, das gebaut werden basierend auf den Tasten in der navigator bar. Siehe die Antwort und einigen anderen meiner alten Antworten, die beschreiben die Lösung.
- Vielen Dank für Ihren Vorschlag.
- Sie sind herzlich willkommen!
- Die Zugabe von nur clonetoTop: false, pager wird nicht entfernen Sie die Navigations-Symbole aus toppager?
- Sorry, aber du solltest mehr posten, was genau Sie tun, wie Sie Sie nennen navGrid, was Sie erwarten (müssen), zu haben.
- Meine Aufgabe ist : ich will so fügen Sie eine Schaltfläche auf der oberen rechten Ecke von jqgrid. Also ich habe versucht, toppager: true, clonetoTop in navbuttonadd auf false. Es kommt mit pager-buttons. Entfernen von code ist die einzige Möglichkeit? oder gibt es irgendeinen anderen Weg, es zu tun?
- Sorry, aber man sollte nach den genauen code. clonetoTop ist die Möglichkeit navGrid. Es werden nicht verwendet bzw. ignoriert, indem navButtonAdd. Wenn das raster mit zwei Pager, und Sie möchten fügen Sie es nur in einer pager-dann geben Sie die Bezeichnung der pager als parameter der navButtonAdd. Zum Beispiel var toppager = $("#grid").jqGrid("getGridParam", "toppager"); $("#grid").jqGrid("navButtonAdd", toppager, {...});.
InformationsquelleAutor Oleg

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.