XForms: Possible to modify HTML element attribute ? (I'm using XSLTForms)

Question

XForms: Possible to modify HTML element attribute ? (I'm using XSLTForms)

57 Views Asked by monojohnny At 03 February 2023 at 23:08

Does XForms have a mechanism for manipulating attributes of the resultant HTML? I guess I mean emitting HTML dynamically and setting the attributes as part of that.

I know that using a xf:repeat - you can effectively emit HTML elements, but I can't work out if this would stretch to attributes?

I'm using XSLTForms as the implementation - so maybe this support hooks for Javascript to do this if there isn't a built-in way?

The reason to ask specifically - I would like to work with the audio element (and some other HTML5 elements).

Original Q&A

There are 2 best solutions below

monojohnny On 04 February 2023 at 14:53

Thanks to the help from Alain Couthures - I was able to put together the following. Sharing in case others find it interesting.

<?xml-stylesheet href="xsltforms/xsltforms.xsl" type="text/xsl"?>
<html
   xmlns="http://www.w3.org/1999/xhtml"
   xmlns:xf="http://www.w3.org/2002/xforms">
   <head>
      <title>Podcast Player</title>
      <xf:model>
         <xf:instance xmlns="">
            <data>
               <url/>
            </data>
         </xf:instance>
        <xf:instance id="feed" src="https://podcasts.files.bbci.co.uk/b05qqhqp.rss"/>
      </xf:model>
   <style><![CDATA[
        * { font-family: arial; background-color:black; color: white }
   ]]></style>
   </head>
   <body>
        <h1><xf:output ref="instance('feed')/channel/title"/></h1>
        <blockquote><xf:output ref="instance('feed')/channel/description"/></blockquote>
        <xf:select1 ref="url" appearance="full">
            <xf:itemset nodeset="instance('feed')/channel/item">
                <xf:label ref="title"/>
                <xf:value ref="enclosure/@url"/>
            </xf:itemset>
        </xf:select1>
       <audio src="{url}" controls="true"/>
   </body>
</html>

The relevant bit to this post is the "audio" tag and in particular the "{url}" attribute template.

Here's a screenshot:

For those that wish to try this example, you'll need XSLTForms : https://en.wikibooks.org/wiki/XSLTForms , other XForms implementations are available.

Note: save the file with the extension '.xhtml' and place behind a webserver of your choice. For instance using test HTTP servers: php, python etc.

**Alain Couthures** · Accepted Answer · 2023-02-04T05:33:33.867000

Alain Couthures On 04 February 2023 at 05:33 BEST ANSWER

Yes, it is named AVT for Attribute Value Template. As in XSLT, just wrap XPath expressions into curly braces like in <div class="proto{$myclass}">.

XForms: Possible to modify HTML element attribute ? (I'm using XSLTForms)

There are 2 best solutions below

Related Questions in DOM

Related Questions in XFORMS

Related Questions in XSLTFORMS

Trending Questions

Popular # Hahtags

Popular Questions