Skip to content

Instantly share code, notes, and snippets.

@apb2006

apb2006/creators.xhtml

Created October 17, 2017 10:49
Show Gist options
  • Save apb2006/d7fc016caf7b3c5a279d57c8704d157e to your computer and use it in GitHub Desktop.
Save apb2006/d7fc016caf7b3c5a279d57c8704d157e to your computer and use it in GitHub Desktop.
Download ZIP
XForms sample repeating group
Raw
creators.xhtml
<?xml-stylesheet href="../xsltforms/xsltforms.xsl" type="text/xsl"?>
<?css-conversion no?>
<html xmlns:xf="http://www.w3.org/2002/xforms"
xmlns:xs="http://www.w3.org/2001/XMLSchema"
xmlns:ev="http://www.w3.org/2001/xml-events"
xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Creator test</title>
<link rel="stylesheet" type="text/css" href="local.css"/>
<xf:model>
<xf:instance xmlns="" id="my-table">
<data>
<creator role="writer">Aname</creator>
<creator role="producer">Bname</creator>
</data>
</xf:instance>
<xf:bind nodeset="creator" type="xs:string" required="true()" />
<xf:bind nodeset="creator/@role" type="xs:string" required="true()" />
<xf:instance xmlns="" id="init">
<data>
<creator role=""></creator>
</data>
</xf:instance>
<xf:instance xmlns="" id="creator-roles">
<root>
<role>writer</role>
<role>producer</role>
</root>
</xf:instance>
</xf:model>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u"
crossorigin="anonymous" />
<!-- Optional theme -->
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css"
integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp"
crossorigin="anonymous" />
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script
src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"
integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
crossorigin="anonymous"></script>
<!-- rich-text widget for additionalInfo field -->
<script type="text/javascript"
src="/static/xsltforms/scripts/tinymce_4.3.1/tinymce.min.js"
data-uri="http://www.tinymce.com"
data-version="4.3.1"
>/* */</script>
</head>
<body>
<h1>Edit creator list</h1>
<div class="my-table-steps">
<xf:label class="group-label">Creators:</xf:label>
<xf:repeat nodeset="instance('my-table')/creator" id="row-repeat">
<div class="row" style="display:inline;">
<div class="row-label" style="display:inline;">
<xf:input ref="." id="cell-name">
<xf:label>Name:</xf:label>
</xf:input>
<xf:select1 ref="@role">
<xf:label>Role:</xf:label>
<xf:itemset nodeset="instance('creator-roles')/role">
<xf:label ref="."></xf:label>
<xf:value ref="."></xf:value>
</xf:itemset>
</xf:select1>
</div>
<xf:trigger>
<xf:label>Delete</xf:label>
<xf:delete nodeset="instance('my-table')/creator[index('row-repeat')]" ev:event="DOMActivate"/>
</xf:trigger>
</div>
</xf:repeat>
<xf:trigger>
<xf:label>Add</xf:label>
<xf:action ev:event="DOMActivate">
<xf:insert nodeset="instance('my-table')/creator" at="last()" position="after"
origin="instance('init')/creator"/>
<!-- should insert on the new row -->
<xf:setfocus control="row-name"/>
</xf:action>
</xf:trigger>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment