Wie neu laden JQuery grid-halten Sie die scroll-position und Zusammenbruch Elemente öffnen

Derzeit arbeite ich mit JQuery plugin für struts2. Ich würde gerne wissen, wie neu zu laden JQuery raster, ohne dabei die aktuelle scroll-position und reduzieren von Zeilen.

Um das nachladen der Daten in der Tabelle ich bin mit dem folgenden javascript-code:

var timerID = setInterval("RefreshGridData()", 5000);
function RefreshGridData() {
    $("#griditems").trigger("reloadGrid");
}

Die jsp des Rasters ist die folgende:

<s:url id="itemsurl" action="getItemsJson.action" />
<s:url id="subitemsurl" action="getSubItemsJson.action" />
<sjg:grid id="griditems" caption="Items and Subitems" dataType="json"
    href="%{itemsurl}" pager="false" viewrecords="true" height="400"
    gridModel="gridModel" rowNum="-1" sortable="true">

    <sjg:grid id="gridsubitems" subGridUrl="%{subitemsurl}"
        gridModel="gridModel" rowNum="-1">
        <sjg:gridColumn name="subcol1" index="subcol1" title="SubColumn 1"
            width="120" />
        <sjg:gridColumn name="subcol2" index="subcol2" title="SubColumn 2"
            align="left" width="120" />
    </sjg:grid>

    <sjg:gridColumn name="col1" index="col1" title="Column 1" sortable="true"
        width="80"/>
    <sjg:gridColumn name="col2" index="col2"
        title="Column 2" sortable="true" />
    <sjg:gridColumn name="col3" index="col3" title="Column 3"
        sortable="true" />
</sjg:grid>

Irgendwelche Kommentare auf, wie diese umzusetzen sind willkommen.

Vielen Dank im Voraus.

Sollten Sie weitere Informationen über das jqGrid, die Sie versuchen zu laden.
Danke für die Anregung Oleg, ich habe gerade den code der Tabelle.

InformationsquelleAutor Zion | 2011-04-18

9
```
var scrollPosition = 0

function RefreshGridData() {
    scrollPosition = jQuery("#griditems").closest(".ui-jqgrid-bdiv").scrollTop()
    $("#griditems").trigger("reloadGrid");
}
```
nachdem die Daten geladen, die im Ereignis loadComplete
```
jQuery("#griditems").closest(".ui-jqgrid-bdiv").scrollTop(scrollPosition)
```
EDIT :
```
var ids = new Array();


jQuery("#jqgrid_id").jqGrid({
...
   gridComplete: function(){ 
      var rowIds = $("#jqgrid_id").getDataIDs();
      $.each(ids, function (index, data) {
        if (data == 1){
           $("#jqgrid_id").expandSubGridRow(rowId); 
        }
      });
   },
   subGridRowExpanded: function(pID, id){ 
      ids[id] = 1;
   },
   subGridRowColapsed: function(pID, id){ 
      ids[id] = 0;
   },

...
});
```
nicht sicher, ob dies funktionieren wird, ich habe nicht testen Sie es tut, es sollte so etwas wie, dass

BEARBEITEN

setGridParam - nicht suire, ob es funktionieren wird auf Veranstaltungen, aber Sie könnten versuchen, die

konnte ich nicht finden, so setzen Sie subGridRowExpanded topick mit tag-Bibliothek im Streben, sondern versuchen Sie, durch verändern der config, die nach raster konstruiert, indem taglibrary
```
$("#griditems").setGridParam({subGridRowExpanded: function(pID, id){ ids[id] = 1;}});
$("#griditems").setGridParam({subGridRowColapsed: function(pID, id){ ids[id] = 0;}});
$("#griditems").setGridParam({gridComplete: function(){ 
      var rowIds = $("#jqgrid_id").getDataIDs();
      $.each(ids, function (index, data) {
        if (data == 1){
           $("#jqgrid_id").expandSubGridRow(rowId); 
        }
      });
   }});
```
BEARBEITEN

ok unterschiedliche Herangehensweise :
```
var scrollPosition = 0
var ids = new Array();

function RefreshGridData() {
        ids = new Array();
        $('tr:has(.sgexpanded)').each(function(){ids.push($(this).attr('id'))});
        scrollPosition = jQuery("#griditems").closest(".ui-jqgrid-bdiv").scrollTop()
        $("#griditems").trigger("reloadGrid");
    }
```
und beim laden von grid ist komplett :
```
jQuery.each(ids, function (id,data) {
           $("#jqgrid_id").expandSubGridRow(data);
           jQuery("#griditems").closest(".ui-jqgrid-bdiv").scrollTop(scrollPosition);
      });
```
- Vielen Dank für deine Antwort firegnom. Deine Antwort war hilfreich zum speichern der scroll-position der JQuery-grid. Allerdings habe ich immer noch das problem, dass die aufgeklappten Unterpunkte in der subgrid zugeklappt, jedes mal wenn das grid neu geladen wird. Irgendwelche Ideen?
- nur die Idee ist sehr nasy verbinden Ereignisse subGridRowExpanded und subGridRowColapsed Sie geben die id schreiben diese id ' s zu array und mit Hilfe der Funktion $("#jqgrid_id").expandSubGridRow(rowId); erweitern Sie alle onload -
- Nochmals vielen Dank für deine Antwort firegnom. Ich glaube, diese Lösung sollte funktionieren, aber ich habe nicht gefunden, welche Ereignisse ausgelöst werden, wenn ein subgrid Zeile erweitert/reduziert. Kennst du das schon?
- firegnom. Ich sehe, dass die Ereignisse ausgelöst werden subGridRowExpanded und subGridRowCollapsed wie Sie angegeben haben. Aber obwohl ich die abonniert hören Sie auf diese Ereignisse, wird die Funktion nie erreicht. $.subscribe('subGridRowExpanded', function(pID, id) { $("#testp").html("Habe!"); });
- soweit ich weiß ist Sie nicht abonnieren, um die Ereignisse, die Sie benötigen, um Sie während der Konstruktion von jqgrid wie in Beispiel gab ich vor.
- ok, ich sehe jetzt Ihr problem struts2 taglib ist begrenzt, aber versuchen, das hinzufügen von Ereignis-nach der Verwendung setGridParam nicht sicher, ob es funktionieren wird, obwohl
- Ich versuchte, zu den grid-Parameter nach dem Bau, wie Sie erwähnt. Leider, obwohl, dies ist nicht die Arbeit mit jquery-tags-plugin. Was mir scheint ist, dass das publish/subscribe-framework verwendet, in struts2 nicht unterstützt subGridRowExpanded/Zusammengebrochen Themen. Ich werde versuchen, diese umzusetzen anders.
- ok, anderer Ansatz : $('tr:hat(.sgexpanded)') geben Sie alle folgezeilen sehen Letzte änderung
- mit dem code am Ende dieses Kommentar, es ist möglich, die Funktion, die ausgelöst wird, auf subGridRowExpanded Veranstaltung. Es scheint jedoch, dass beim festlegen einer Funktion, die es einfach überschreibt die ursprüngliche Funktionalität der "plus" - Zeichen, da Sie nach der Einstellung eine neue Funktion, my-Funktionalität ausgeführt, aber die subgrid ist nicht wirklich ausgebaut. <br/> jQuery("#testgrid").jqGrid('setGridParam', {subGridRowExpanded: Funktion(pID, id){$("#test_p").html("Datensatz-id:" + id);}});
- Ich werde versuchen, das zu implementieren Ihr neuer Vorschlag
- yep struts2 taglig ist die Verbindung zu subGridRowExpanded und zu ändern, verlieren Sie Ihre Funktionalität 🙁 linkto Quelle : code.google.com/p/struts2-jquery/source/browse/branches/3.0.0/...
InformationsquelleAutor firegnom

Ich endlich mein problem gelöst. Vielen Dank für die nützlichen Informationen, die von firegnom in seine Antwort und Kommentare bekam ich einen grossen Schub nach vorn zu schaffen, eine Implementierung von jQuery grid (mit subgrid), mit Struts2-tags, die behält seine vorherigen scroll-position und erweitert/reduziert Zustand nach neu laden.

JavaScript

var scrollPosition = 0;
    var ids;
    var timerID = setInterval("RefreshGridData()", 5000);



function RefreshGridData() {
    var num;
    ids = new Array();  
    scrollPosition = jQuery("#testgrid").closest(".ui-jqgrid-bdiv").scrollTop();            
    jQuery("#testgrid tr:has(.sgexpanded)").each(function(){
        num = $(this).attr('id');
        if (isDigit(num)) {         
            ids.push(num);
        }
    }); 
    $("#testgrid").trigger("reloadGrid");           
}               

function isDigit(num) {         
    if (num.length > 1){return false;}                                  
    if (num > 0 && num < 20) {return true;}     
    return false;
}


$(document).ready(function () {         
$.subscribe('testgridReloded', function(event, element) {   
    var i;
    for (i = 0; i < ids.length; i = i+1) {                  
        $("#testgrid").jqGrid('expandSubGridRow', ids[i]);
    }    



    var t = setTimeout("setScrollPos()", 300);
    });
}); 



function setScrollPos() {
    jQuery("#testgrid").closest(".ui-jqgrid-bdiv").scrollTop(scrollPosition);
}

Benutzte ich die isDigit - Funktion, da das erste element mit der Klasse sgexpanded ist immer 0, und dies ist keine gültige Zeilennummer in einem raster da die Zeilen zählen von 1. Eine weitere Beobachtung ist, dass ich einen timer einstellen, bevor Sie die setScrollPos-Funktion, da mein Netz nicht über eine scroll-bar, bevor Sie eine bestimmte Anzahl von Zeilen erweitert werden, und da die expandierende Wirkung ist nicht sofort, es ist notwendig, um die scroll-position nach einer gewissen Zeit.

Grid code-tags

<s:url id="gridurl" action="getJsonGridData.action" />

<sjg:grid id="testsubgrid" subGridUrl="%{subgridurl}"
    gridModel="gridModel" rowNum="-1" >
    <sjg:gridColumn name="sub1" index="sub1" title="Sub Col 1"
        width="80" />
    <sjg:gridColumn name="sub2" index="sub2" title="Sub Col 2"
        align="left" width="80" />
</sjg:grid>

<sjg:gridColumn name="col1" index="col1" title="Grid Col 1" sortable="true" width="120" />
<sjg:gridColumn name="col2" index="col2" title="Grid Col 2" width="120" />
<sjg:gridColumn name="col3" index="col3" title="Grid Col 3 width="120" />
</sjg:grid>

Hoffe, es hilft jemandem.

Cheers.

Nicht schön, mate, Sie haben nur genommen, meine Ideen , code hübsch formatiert und geschrieben, wie Ihre eigene Antwort nicht nett!!!!!
Du hast Recht, ich habe Ihre Ideen zu finden, die eine richtige Lösung für mein problem. Ich dachte, es wäre sinnvoll, alles zusammengefasst in einer richtigen Antwort. Trotzdem, ich habe wirklich keine Meinung über die Eigentümer der Antwort. Nun gab ich die Antwort für Sie. Nochmals vielen Dank für Ihre Unterstützung.

InformationsquelleAutor Zion

0

Laden der Seite in-place (hält die aktuelle scroll-position) verwenden Sie einfach:
```
$("#"mygrid"").trigger("reloadGrid",[{current:true}]);
```
InformationsquelleAutor Morey

Habe ich das problem lösen, indem diese

var offset = $("#" + *subgrid_table_id*).offset();
var w = $(window);
var fromTop = offset.top - w.scrollTop();
$('html, body').animate({
    scrollTop: offset.top - fromTop
}, 1);

dieser code halten der letzten position der Startaufstellung

InformationsquelleAutor Irfan Soetedja

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.