带有图片上传的xforms重复元素？答案

【问题标题】：xforms repeat element with a picture upload?带有图片上传的xforms重复元素？
【发布时间】：2012-08-06 03:19:56
【问题描述】：

谁能告诉我如何编写代码，使用 XForms，一个允许人们选择一个图片文件上传的小部件，如果需要，重复？也就是说，用户一次上传一张照片，但如果需要，可以选择继续一次又一次地上传。

它可以是元素，也可以只是一个简单的元素。我不确定重复元素与触发元素的关系如何。是否重复元素告诉 XForms 处理器重复显示哪些 UI 元素？而触发元素是一个更新底层模型的按钮？

我不清楚如何获取这些信息。我需要类似的东西吗：

<xforms:repeat 
                <xforms:trigger>
                    <xforms:label>Add pic</xforms:label>
                    <xforms:upload
                        ref="data/picture[@id='1']"
                        mediatype="image/*">
                    </xforms:upload>
                </xforms:trigger>
</xforms:repeat>

例如，如果用户上传了5张图片，是否可以将每张图片识别为pic1，pic2，pic3？

谢谢！

【问题讨论】：

标签： upload repeat xforms media-type

【解决方案1】：

Xforms 重复元素在现有数据中重复显示，您要做的是显示现有照片并插入新照片。 XForms wikibook 非常全面，因此您可能需要查看 http://en.wikibooks.org/wiki/XForms/Insert 和 http://en.wikibooks.org/wiki/XForms/Repeat_into_table

下面是一个未经测试的示例，它应该可以很好地说明你需要做什么。

<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">
   <head>
      <title>XForms insert example</title>
      <xf:model>
         <xf:instance>
            <Data xmlns="">
               <Photo name="My Photo">
                    <!-- Data here -->
               </Photo>
               <NewPhoto name="">
               </NewPhoto>
            </Data>
         </xf:instance>
      </xf:model>
   </head>
   <body>
      <fieldset>
         <legend>Company Phone List</legend>
         <p>
            <b>Uploaded Photos...</b>
            <ul>
            <xf:repeat id="list" nodeset="/Data/Photo">
               <li><xf:output ref="@name" /></li>
            </xf:repeat>
            </ul>
         </p>
      </fieldset>
      <fieldset>
         <legend>Add New Photo</legend>
         <p> <!-- here is where we get the new record -->
            <xf:input ref="/Data/NewPhoto/@name">
               <xf:label>Photo Name:</xf:label>
            </xf:input>
            <xforms:upload
                        ref="/Data/NewPhoto"
                        mediatype="image/*">
            </xforms:upload>
            <xf:trigger>
               <xf:label>Insert... </xf:label>
               <xf:action ev:event="DOMActivate">
                  <xf:insert nodeset="/Data/Photo" at="index('list')" position="after" />
                  <xf:setvalue ref="/Data/Photo[index('list')]/@name" value="/Data/NewPhoto/@name" />
                  <xf:setvalue ref="/Data/Photo[index('list')]" value="/Data/NewPhoto" />
               </xf:action>
            </xf:trigger>
         </p>
      </fieldset>
   </body>
</html>

【讨论】：