ESO9 wiki

Tato stránka je pouze pro čtení. Můžete si pouze prohlédnout zdrojový kód, ale ne ho měnit. Zeptejte se správce, pokud si myslíte, že něco není v pořádku.
===== Modifikace vzhledu browse =====


Za pomoci hidden parametru CellRenderer je možné při renderování browse modifikovat vzhled jednotlivých buněk. Při renderování každé buňky se volá funkce zadaná v hodnotě parametru. Předpokládá se že funkce je zapsaná přímo ve stránce v tagu "script".

=== Zápis hidden parametru pro funkci myCellRenderer ===
<code html>
<input type="hidden" name="CellRenderer" value="myCellRenderer">
</code>

Na vstupu má funkce následující atributy a předpokládá se návrat modifikovaného atributu defaulthtml nebo null, pokud nic nemodifikujeme.

Argumenty každé takto volané funkce jsou:
  * row - číslo řádku
  * columnfield -pole (jqx)
  * value - hodnota pole
  * defaulthtml - DOM objekt buňky browse
  * columnproperties - vlastnosti sloupce (jqx)
  * field - název pole
  * rowData - rowData - dvourozměrné pole s hodnotami všech položek v datovém řádku, nad nímž se funkce volá. Prvním rozměrem je jméno položky, druhým pak její hodnota.

Následná funkce může vypadat třeba takto:

Provádí Removing trailing zeros / potlačení koncových nul u sloupce HDPRODCENA

<code javascript>
<script>
var formatNumber = function (num) {
  return new Intl.NumberFormat("cs-CZ", {
    minimumFractionDigits: 0,
    maximumFractionDigits: 20 // dostatečně velké, aby zachytilo všechny
  }).format(num);
}
var myCellRenderer = function (row, columnfield, value, defaulthtml, columnproperties, field, rowData) {
 if (field.name == 'HDPRODCENA'){
   if (value != null || value != "") //jen když je neprazdne. Jinak by se doplňovala 0.
     defaulthtml.innerText = formatNumber(value)
 }
 return defaulthtml;
};
</script>
</code>

Dalším příkladem může být doplnění třídy a na základě této třídy úprava vizualizace.

<code javascript>
<!-- styl pro třídu nonNull-->
<style>
.nonNull {
 /*jakákoli CSS vlastnost*/
}
</style>
<!-- doplnění třídy nonNull-->
<script>
var myCellRenderer = function (row, columnfield, value, defaulthtml, columnproperties, field, rowData) {
 if (field.name == 'HDPRODCENA'){
   if (value != null || value != "")
     defaulthtml.classList.add("nonNull");
 }
 return defaulthtml;
};
</script>
</code>


S defaulthtml je možné manipulovat jak je potřeba, jen je nutné brát zřetel na to, že výrazná modifikace může spůsobit nefunkčnost Browse.