SHIFT-klik jqgrid multiselecteer de laatste rij ontbreekt

Ik heb de code overgenomen van deze post en heb this fiddle . Klik eerst op de eerste rij en vervolgens op de laatste rij. Als je merkt dat deze code het heel goed doet, wordt behalve de laatste rij de rij waarop je klikt niet geselecteerd. Ik heb mijn hoofd op deze krabben. Kan iemand me helpen de code te veranderen zodat de multiselect ook de laatste rij selecteert?

Bedankt!

4

5 antwoord

probeer dit te vervangen: if ((shouldSelectRow = id == startID || shouldSelectRow)) { hiermee:

if ((shouldSelectRow = id == startID || shouldSelectRow) && (id != rowid)){
6
toegevoegd
+1 voor id! = Rowid
toegevoegd de auteur Oleg, de bron

Ik ben het met Michael Gendin eens dat je de rij met het ID niet gelijk aan rowid moet selecteren. Het is uw belangrijkste fout. Niettemin zou ik de meeste code van de demo herschrijven om rowIndex van DOM-elementen van de rijen te gebruiken in plaats van een opsomming van alle rijen van het raster. Bovendien is de selectie van de tekst in IE ongemakkelijk in uw huidige code, dus ik zou voorstellen deze te verwijderen. De aangepaste demo die u hier vindt Ik gebruikte de volgende code van beforeSelectRow callback :

beforeSelectRow: function (rowid, e) {
    var $this = $(this), rows = this.rows,
       //get id of the previous selected row
        startId = $this.jqGrid('getGridParam', 'selrow'),
        startRow, endRow, iStart, iEnd, i, rowidIndex;

    if (!e.ctrlKey && !e.shiftKey) {
        $this.jqGrid('resetSelection');
    } else if (startId && e.shiftKey) {
        $this.jqGrid('resetSelection');

       //get DOM elements of the previous selected and the currect selected rows
        startRow = rows.namedItem(startId);
        endRow = rows.namedItem(rowid);
        if (startRow && endRow) {
           //get min and max from the indexes of the previous selected
           //and the currect selected rows 
            iStart = Math.min(startRow.rowIndex, endRow.rowIndex);
            rowidIndex = endRow.rowIndex;
            iEnd = Math.max(startRow.rowIndex, rowidIndex);
            for (i = iStart; i <= iEnd; i++) {
               //the row with rowid will be selected by jqGrid, so:
                if (i != rowidIndex) {
                    $this.jqGrid('setSelection', rows[i].id, false);
                }
            }
        }

       //clear text selection
        if(document.selection && document.selection.empty) {
            document.selection.empty();
        } else if(window.getSelection) {
            window.getSelection().removeAllRanges();
        }
    }
    return true;
}
5
toegevoegd
@Kelly: het zou goed zijn als je gewoon je code toevoegt in je antwoord. Ik kan me voorstellen dat het probleem interessant kan zijn voor andere mensen. Oproep van $ this.jqGrid ('resetSelection') lijkt me nodig om hetzelfde gedrag te simuleren dat de gebruikers kennen. Als u bijvoorbeeld een aantal items in Windows wilt selecteren en vervolgens nogmaals op de Shift-toets of zonder Shift klikt en zonder Ctrl ziet u dat de selectie opnieuw wordt ingesteld. Het delen van de code is op elke manier goed en ik kan me een andere implementatie van selectie voorstellen.
toegevoegd de auteur Oleg, de bron
Oleg's oplossing werkt geweldig op mijn Safari en IE8 setup. In het geval dat andere mensen hier naar kijken om dezelfde reden als ik, zijn hier de aanpassingen die nodig zijn als u selecties wilt toevoegen (schakel een blok in, dan wordt de selectie niet gewist): 1) Verwijder beide oproepen naar $ this.jqGrid ('resetSelection') om de bestaande selecties niet te wissen. 2) Noem $ this.jqGrid ('getGridParam', 'selarrrow'); om de array met geselecteerde indicaties te verkrijgen en in de test om selectie te wisselen, moet je ook controleren of de rijen [i] .id niet in je array bestaande selecties staan.
toegevoegd de auteur Kelly, de bron

Voeg $ ('# grid'). DisableSelection (); toe om de irritante tekstselectie te verwijderen

1
toegevoegd

Zoals besproken in Oleg's antwoord, is hier een aangepaste beforeSelectRow die geselecteerde selecties bevat.

In mijn geval selecteren onze gebruikers een aantal rijen voor export, dus extra selecties betekent meestal niet dat ze een nieuwe selectie willen starten.

 beforeSelectRow: function(rowid, e) {
      var $this = $(this), rows = this.rows,

     //get id of the previous selected row
      startId = $this.jqGrid('getGridParam', 'selrow'),
      startRow, endRow, iStart, iEnd, i, rowidIndex;

      if (!e.ctrlKey && !e.shiftKey) {
          //intentionally left here to show differences with
          //Oleg's solution. Just have normal behavior instead.
          //$this.jqGrid('resetSelection');
      } else if (startId && e.shiftKey) {
          //Do not clear existing selections
          //$this.jqGrid('resetSelection');

         //get DOM elements of the previous selected and
         //the currect selected rows
          startRow = rows.namedItem(startId);
          endRow = rows.namedItem(rowid);

          if (startRow && endRow) {
             //get min and max from the indexes of the previous selected
             //and the currect selected rows
              iStart = Math.min(startRow.rowIndex, endRow.rowIndex);
              rowidIndex = endRow.rowIndex;
              iEnd = Math.max(startRow.rowIndex, rowidIndex);

             //get the rowids of selected rows
              var selected = $this.jqGrid('getGridParam','selarrrow');

              for (i = iStart; i <= iEnd; i++) {
                 //if this row isn't selected, then toggle it.
                 //jqgrid will select the clicked on row, so just ingore it.
                 //note that we still go <= iEnd because we don't know which is start or end.
                  if(selected.indexOf(rows[i].id) < 0 && i != rowidIndex) {
                   //true is to trigger onSelectRow event, which you may not need
                    $this.jqGrid('setSelection', rows[i].id, true);
                  }
              }
          }

         //clear text selection (needed in IE)
          if(document.selection && document.selection.empty) {
              document.selection.empty();
          } else if(window.getSelection) {
              window.getSelection().removeAllRanges();
          }
      }
      return true;
  }
0
toegevoegd

De oplossing van Oleg werkt niet in alle selectiemodi (omhoog/omlaag). Dank aan hem voor de gedeeltelijke oplossing.

Ik corrigeer dit met deze code:

U hebt twee variabelen nodig om de huidige startrij Id en eindrij Id op te slaan. En een andere om de kant van de selectie op te slaan.

var _currentStartSelectRow, _currentEndSelectRow, _isSideDown = null;

Codeaanroep door de beforeSelectRow callback:

beforeSelectRow: function (rowid, e) {
                var $this = $(this), rows = this.rows,
               //get id of the previous selected row
                previousId = $this.jqGrid('getGridParam', 'selrow'),
                previousRow, currentRow;

                if (!e.ctrlKey && !e.shiftKey) {
                    _isSideDown = null;                       
                        $this.jqGrid('resetSelection');                       

                } else if (previousId && e.shiftKey) {
                    $this.jqGrid('resetSelection');


                   //get DOM elements of the previous selected and the currect selected rows
                    previousRow = rows.namedItem(previousId);
                    currentRow = rows.namedItem(rowid);
                    if (previousRow && currentRow) {
                        //Increment
                        if (previousRow.rowIndex < currentRow.rowIndex) {
                            if (_isSideDown == false || _isSideDown == null) {
                                _currentStartSelectRow = previousRow.rowIndex;
                                _currentEndSelectRow = currentRow.rowIndex;
                            }
                            else {
                                _currentEndSelectRow = currentRow.rowIndex;
                            }
                            _isSideDown = true;
                        }
                        //Decrement
                        else {
                            if (_isSideDown == null) {
                                _currentStartSelectRow = currentRow.rowIndex;
                                _currentEndSelectRow = previousRow.rowIndex;
                                _isSideDown = false;
                            }
                            else if (_isSideDown == true) {
                                if (currentRow.rowIndex < _currentStartSelectRow) {
                                    _currentStartSelectRow = currentRow.rowIndex;
                                    _isSideDown = false;
                                }
                                else {
                                    _currentEndSelectRow = currentRow.rowIndex;
                                }
                            }
                            else {
                                _currentStartSelectRow = currentRow.rowIndex;
                            }

                        }

                        for (i = _currentStartSelectRow; i <= _currentEndSelectRow; i++) {
                           //the row with rowid will be selected by jqGrid, so we don't need to select him:
                            if (i != currentRow.rowIndex) {
                                $this.jqGrid('setSelection', rows[i].id, false);
                            }
                        }
                    }

                }
                return true;
            }, 
0
toegevoegd