2016-08-01 12 views
0

Ich versuche, Farbe in die Zelle w2uigrid hinzuzufügen.Hinzufügen von benutzerdefinierten Farbe zu w2ui Zelle [Raster]

Nachdem ich der Dokumentation gefolgt bin, kann ich die Farbe der Zelle und der Reihe ändern (aber einzeln).

Für eine einzelne Zelle:

records: [ 
      { recid: 1, fname: 'Jane', lname: 'Doe', email: '[email protected]', sdate: 384052483664, style: {3:'background-color: yellow; color: white;'}}   
     ] 

Für eine einzelne Zeile:

records: [ 
       { recid: 1, fname: 'Jane', lname: 'Doe', email: '[email protected]', sdate: 384052483664, style: 'background-color: red; color: white;'}   
      ] 

Bis zu diesem Teil ist es in Ordnung, weil die Datensätze am hartzucodieren.

Frage:

Ich bin Daten vom Server geladen und ich Regeln von verschiedenen Bedingungen bin setzen, und ich will Farbe entsprechend ändern.

Was ich verstanden habe ist, dass ich nur Stil auf Server hinzufügen muss (ich verwende PHP und MySQL, BTW).

Unten ist mein Beispielcode:

$Query = "SELECT @curRow := @curRow + 1 as id ,`x`, `y`, `z`, `a`, `b`, `c`, `d`, `e`, `f`, `g`, `h`, `i` 
     FROM `table_name` JOIN (SELECT @curRow := 0) r"; 
     //echo $Query; 
     $code=mysqli_query($link,$Query); 
     $data = array(); 
     while($row = mysqli_fetch_assoc($code)) 
     { 
      if($row["id"]==1) 
      { 
       //$row['expanded']="'spinner'"; 
       //$object = (object) ['style' => "{ 5: 'color': 'red'; 'background-color': 'whilte' }"]; 
       //$row['style']=$object; 
       $row['style']= "3:'background-color: red; color: black;'"; 
      } 
      //var_dump ($row); 
      $data[] = $row; 
     } 
     $arr = array("total" => count($data), 
     "records" => $data); 

Assueme if($row["id"]==1) ist eine der Regel, also hier über versuche Stil Teil hinzuzufügen. Wenn Sie den Code sehen, habe ich mehrere Möglichkeiten versucht, um Stil hinzuzufügen. Es funktioniert einfach nicht. Aber wenn ich die Zeilen mit php drucke, bekomme ich die Zeile genau so, wie sie coden soll (siehe den oben angegebenen Code für den Einzelzellstil). Aber es spiegelt sich nicht in der Tabelle wider.

Zweit quesstion

Ich werde wie Zeile in einer Farbe gefärbt haben und obendrein, werde Ich mag anders eine einzelne Zelle färben (zwei verschiedene Regeln, ein für Reihen und eine für coloumns). Da ich die erste Anforderung nicht erfüllen konnte, habe ich nicht viel Zeit mit diesem Thema verbracht.

Dritte Frage

Wie kann ich die Höhe der Zeile dynamisch? Nehmen wir an, ich habe einen Spaltennamen response, ich habe eine feste Breite zugewiesen, wenn der Inhalt dieser Zeile die Breite überschreitet, zeigt es ... nach der verfügbaren Breite. Ich möchte es in der nächsten Zeile zeigen. Ist es möglich?

Danke.

Antwort

1

Ihre erste Frage zu beantworten:

style hat ein JSON-Objekt sein, wenn es auf der Client-Seite ankommt, so auf der Serverseite, muss es ein Array sein, die an json_encode()

weitergegeben später ist
$row['style'] => array('5' => 'background-color: red; color: black;'); 
... 
$result = json_encode($row); 

Ihre zweite Frage zu beantworten:

Die neueste Version von w2ui 1.5 unterstützt sowohl class als auch style Attribute in einem Datensatz.

also eine einzelne Zelle in der Reihe unterschiedlich eine Reihe und Farbe Farbe, könnten Sie verwenden:

records: [ 
    { recid: 1, fname: 'Jane', lname: 'Doe', class: 'my-css-class-for-the-row', style: {3: 'background-color: yellow; color: white;'} }   
]; 

style und class beides sein können entweder ein String oder ein Objekt, so könnten Sie auch tun Sie es anders herum und benutzen Sie style, um die ganze Reihe und class zu färben, um spezifische Zellen zu färben.


Ihre dritte Frage zu beantworten:

Reihen keine dynamische Höhe haben kann, weil der virtuellen Scrollen. Das bedeutet, dass alle Zeilen die gleiche Höhe haben müssen. Sie können jedoch die Höhe aller Zeilen mit

grid.recordHeight = 40; // height in pixels

wieder ändern, dies muss die aktuelle Version 1.5 von w2ui und es sieht schrulligen, wenn zusammen mit Spaltengruppen verwendet.

+0

Ich kann jede benutzerdefinierte CSS für die Zeile verwenden? Oder gibt es ein bestimmtes Format, dem ich folgen muss? – driftking9987

+0

Sie können CSS normal verwenden. In einigen Fällen müssen Sie der CSS-Eigenschaft '! Wichtig' hinzufügen, damit Sie den Browser zwingen können, die w2ui-Standardeinstellungen (oder Stile, die aus anderen Stylesheets wie jquery-ui oder bootstrap übernommen wurden) zu überschreiben. –

Verwandte Themen