2017-06-13 1 views
1

Unsere Firma verwendet Hunderte von jqGrids. Ich füge eins zu einer Seite hinzu, die bereits jqGrids auf dieser Seite hat. Ich kann den Stil oder das Verhalten für diese Gitter nicht ändern. Das neue Raster, das ich hinzufüge (auch ein jqGrid), muss einen eindeutigen ausgewählten Zeilenstil haben (Hintergrund weiß und Ränder rbg (153, 153, 153)).jqGrid ändert ausgewählten Zeilenstil ui-jqgrid ui-state-highlight nur für ein Raster, nicht alle anderen auf derselben Seite

Wenn ich den jqGrid-Stil auf der Seite ändern, funktioniert dies auf dem neuen Raster, aber ändert sich die anderen Raster. Dies ist nicht zulässig: /Dies überschreibt die normale Zeilenart jqGrid für das xyz-Gitter/ .ui-jqgrid .ui-state-highlight {background: white; Randfarbe: rgb (153, 153, 153); }

Ich habe versucht, den Stil zu ändern, wenn das Gitter wie dies zu erklären, aber es hat nicht funktioniert:

ResultsGrid.jqGrid({ 
     datatype: "local", 
     data: data, 
     minheight: 20, 
     width: 700, 
     height: '100%', 
     //altRows: true, 
     //altClass: 'myAltRowClass', 
     colNames: ['aaa', 'bbb', 'ccc', 'ddd', 'ccc', 'ddd', 'eee'], 
     colModel: [ 
      { name: 'aaa', hidden: true, key: true }, 
      { name: 'bbb', formatter: thingy.format_bbb }, 
      { name: 'ccc', hidden: true }, 
      { name: 'ddd', formatter: thingy.format_ddd, width: 80, align: 'center' }, 
      { name: 'eee', formatter: thingy.format_eee }, 
      { name: 'fff', hidden: true }, 
      { name: 'ggg', sortable: false, formatter: thingy.format_ggg, width: 25, align: 'center' } 
     ], 
     viewrecords: true, 
     emptyrecords: 'No Data', 
     onSelectRow: function() { 
      //ResultsGrid.removeClass('ui-jqgrid ui-state-highlight'); 
      //ResultsGrid.addClass('ui-jqgrid complaint_selectedrow'); 
      //.ui-jqgrid .ui-state-highlight { background: white; border-color: rgb(153, 153, 153); } 

      //$("#table").removeClass('ui-jqgrid ui-state-highlight').addClass('ui-jqgrid complaint_selectedrow'); 

      //$("#table").removeClass(' ui-state-highlight').addClass('complaint_selectedrow'); 

      //$("head").append('<style type="text/css"></style>'); 
      //var new_stylesheet = $("head").children(':last'); 
      //new_stylesheet.html('.ui-jqgrid ui-state-highlight{background: white; border-color: rgb(153, 153, 153);}'); 

     alert('This alert does pop-up when a row is selected.'); 
     } 

Bitte helfen Sie, wenn Sie irgendwelche Ideen haben. Danke im Voraus.

Antwort

0

oh mein Gott Ich reparierte es, den richtigen Weg durch Javascript in onSelectRow Funktion, wie folgt aus:

onSelectRow: function() { 
     var sheet = document.createElement('style'); 
     sheet.innerHTML = ".ui-jqgrid .ui-state-highlight { background: white; border-color: rgb(153, 153, 153); }"; 
     document.body.appendChild(sheet); 
    } 

, die den Trick tat!

Verwandte Themen