JavaScript UI Libraries & Blazor Components Suite – Smart UI › Forums › Table › migrating to smart table
- This topic has 8 replies, 3 voices, and was last updated 1 year, 11 months ago by
tbettinazzi@axioma.it.
-
AuthorPosts
-
September 30, 2022 at 5:12 pm #103794
tbettinazzi@axioma.it
ParticipantI’ve 2 html table to migrate to smart-table.
The wirts one worked immediately simply changing table tag to smart-table.
The second one shows the table as a continous string of bytes without any cell and row division
Here my code (quite complex)
<smart-table xmlns:rb=”http://www.w3.org/1999/XSL/Transform/java/axioma.rubik.engine.RubikBundle” width=”100%”>
<tr>
<th class=”riattualizza_record_header” align=”center”><font class=”carattere_riattualizza_record_header”>Azioni</font></th><th class=”riattualizza_record_header” align=”center”><font class=”carattere_riattualizza_record_header”>Lista report</font></th><th class=”riattualizza_record_header” tab_id=”” tab_group=”” align=”center”><font class=”carattere_riattualizza_record_header”>Stato</font></th><th class=”riattualizza_record_header” tab_id=”” tab_group=”” align=”center”><font class=”carattere_riattualizza_record_header”>Id</font></th><th class=”riattualizza_record_header” tab_id=”” tab_group=”” align=”center”><font class=”carattere_riattualizza_record_header”>Stato testata</font></th><th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”><font class=”carattere_riattualizza_record_header”>Riferimento Ordine Cliente</font></th><th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”><font class=”carattere_riattualizza_record_header”>Conferma ordine filiale</font></th><th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”><font class=”carattere_riattualizza_record_header”>Utente</font></th><th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”><font class=”carattere_riattualizza_record_header”>Numero Pratica</font></th><th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”><font class=”carattere_riattualizza_record_header”>Data documento</font></th><th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”><font class=”carattere_riattualizza_record_header”>Codice Cliente</font></th><th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”><font class=”carattere_riattualizza_record_header”>Ragione Sociale</font></th><th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”><font class=”carattere_riattualizza_record_header”>Valuta</font></th><th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”><font class=”carattere_riattualizza_record_header”>Importo</font></th><th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”><font class=”carattere_riattualizza_record_header”>Ordine ERP</font></th><th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”><font class=”carattere_riattualizza_record_header”>Data modifica</font></th><th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”><font class=”carattere_riattualizza_record_header”>Utente modifica</font></th>
</tr>
<tr>
<td width=”1%” class=”carattere_riattualizza_record” nowrap><span border=”0″ id=”Annullamento3741175″ aria-hidden=”true” class=”fa fa-check green cfg-state-font-icon”></span>
<smart-tooltip position=”bottom” selector=”Annullamento3741175″ id=”tooltipAnnullamento3741175″>Valido</smart-tooltip>
<span id=”StatoInterfaccia741175″ aria-hidden=”true” class=”fa fa-pause grey cfg-state-font-icon”></span>
<smart-tooltip position=”bottom” selector=”StatoInterfaccia741175″ id=”tooltipStatoInterfaccia741175″>Stato interfaccia AVA: standby</smart-tooltip>
<button xmlns:rb=”axioma.rubik.engine.RubikBundle” id=”ab_modTestata(580405,741175);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” onclick=”ab_modTestata(580405,741175);”>
<smart-tooltip position=”bottom” selector=”ab_modTestata(580405,741175);” id=”tooltipab_modTestata(580405,741175);”>Modifica</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-pencil blue cfg-button-font-icon”></span></button><button id=”ab_dupTestata(580405,741175,’Conferma’,’Si vuole veramente duplicare l\’intero ordine?’);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” onclick=”ab_dupTestata(580405,741175,’Conferma’,’Si vuole veramente duplicare l\’intero ordine?’);”>
<smart-tooltip position=”bottom” selector=”ab_dupTestata(580405,741175,’Conferma’,’Si vuole veramente duplicare l\’intero ordine?’);” id=”tooltipab_dupTestata(580405,741175,’Conferma’,’Si vuole veramente duplicare l\’intero ordine?’);”>Duplica</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-files-o blue cfg-button-font-icon”></span></button><button id=”ab_delTestata(580405,741175,’Conferma’,’Si vuole veramente procedere con l\’eliminazione?’);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” disabled=”true”>
<smart-tooltip position=”bottom” selector=”ab_delTestata(580405,741175,’Conferma’,’Si vuole veramente procedere con l\’eliminazione?’);” id=”tooltipab_delTestata(580405,741175,’Conferma’,’Si vuole veramente procedere con l\’eliminazione?’);”>Elimina</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-close red cfg-button-font-icon”></span></button><button id=”ab_ripTestata(580405,741175);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” disabled=”true”>
<smart-tooltip position=”bottom” selector=”ab_ripTestata(580405,741175);” id=”tooltipab_ripTestata(580405,741175);”>Ripristina</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-reply blue cfg-button-font-icon”></span></button><button id=”ab_docTestata(580405,”);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” disabled=”true”>
<smart-tooltip position=”bottom” selector=”ab_docTestata(580405,”);” id=”tooltipab_docTestata(580405,”);”>Documenti</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-file-o blue cfg-button-font-icon”></span></button><button id=”finestra("ShowLogWeb?PREV_ID=580405&TYPE=M","rb:getString($RB,’configuration.messageLog’)", 800, 600);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” disabled=”true”>
<smart-tooltip position=”bottom” selector=”finestra("ShowLogWeb?PREV_ID=580405&TYPE=M","rb:getString($RB,’configuration.messageLog’)", 800, 600);” id=”tooltipfinestra("ShowLogWeb?PREV_ID=580405&TYPE=M","rb:getString($RB,’configuration.messageLog’)", 800, 600);”>Log messaggi</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-wrench blue cfg-button-font-icon”></span></button><button id=”finestra("ShowLogWeb?PREV_ID=580405&TYPE=E","rb:getString($RB,’configuration.messageLog’)", 800, 600);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” disabled=”true”>
<smart-tooltip position=”bottom” selector=”finestra("ShowLogWeb?PREV_ID=580405&TYPE=E","rb:getString($RB,’configuration.messageLog’)", 800, 600);” id=”tooltipfinestra("ShowLogWeb?PREV_ID=580405&TYPE=E","rb:getString($RB,’configuration.messageLog’)", 800, 600);”>Log errori</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-bug blue cfg-button-font-icon”></span></button><button id=”finestra("ShowCustomWeb?TESTID=741175","rb:getString($RB,’configuration.messageLog’)", 1024, 768);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” onclick=”finestra("ShowCustomWeb?TESTID=741175","rb:getString($RB,’configuration.messageLog’)", 1024, 768);”>
<smart-tooltip position=”bottom” selector=”finestra("ShowCustomWeb?TESTID=741175","rb:getString($RB,’configuration.messageLog’)", 1024, 768);” id=”tooltipfinestra("ShowCustomWeb?TESTID=741175","rb:getString($RB,’configuration.messageLog’)", 1024, 768);”>Valori personalizzati</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-expand blue cfg-button-font-icon”></span></button><button id=”ab_downloadCarrelliCsv(741175);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” onclick=”ab_downloadCarrelliCsv(741175);”>
<smart-tooltip position=”bottom” selector=”ab_downloadCarrelliCsv(741175);” id=”tooltipab_downloadCarrelliCsv(741175);”>Scarica carrello in formato csv</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-cart-arrow-down blue cfg-button-font-icon”></span></button></td><td xmlns:rb=”http://www.w3.org/1999/XSL/Transform/java/axioma.rubik.engine.RubikBundle” width=”1px” class=”carattere_riattualizza_record” nowrap><button xmlns:rb=”axioma.rubik.engine.RubikBundle” id=”ab_pdfTestata(580405,2786895,287293);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” onclick=”ab_pdfTestata(580405,2786895,287293);”>
<smart-tooltip position=”bottom” selector=”ab_pdfTestata(580405,2786895,287293);” id=”tooltipab_pdfTestata(580405,2786895,287293);”>Pdf</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-file-pdf-o blue cfg-button-font-icon”></span></button></td><td xmlns:rb=”http://www.w3.org/1999/XSL/Transform/java/axioma.rubik.engine.RubikBundle” style=”text-align:left” class=”carattere_riattualizza_record” align=”center” nowrap><span id=”StatoConfigurazione741175″ aria-hidden=”true” class=”fa fa-check green cfg-state-font-icon”></span>
<smart-tooltip position=”bottom” selector=”StatoConfigurazione741175″ id=”tooltipStatoConfigurazione741175″>PROCESSATA</smart-tooltip>
</td><td class=”carattere_riattualizza_record” align=”center” nowrap>741175</td><td class=”carattere_riattualizza_record” align=”center” nowrap>
</td><td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>156887 PFEIFFER</td><td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>**</td><td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>TAREK.LEISER</td><td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>ZTR/2400017393 (C)-ZWI/4000090435 (C)</td><td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>09/06/2022</td><td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>002464</td><td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>WAM GMBH **</td><td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>EUR</td><td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>72965.200</td><td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap> </td><td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>20/09/2022</td><td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>TAREK.LEISER</td>
</tr>
<tr>
<td colspan=”100%”></td>
</tr>
</smart-table>Changing smart table to table it works again.
How can I solve ?
Tks
October 1, 2022 at 9:21 am #103800tbettinazzi@axioma.it
ParticipantHere a simple testcase which reproduces the problem.
<!DOCTYPE html>
<html>
<head>
<title>Table Basic Demo</title>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0, maximum-scale=1.0″ />
<link rel=”stylesheet” type=”text/css” href=”../../../source/styles/smart.default.css” />
<link rel=”stylesheet” type=”text/css” href=”styles.css” />
</head>
<body class=”viewport”>
<div class=”demo-description”> Our Table web component can be used to wrap or replace standard Tables and add different styles, hover effects, sorting by one or multiple columns, add, remove and update rows. </div>
<smart-table id=”table” width=”100%”>
<tr>
<th class=”riattualizza_record_header” align=”center”>
<font class=”carattere_riattualizza_record_header”>Azioni</font>
</th>
<th class=”riattualizza_record_header” align=”center”>
<font class=”carattere_riattualizza_record_header”>Lista report</font>
</th>
<th class=”riattualizza_record_header” tab_id=”” tab_group=”” align=”center”>
<font class=”carattere_riattualizza_record_header”>Stato</font>
</th>
<th class=”riattualizza_record_header” tab_id=”” tab_group=”” align=”center”>
<font class=”carattere_riattualizza_record_header”>Id</font>
</th>
<th class=”riattualizza_record_header” tab_id=”” tab_group=”” align=”center”>
<font class=”carattere_riattualizza_record_header”>Stato testata</font>
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”>
<font class=”carattere_riattualizza_record_header”>Riferimento Ordine Cliente</font>
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”>
<font class=”carattere_riattualizza_record_header”>Conferma ordine filiale</font>
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”>
<font class=”carattere_riattualizza_record_header”>Utente</font>
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”>
<font class=”carattere_riattualizza_record_header”>Numero Pratica</font>
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”>
<font class=”carattere_riattualizza_record_header”>Data documento</font>
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”>
<font class=”carattere_riattualizza_record_header”>Codice Cliente</font>
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”>
<font class=”carattere_riattualizza_record_header”>Ragione Sociale</font>
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”>
<font class=”carattere_riattualizza_record_header”>Valuta</font>
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”>
<font class=”carattere_riattualizza_record_header”>Importo</font>
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”>
<font class=”carattere_riattualizza_record_header”>Ordine ERP</font>
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”>
<font class=”carattere_riattualizza_record_header”>Data modifica</font>
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” align=”center”>
<font class=”carattere_riattualizza_record_header”>Utente modifica</font>
</th>
</tr>
<tr>
<td width=”1%” class=”carattere_riattualizza_record” nowrap>
<span border=”0″ id=”Annullamento383660″ aria-hidden=”true” class=”fa fa-check green cfg-state-font-icon”></span>
<smart-tooltip position=”bottom” selector=”Annullamento383660″ id=”tooltipAnnullamento383660″>Valido</smart-tooltip>
<span id=”StatoInterfaccia83660″ aria-hidden=”true” class=”fa fa-check green cfg-state-font-icon”></span>
<smart-tooltip position=”bottom” selector=”StatoInterfaccia83660″ id=”tooltipStatoInterfaccia83660″>Stato interfaccia AVA: processata</smart-tooltip>
<button xmlns:rb=”axioma.rubik.engine.RubikBundle” id=”ab_modTestata(65474,83660);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” disabled=”true”>
<smart-tooltip position=”bottom” selector=”ab_modTestata(65474,83660);” id=”tooltipab_modTestata(65474,83660);”>Modifica</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-pencil blue cfg-button-font-icon”></span>
</button>
<button id=”ab_dupTestata(65474,83660,’Conferma’,’Si vuole veramente duplicare l\’intero ordine?’);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” onclick=”ab_dupTestata(65474,83660,’Conferma’,’Si vuole veramente duplicare l\’intero ordine?’);”>
<smart-tooltip position=”bottom” selector=”ab_dupTestata(65474,83660,’Conferma’,’Si vuole veramente duplicare l\’intero ordine?’);” id=”tooltipab_dupTestata(65474,83660,’Conferma’,’Si vuole veramente duplicare l\’intero ordine?’);”>Duplica</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-files-o blue cfg-button-font-icon”></span>
</button>
<button id=”ab_delTestata(65474,83660,’Conferma’,’Si vuole veramente procedere con l\’eliminazione?’);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” disabled=”true”>
<smart-tooltip position=”bottom” selector=”ab_delTestata(65474,83660,’Conferma’,’Si vuole veramente procedere con l\’eliminazione?’);” id=”tooltipab_delTestata(65474,83660,’Conferma’,’Si vuole veramente procedere con l\’eliminazione?’);”>Elimina</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-close red cfg-button-font-icon”></span>
</button>
<button id=”ab_ripTestata(65474,83660);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” disabled=”true”>
<smart-tooltip position=”bottom” selector=”ab_ripTestata(65474,83660);” id=”tooltipab_ripTestata(65474,83660);”>Ripristina</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-reply blue cfg-button-font-icon”></span>
</button>
<button id=”ab_docTestata(65474,”);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” disabled=”true”>
<smart-tooltip position=”bottom” selector=”ab_docTestata(65474,”);” id=”tooltipab_docTestata(65474,”);”>Documenti</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-file-o blue cfg-button-font-icon”></span>
</button>
<button id=”finestra("ShowLogWeb?PREV_ID=65474&TYPE=M","rb:getString($RB,’configuration.messageLog’)", 800, 600);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” disabled=”true”>
<smart-tooltip position=”bottom” selector=”finestra("ShowLogWeb?PREV_ID=65474&TYPE=M","rb:getString($RB,’configuration.messageLog’)", 800, 600);” id=”tooltipfinestra("ShowLogWeb?PREV_ID=65474&TYPE=M","rb:getString($RB,’configuration.messageLog’)", 800, 600);”>Log messaggi</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-wrench blue cfg-button-font-icon”></span>
</button>
<button id=”finestra("ShowLogWeb?PREV_ID=65474&TYPE=E","rb:getString($RB,’configuration.messageLog’)", 800, 600);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” disabled=”true”>
<smart-tooltip position=”bottom” selector=”finestra("ShowLogWeb?PREV_ID=65474&TYPE=E","rb:getString($RB,’configuration.messageLog’)", 800, 600);” id=”tooltipfinestra("ShowLogWeb?PREV_ID=65474&TYPE=E","rb:getString($RB,’configuration.messageLog’)", 800, 600);”>Log errori</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-bug blue cfg-button-font-icon”></span>
</button>
<button id=”finestra("ShowCustomWeb?TESTID=83660","rb:getString($RB,’configuration.messageLog’)", 1024, 768);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” onclick=”finestra("ShowCustomWeb?TESTID=83660","rb:getString($RB,’configuration.messageLog’)", 1024, 768);”>
<smart-tooltip position=”bottom” selector=”finestra("ShowCustomWeb?TESTID=83660","rb:getString($RB,’configuration.messageLog’)", 1024, 768);” id=”tooltipfinestra("ShowCustomWeb?TESTID=83660","rb:getString($RB,’configuration.messageLog’)", 1024, 768);”>Valori personalizzati</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-expand blue cfg-button-font-icon”></span>
</button>
<button id=”ab_downloadCarrelliCsv(83660);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” onclick=”ab_downloadCarrelliCsv(83660);”>
<smart-tooltip position=”bottom” selector=”ab_downloadCarrelliCsv(83660);” id=”tooltipab_downloadCarrelliCsv(83660);”>Scarica carrello in formato csv</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-cart-arrow-down blue cfg-button-font-icon”></span>
</button>
</td>
<td xmlns:rb=”http://www.w3.org/1999/XSL/Transform/java/axioma.rubik.engine.RubikBundle” width=”1px” class=”carattere_riattualizza_record” nowrap>
<button xmlns:rb=”axioma.rubik.engine.RubikBundle” id=”ab_pdfTestata(65474,643341,287293);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” onclick=”ab_pdfTestata(65474,643341,287293);”>
<smart-tooltip position=”bottom” selector=”ab_pdfTestata(65474,643341,287293);” id=”tooltipab_pdfTestata(65474,643341,287293);”>Pdf</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-file-pdf-o blue cfg-button-font-icon”></span>
</button>
</td>
<td xmlns:rb=”http://www.w3.org/1999/XSL/Transform/java/axioma.rubik.engine.RubikBundle” style=”text-align:left” class=”carattere_riattualizza_record” align=”center” nowrap>
<span id=”StatoConfigurazione83660″ aria-hidden=”true” class=”fa fa-check green cfg-state-font-icon”></span>
<smart-tooltip position=”bottom” selector=”StatoConfigurazione83660″ id=”tooltipStatoConfigurazione83660″>PROCESSATA</smart-tooltip>
</td>
<td class=”carattere_riattualizza_record” align=”center” nowrap>
83660
</td>
<td class=”carattere_riattualizza_record” align=”center” nowrap> </td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap> 2202501 PMENG</td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap></td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>JONATHAN.FLIPPANCE</td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>ZWI/4000009545</td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>15/06/2020</td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>007964</td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>WAM ENGINEERING LTD </td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>EUR</td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>413.600</td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>20006575</td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>15/06/2020</td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” align=”center” nowrap>MICHAL.SYGNECKI</td>
</tr>
</smart-table>
<!– scripts –>
<script src=”../../../source/smart.elements.js”></script>
<script src=”index.js”></script>
</body>
</html>October 1, 2022 at 10:41 am #103801tbettinazzi@axioma.it
ParticipantLooking at the console I saw an error : Uncaught SyntaxError: invalid range in character class smart.elements.js:45:17131
I tetsed it also with 14.2 version but nothing changed.
-
This reply was modified 1 year, 11 months ago by
tbettinazzi@axioma.it.
October 3, 2022 at 7:14 am #103805george_kostov0
ParticipantHi,
Firstly, the align attribute is not supported in HTML5. The font tag is also not supported in HTML5.
The next thing is that in the <smart-table> tag you should have <table> tag and the appropriate rows should be wrapped in a <thead> and <tbody>.
See this demo: https://codepen.io/dkeamcaksoem/pen/NWMMVGG
If you need further assistance, do not hesitate to contact us!
Best Regards,
Svetoslav BorislavovSmart UI Team
https://www.htmlelements.com/October 3, 2022 at 10:17 am #103806tbettinazzi@axioma.it
ParticipantI followed Your instruction but nothing changed.
Still present also the console javascript error.
Here the code
<!DOCTYPE html>
<html>
<head>
<title>Table Basic Demo</title>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0, maximum-scale=1.0″ />
<link rel=”stylesheet” type=”text/css” href=”../../../source/styles/smart.default.css” />
<link rel=”stylesheet” type=”text/css” href=”styles.css” />
</head>
<body class=”viewport”>
<div class=”demo-description”> Our Table web component can be used to wrap or replace standard Tables and add different styles, hover effects, sorting by one or multiple columns, add, remove and update rows. </div>
<smart-table id=”table” width=”100%”>
<table>
<thead>
<tr>
<th class=”riattualizza_record_header” >
</th>
<th class=”riattualizza_record_header” >
</th>
<th class=”riattualizza_record_header” tab_id=”” tab_group=”” >
</th>
<th class=”riattualizza_record_header” tab_id=”” tab_group=”” >
</th>
<th class=”riattualizza_record_header” tab_id=”” tab_group=”” >
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” >
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” >
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” >
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” >
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” >
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” >
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” >
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” >
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” >
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” >
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” >
</th>
<th class=”riattualizza_record_header” tab_id=”a_tabs_;” tab_group=”cu” >
</th>
</tr>
</thead>
<tbody>
<tr>
<td width=”1%” class=”carattere_riattualizza_record” nowrap>
<span border=”0″ id=”Annullamento383660″ aria-hidden=”true” class=”fa fa-check green cfg-state-font-icon”></span>
<smart-tooltip position=”bottom” selector=”Annullamento383660″ id=”tooltipAnnullamento383660″>Valido</smart-tooltip>
<span id=”StatoInterfaccia83660″ aria-hidden=”true” class=”fa fa-check green cfg-state-font-icon”></span>
<smart-tooltip position=”bottom” selector=”StatoInterfaccia83660″ id=”tooltipStatoInterfaccia83660″>Stato interfaccia AVA: processata</smart-tooltip>
<button xmlns:rb=”axioma.rubik.engine.RubikBundle” id=”ab_modTestata(65474,83660);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” disabled=”true”>
<smart-tooltip position=”bottom” selector=”ab_modTestata(65474,83660);” id=”tooltipab_modTestata(65474,83660);”>Modifica</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-pencil blue cfg-button-font-icon”></span>
</button>
<button id=”ab_dupTestata(65474,83660,’Conferma’,’Si vuole veramente duplicare l\’intero ordine?’);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” onclick=”ab_dupTestata(65474,83660,’Conferma’,’Si vuole veramente duplicare l\’intero ordine?’);”>
<smart-tooltip position=”bottom” selector=”ab_dupTestata(65474,83660,’Conferma’,’Si vuole veramente duplicare l\’intero ordine?’);” id=”tooltipab_dupTestata(65474,83660,’Conferma’,’Si vuole veramente duplicare l\’intero ordine?’);”>Duplica</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-files-o blue cfg-button-font-icon”></span>
</button>
<button id=”ab_delTestata(65474,83660,’Conferma’,’Si vuole veramente procedere con l\’eliminazione?’);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” disabled=”true”>
<smart-tooltip position=”bottom” selector=”ab_delTestata(65474,83660,’Conferma’,’Si vuole veramente procedere con l\’eliminazione?’);” id=”tooltipab_delTestata(65474,83660,’Conferma’,’Si vuole veramente procedere con l\’eliminazione?’);”>Elimina</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-close red cfg-button-font-icon”></span>
</button>
<button id=”ab_ripTestata(65474,83660);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” disabled=”true”>
<smart-tooltip position=”bottom” selector=”ab_ripTestata(65474,83660);” id=”tooltipab_ripTestata(65474,83660);”>Ripristina</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-reply blue cfg-button-font-icon”></span>
</button>
<button id=”ab_docTestata(65474,”);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” disabled=”true”>
<smart-tooltip position=”bottom” selector=”ab_docTestata(65474,”);” id=”tooltipab_docTestata(65474,”);”>Documenti</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-file-o blue cfg-button-font-icon”></span>
</button>
<button id=”finestra("ShowLogWeb?PREV_ID=65474&TYPE=M","rb:getString($RB,’configuration.messageLog’)", 800, 600);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” disabled=”true”>
<smart-tooltip position=”bottom” selector=”finestra("ShowLogWeb?PREV_ID=65474&TYPE=M","rb:getString($RB,’configuration.messageLog’)", 800, 600);” id=”tooltipfinestra("ShowLogWeb?PREV_ID=65474&TYPE=M","rb:getString($RB,’configuration.messageLog’)", 800, 600);”>Log messaggi</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-wrench blue cfg-button-font-icon”></span>
</button>
<button id=”finestra("ShowLogWeb?PREV_ID=65474&TYPE=E","rb:getString($RB,’configuration.messageLog’)", 800, 600);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” disabled=”true”>
<smart-tooltip position=”bottom” selector=”finestra("ShowLogWeb?PREV_ID=65474&TYPE=E","rb:getString($RB,’configuration.messageLog’)", 800, 600);” id=”tooltipfinestra("ShowLogWeb?PREV_ID=65474&TYPE=E","rb:getString($RB,’configuration.messageLog’)", 800, 600);”>Log errori</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-bug blue cfg-button-font-icon”></span>
</button>
<button id=”finestra("ShowCustomWeb?TESTID=83660","rb:getString($RB,’configuration.messageLog’)", 1024, 768);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” onclick=”finestra("ShowCustomWeb?TESTID=83660","rb:getString($RB,’configuration.messageLog’)", 1024, 768);”>
<smart-tooltip position=”bottom” selector=”finestra("ShowCustomWeb?TESTID=83660","rb:getString($RB,’configuration.messageLog’)", 1024, 768);” id=”tooltipfinestra("ShowCustomWeb?TESTID=83660","rb:getString($RB,’configuration.messageLog’)", 1024, 768);”>Valori personalizzati</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-expand blue cfg-button-font-icon”></span>
</button>
<button id=”ab_downloadCarrelliCsv(83660);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” onclick=”ab_downloadCarrelliCsv(83660);”>
<smart-tooltip position=”bottom” selector=”ab_downloadCarrelliCsv(83660);” id=”tooltipab_downloadCarrelliCsv(83660);”>Scarica carrello in formato csv</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-cart-arrow-down blue cfg-button-font-icon”></span>
</button>
</td>
<td xmlns:rb=”http://www.w3.org/1999/XSL/Transform/java/axioma.rubik.engine.RubikBundle” width=”1px” class=”carattere_riattualizza_record” nowrap>
<button xmlns:rb=”axioma.rubik.engine.RubikBundle” id=”ab_pdfTestata(65474,643341,287293);” class=”
cfg-button cfg-button-inline
” type=”button” role=”button” onclick=”ab_pdfTestata(65474,643341,287293);”>
<smart-tooltip position=”bottom” selector=”ab_pdfTestata(65474,643341,287293);” id=”tooltipab_pdfTestata(65474,643341,287293);”>Pdf</smart-tooltip>
<span aria-hidden=”true” class=”fa fa-file-pdf-o blue cfg-button-font-icon”></span>
</button>
</td>
<td xmlns:rb=”http://www.w3.org/1999/XSL/Transform/java/axioma.rubik.engine.RubikBundle” style=”text-align:left” class=”carattere_riattualizza_record” nowrap>
<span id=”StatoConfigurazione83660″ aria-hidden=”true” class=”fa fa-check green cfg-state-font-icon”></span>
<smart-tooltip position=”bottom” selector=”StatoConfigurazione83660″ id=”tooltipStatoConfigurazione83660″>PROCESSATA</smart-tooltip>
</td>
<td class=”carattere_riattualizza_record” nowrap>
83660
</td>
<td class=”carattere_riattualizza_record” nowrap> </td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” nowrap> 2202501 PMENG</td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” nowrap></td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” nowrap>JONATHAN.FLIPPANCE</td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” nowrap>ZWI/4000009545</td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” nowrap>15/06/2020</td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” nowrap>007964</td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” nowrap>WAM ENGINEERING LTD </td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” nowrap>EUR</td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” nowrap>413.600</td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” nowrap>20006575</td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” nowrap>15/06/2020</td>
<td class=”carattere_riattualizza_record” style=”text-align:left” tab_id=”a_tabs_;” tab_group=”cu” nowrap>MICHAL.SYGNECKI</td>
</tr>
</tbody>
</table>
</smart-table>
<!– scripts –>
<script src=”../../../source/smart.elements.js”></script>
<script src=”index.js”></script>
</body>
</html>October 4, 2022 at 10:48 am #103808svetoslav_borislavov
ParticipantHi,
Please give us a quick demo in codepen so we can work it on and find the error.
Here is a demo with a working table (The table is the same that you gave us): https://codepen.io/dkeamcaksoem/pen/zYjaJOYBest Regards,
Svetoslav BorislavovSmart UI Team
https://www.htmlelements.com/October 4, 2022 at 11:18 am #103809tbettinazzi@axioma.it
ParticipantSorry but I don’t understand the difference between my test and Your code : they seems to be identical.
The only difference I see is that You used a typescript version and I use the js version.
Tks
Tullio
October 5, 2022 at 10:48 am #103812svetoslav_borislavov
ParticipantHi,
It is a reference if you are using typescript, you can ignore it as you are using JavaScript
Yes, I cannot find a difference so please, send me a quick demo here: svetoslav@jqwidgets.com
Best Regards,
Svetoslav BorislavovSmart UI Team
https://www.htmlelements.com/October 7, 2022 at 2:05 pm #103814tbettinazzi@axioma.it
ParticipantAny new about the test case ?
Tks
-
This reply was modified 1 year, 11 months ago by
-
AuthorPosts
- You must be logged in to reply to this topic.