Thread: [Xsltforms-support] How to highlight selected row within a repeat?
Brought to you by:
alain-couthures
Menu
▾
▴
xsltforms-support
|
From: Alessandro <ca...@tu...> - 2021-05-24 09:16:44
|
Hi all!
I'm probably not able to find the right CSS syntax for highlighting the current selected row within a repeat...
The only indications I can find are the following, but no matter where I write them (inside an external css file or directly within the xsltform) I'm not able to obtain any positive result.
.xforms-repeat-item-selected > * {
color: red; background-color: white; font-weight:bold; border-bottom:solid 5px #f2f0fb;
}
or:
.xforms-repeat-item-selected {color: blue; background-color: white;}
Thanks
Alex
--
Inviato in modo sicuro con Tutanota. Ottieni la tua casella di posta elettronica crittografata e senza pubblicità:
https://tutanota.com
|
|
From: Steven P. <ste...@cw...> - 2021-05-24 09:51:30
|
https://homepages.cwi.nl/~steven/xforms11-for-html-authors/todo.xml Part of https://homepages.cwi.nl/~steven/xforms11-for-html-authors/part2.html Steven On Mon, 24 May 2021 11:16:27 +0200, Alessandro via Xsltforms-support <xsl...@li...> wrote: > Hi all! > I'm probably not able to find the right CSS syntax for highlighting the > current selected row within a repeat... > The only indications I can find are the following, but no matter where I > write them (inside an external css file or directly >within the > xsltform) I'm not able to obtain any positive result. > > .xforms-repeat-item-selected > * { > color: red; background-color: white; font-weight:bold; > border-bottom:solid 5px #f2f0fb; > } > or: > .xforms-repeat-item-selected {color: blue; background-color: white;} > > Thanks > Alex > > --Inviato in modo sicuro con Tutanota. Ottieni la tua casella di posta > elettronica crittografata e senza pubblicità:https://tutanota.com |
|
From: Ralph C. <ra...@ra...> - 2021-05-24 09:56:35
|
Hi Alessandro,
I'm using a simple setup with the key CSS as follows that seems to work:
<head>
...
<style>.xforms-repeat-item-selected {background-color: grey;}</style>
</head>
Ralph
(and I fear my own question is heading this way shortly...)
On 24/05/2021 10:16, Alessandro via Xsltforms-support wrote:
> Hi all!
> I'm probably not able to find the right CSS syntax for highlighting the current selected row within a repeat...
> The only indications I can find are the following, but no matter where I write them (inside an external css file or directly within the xsltform) I'm not able to obtain any positive result.
>
> .xforms-repeat-item-selected > * {
> color: red; background-color: white; font-weight:bold; border-bottom:solid 5px #f2f0fb;
> }
> or:
> .xforms-repeat-item-selected {color: blue; background-color: white;}
>
> Thanks
> Alex
>
> --
> Inviato in modo sicuro con Tutanota. Ottieni la tua casella di posta elettronica crittografata e senza pubblicità:
> https://tutanota.com
> _______________________________________________
> Xsltforms-support mailing list
> Xsl...@li...
> https://lists.sourceforge.net/lists/listinfo/xsltforms-support |
|
From: Alessandro <ca...@tu...> - 2021-05-24 11:28:01
|
Steven and Ralph, thanks, but as I'm still not able to obtain the desired style effect, I give you a wider sight on my code. I'm currently using XSLTForms 1.5.2 with exist-db. After extracting my data I put them within a variable, just to have the possibility of adjusting the date format for an easier Italian reading. Then I create an instance to contain the data. The displaying table enclosed within a repeat is intended to present the user with links to be used for opening the correlated files. let $form := <html xmlns="http://www.w3.org/1999/xhtml" xmlns:xf="http://www.w3.org/2002/xforms" xmlns:ev="http://www.w3.org/2001/xml-events" xmlns:xs="http://www.w3.org/2001/XMLSchema" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"> <head> <link rel="stylesheet" type="text/css" href="resources/css/xsltforms_style.css" /> <script src="resources/data/my_javascripts.js"/> <style type="text/css"> <!--/*--><css><![CDATA[/**/ /*]]>*/<!--/*--></css><!--*/--> </style> <xf:model> <xf:instance id="files"> <data xmlns="">{$directory_files}</data> </xf:instance> <xf:instance id="URL-container" xmlns=""> <URL /> </xf:instance> <xf:instance id="del-row-data" xmlns=""> <data> <file_name/> <row_num/> </data> </xf:instance> <!-- DELETE ACTION --> <xf:submission ref="instance('del-row-data')" id="delete" method="post" action="action_confirmation_1.xq?action=deldirfiles&arch_id={$arch_id}&f_id={$cart_id}&t_id={$tab_id}&r_id={$row_id}&alert_text=Si è sicuri di voler eliminare la riga selezionata?" instance="" replace=""/> </xf:model> </head> <body> <center> <h2 style="color:red">File contenuti nella cartella: «{$directory}»</h2> <br/> <xf:group ref="instance('files')"> <fieldset id=""> <div class="header-directory-files"> <table border="0"> <tr> <td> <div class="leftColumn">Apri file</div> </td> <td style="width: 348px;"/> <td> <div class="leftColumn">Ubi</div> </td> <td style="width: 3px;"/> <td> <div class="leftColumn">Data doc.</div> </td> <td> <div class="leftColumn">Res.</div> </td> </tr> </table> </div> <xf:repeat nodeset="files/file" id="files-repeat"> <table border="0" > <tr> <td> <xf:trigger submission="replace-form-with" appearance="minimal" class="url"> <xf:label> <xf:output class="url" ref="link-text" style="width:400px;"/> </xf:label> <xf:action ev:event="DOMActivate"> <xf:setvalue class="url" ref="instance('URL-container')" value="concat('{$host}','exist/apps/DATI/', '{$trow_storage}','/',instance('files')/files/file[index('files-repeat')]/link-file-name,'.',instance('files')/files/file[index('files-repeat')]/link-est)" /> <xf:load ref="instance('URL-container')" /> </xf:action> </xf:trigger> </td> <td style="width: 20px;"/> <td> <xf:output style="width:10px;" ref="ubi"/> </td> <td style="width: 20px;"/> <td> <xf:output style="width:60px;" ref="data1"/> </td> <td style="width: 20px;"/> <td> <xf:output ref="resp"/> </td> </tr> </table> </xf:repeat> </fieldset> <br/> <table border="0"> <tr> <td style="width: 15px;"/> <td> <xf:submit submission="delete"> <xf:label><div class="my_special_button" style="width: 150px;">Elimina riga selezionata</div></xf:label> <xf:action ev:event="DOMActivate"> <xf:setvalue ref="instance('del-row-data')/file_name/text()" value="instance('files')/files/file[index('files-repeat')]/link-file-name" /> <xf:setvalue ref="instance('del-row-data')/row_num/text()" value="instance('files')/files/file[index('files-repeat')]/tr-id" /> </xf:action> <xf:delete ev:event="DOMActivate" nodeset="."/> </xf:submit> </td> </tr> </table> </xf:group> </center> </body> </html> let $xslt-pi := processing-instruction xml-stylesheet {'type="text/xsl" href="../xsltforms/xsltforms.xsl"'} return ($xslt-pi,$form) Many thanks Alex -- Inviato in modo sicuro con Tutanota. Ottieni la tua casella di posta elettronica crittografata e senza pubblicità: https://tutanota.com 24 mag 2021, 11:16 da xsl...@li...: > Hi all! > I'm probably not able to find the right CSS syntax for highlighting the current selected row within a repeat... > The only indications I can find are the following, but no matter where I write them (inside an external css file or directly within the xsltform) I'm not able to obtain any positive result. > > .xforms-repeat-item-selected > * { > color: red; background-color: white; font-weight:bold; border-bottom:solid 5px #f2f0fb; > } > or: > .xforms-repeat-item-selected {color: blue; background-color: white;} > > Thanks > Alex > > -- > Inviato in modo sicuro con Tutanota. Ottieni la tua casella di posta elettronica crittografata e senza pubblicità: > https://tutanota.com > |
|
From: Alain C. <ala...@ag...> - 2021-05-24 12:05:12
|
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<div>
Hi Alessandro,
</div>
<div class="default-style">
<br>
</div>
<div class="default-style">
Since XSLTForms 1.5, CSS styling is to be based on custom elements.
</div>
<div class="default-style">
<br>
</div>
<div class="default-style">
The easiest way to determine what is possible, is to look at the elements with the browser debugger.
</div>
<div class="default-style">
<br>
</div>
<div class="default-style">
In this case, the selected repeat item has an xf-selected attribute set to true. So, a CSS rule like this one should be the one you are look for:
</div>
<div class="default-style">
<br>
</div>
<div class="default-style">
<div>
#files-repeat > xforms-repeat-item[xf-selected = "true"] {
</div>
<div>
color: red;
</div>
<div>
}
</div>
<div>
<br>
</div>
<div class="default-style">
Thank you for your feedback!
</div>
<div class="default-style">
<br>
</div>
<div class="default-style">
--Alain
</div>
</div>
<blockquote type="cite">
<div>
Le 24/05/2021 13:27, Alessandro via Xsltforms-support <xsl...@li...> a écrit :
</div>
<div>
<br>
</div>
<div>
<br>
</div>
<div>
Steven and Ralph, thanks, but as I'm still not able to obtain the desired style effect, I give you a wider sight on my code.
<br>
</div>
<div>
<br>
</div>
<div>
I'm currently using XSLTForms 1.5.2 with exist-db. After extracting my data I put them within a variable, just to have the possibility of adjusting the date format for an easier Italian reading. Then I create an instance to contain the data. The displaying table enclosed within a repeat is intended to present the user with links to be used for opening the correlated files.
<br>
</div>
<div>
<br>
</div>
<div>
let $form :=
<br>
</div>
<div>
<html xmlns="<a href="http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a>" xmlns:xf="<a href="http://www.w3.org/2002/xforms">http://www.w3.org/2002/xforms</a>" xmlns:ev="<a href="http://www.w3.org/2001/xml-events">http://www.w3.org/2001/xml-events</a>" xmlns:xs="<a href="http://www.w3.org/2001/XMLSchema">http://www.w3.org/2001/XMLSchema</a>" xmlns:xsi="<a href="http://www.w3.org/2001/XMLSchema-instance">http://www.w3.org/2001/XMLSchema-instance</a>">
<br>
</div>
<div>
<head>
<br>
</div>
<div>
<link rel="stylesheet" type="text/css" href="resources/css/xsltforms_style.css" />
<br>
</div>
<div>
<script src="resources/data/my_javascripts.js"/>
<br>
</div>
<div>
<br>
</div>
<div>
<style type="text/css">
<br>
</div>
<div>
<!--/*--><css><![CDATA[/**/
<br>
</div>
<div>
/*]]>*/<!--/*--></css><!--*/-->
<br>
</div>
<div>
</style>
<br>
</div>
<div>
<br>
</div>
<div>
<xf:model>
<br>
</div>
<div>
<br>
</div>
<div>
<xf:instance id="files">
<br>
</div>
<div>
<data xmlns="">{$directory_files}</data>
<br>
</div>
<div>
</xf:instance>
<br>
</div>
<div>
<br>
</div>
<div>
<xf:instance id="URL-container" xmlns="">
<br>
</div>
<div>
<URL />
<br>
</div>
<div>
</xf:instance>
<br>
</div>
<div>
<br>
</div>
<div>
<xf:instance id="del-row-data" xmlns="">
<br>
</div>
<div>
<data>
<br>
</div>
<div>
<file_name/>
<br>
</div>
<div>
<row_num/>
<br>
</div>
<div>
</data>
<br>
</div>
<div>
</xf:instance>
<br>
</div>
<div>
<br>
</div>
<div>
<!-- DELETE ACTION -->
<br>
</div>
<div>
<xf:submission ref="instance('del-row-data')" id="delete" method="post" action="action_confirmation_1.xq?action=deldirfiles&amp;arch_id={$arch_id}&amp;f_id={$cart_id}&amp;t_id={$tab_id}&amp;r_id={$row_id}&amp;alert_text=Si è sicuri di voler eliminare la riga selezionata?" instance="" replace=""/>
<br>
</div>
<div>
<br>
</div>
<div>
</xf:model>
<br>
</div>
<div>
</head>
<br>
</div>
<div>
<body>
<br>
</div>
<div>
<center>
<br>
</div>
<div>
<h2 style="color:red">File contenuti nella cartella: «{$directory}»</h2>
<br>
</div>
<div>
<br>
</div>
<div>
<br/>
<br>
</div>
<div>
<br>
</div>
<div>
<xf:group ref="instance('files')">
<br>
</div>
<div>
<fieldset id="">
<br>
</div>
<div>
<div class="header-directory-files">
<br>
</div>
<div>
<table border="0">
<br>
</div>
<div>
<tr>
<br>
</div>
<div>
<td>
<br>
</div>
<div>
<div class="leftColumn">Apri file</div>
<br>
</div>
<div>
</td>
<br>
</div>
<div>
<td style="width: 348px;"/>
<br>
</div>
<div>
<td>
<br>
</div>
<div>
<div class="leftColumn">Ubi</div>
<br>
</div>
<div>
</td>
<br>
</div>
<div>
<td style="width: 3px;"/>
<br>
</div>
<div>
<td>
<br>
</div>
<div>
<div class="leftColumn">Data doc.</div>
<br>
</div>
<div>
</td>
<br>
</div>
<div>
<td>
<br>
</div>
<div>
<div class="leftColumn">Res.</div>
<br>
</div>
<div>
</td>
<br>
</div>
<div>
</tr>
<br>
</div>
<div>
</table>
<br>
</div>
<div>
</div>
<br>
</div>
<div>
<xf:repeat nodeset="files/file" id="files-repeat">
<br>
</div>
<div>
<table border="0" >
<br>
</div>
<div>
<tr>
<br>
</div>
<div>
<td>
<br>
</div>
<div>
<xf:trigger submission="replace-form-with" appearance="minimal" class="url">
<br>
</div>
<div>
<xf:label>
<br>
</div>
<div>
<xf:output class="url" ref="link-text" style="width:400px;"/>
<br>
</div>
<div>
</xf:label>
<br>
</div>
<div>
<br>
</div>
<div>
<xf:action ev:event="DOMActivate">
<br>
</div>
<div>
<xf:setvalue class="url" ref="instance('URL-container')" value="concat('{$host}','exist/apps/DATI/', '{$trow_storage}','/',instance('files')/files/file[index('files-repeat')]/link-file-name,'.',instance('files')/files/file[index('files-repeat')]/link-est)" />
<br>
</div>
<div>
<br>
</div>
<div>
<xf:load ref="instance('URL-container')" />
<br>
</div>
<div>
</xf:action>
<br>
</div>
<div>
</xf:trigger>
<br>
</div>
<div>
</td>
<br>
</div>
<div>
<td style="width: 20px;"/>
<br>
</div>
<div>
<td>
<br>
</div>
<div>
<xf:output style="width:10px;" ref="ubi"/>
<br>
</div>
<div>
</td>
<br>
</div>
<div>
<td style="width: 20px;"/>
<br>
</div>
<div>
<td>
<br>
</div>
<div>
<xf:output style="width:60px;" ref="data1"/>
<br>
</div>
<div>
</td>
<br>
</div>
<div>
<td style="width: 20px;"/>
<br>
</div>
<div>
<td>
<br>
</div>
<div>
<xf:output ref="resp"/>
<br>
</div>
<div>
</td>
<br>
</div>
<div>
</tr>
<br>
</div>
<div>
</table>
<br>
</div>
<div>
<br>
</div>
<div>
</xf:repeat>
<br>
</div>
<div>
</fieldset>
<br>
</div>
<div>
<br>
</div>
<div>
<br/>
<br>
</div>
<div>
<br>
</div>
<div>
<table border="0">
<br>
</div>
<div>
<tr>
<br>
</div>
<div>
<td style="width: 15px;"/>
<br>
</div>
<div>
<td>
<br>
</div>
<div>
<xf:submit submission="delete">
<br>
</div>
<div>
<xf:label><div class="my_special_button" style="width: 150px;">Elimina riga selezionata</div></xf:label>
<br>
</div>
<div>
<xf:action ev:event="DOMActivate">
<br>
</div>
<div>
<xf:setvalue ref="instance('del-row-data')/file_name/text()" value="instance('files')/files/file[index('files-repeat')]/link-file-name" />
<br>
</div>
<div>
<xf:setvalue ref="instance('del-row-data')/row_num/text()" value="instance('files')/files/file[index('files-repeat')]/tr-id" />
<br>
</div>
<div>
</xf:action>
<br>
</div>
<div>
<xf:delete ev:event="DOMActivate" nodeset="."/>
<br>
</div>
<div>
</xf:submit>
<br>
</div>
<div>
</td>
<br>
</div>
<div>
</tr>
<br>
</div>
<div>
</table>
<br>
</div>
<div>
<br>
</div>
<div>
</xf:group>
<br>
</div>
<div>
</center>
<br>
</div>
<div>
</body>
<br>
</div>
<div>
</html>
<br>
</div>
<div>
let $xslt-pi := processing-instruction xml-stylesheet {'type="text/xsl" href="../xsltforms/xsltforms.xsl"'}
<br>
</div>
<div>
return ($xslt-pi,$form)
<br>
</div>
<div>
<br>
</div>
<div>
Many thanks
<br>
</div>
<div>
Alex
<br>
</div>
<div>
<br>
</div>
<div>
--
<br>
</div>
<div>
Inviato in modo sicuro con Tutanota. Ottieni la tua casella di posta elettronica crittografata e senza pubblicità:
<br>
</div>
<div>
https://tutanota.com
<br>
</div>
<div>
<br>
</div>
<div>
<br>
</div>
<div>
24 mag 2021, 11:16 da xsl...@li...:
<br>
</div>
<blockquote>
<div>
Hi all!
<br>
</div>
<div>
I'm probably not able to find the right CSS syntax for highlighting the current selected row within a repeat...
<br>
</div>
<div>
The only indications I can find are the following, but no matter where I write them (inside an external css file or directly within the xsltform) I'm not able to obtain any positive result.
<br>
</div>
<div>
<br>
</div>
<div>
.xforms-repeat-item-selected > * {
<br>
</div>
<div>
color: red; background-color: white; font-weight:bold; border-bottom:solid 5px #f2f0fb;
<br>
</div>
<div>
}
<br>
</div>
<div>
or:
<br>
</div>
<div>
.xforms-repeat-item-selected {color: blue; background-color: white;}
<br>
</div>
<div>
<br>
</div>
<div>
Thanks
<br>
</div>
<div>
Alex
<br>
</div>
<div>
<br>
</div>
<div>
--
<br>
</div>
<div>
Inviato in modo sicuro con Tutanota. Ottieni la tua casella di posta elettronica crittografata e senza pubblicità:
<br>
</div>
<div>
https://tutanota.com
<br>
</div>
</blockquote>
<div>
<br>
</div>_______________________________________________ Xsltforms-support mailing list Xsl...@li... https://lists.sourceforge.net/lists/listinfo/xsltforms-support
</blockquote>
</body>
</html>
|
×
Want the latest updates on software, tech news, and AI?
Get latest updates about software, tech news, and AI from SourceForge directly in your inbox once a month.
Thanks for helping keep SourceForge clean.
X