只读字段在Orbeon表单中的行为 [英] readonly field behaviour in Orbeon Forms

问题描述

我们对Orbeon Forms中的字段只读行为有一个问题。我们通常在绑定定义中写入条件来告诉何时字段应该是只读的，因此当满足条件时，表单上的字段（HTML浏览器）将不可编辑。

We have an issue with the field readonly behaviour in Orbeon Forms. We usually write conditions in the bind definitions to tell when a field should be readonly, so when the condition is met, the field on the form(HTML browser) will not be editable.

但是，在字段的HTML页面源中，我们看到字段保留了属性disabled =disabled，而不是readonly =readonly。由于属性disabled =disabled，输入字段中的数据将以灰色（ IE浏览器，Windows默认外观）显示，并且看起来模糊/无效，因此无法正确查看。
此外，我们不能通过css属性为禁用字段更改输入数据的颜色，但我们可以对具有属性readonly =readonly的字段进行更改。

However, in the HTML Page source of the field we see that the field holds up the property disabled="disabled" but not readonly="readonly". Because of the property disabled="disabled" the data in the input field will be shown in grey color(IE Browser, windows default appearance) and it looks blurred/dull and hence is not viewable correctly. Also we cannot change the color of the input data by css properties for disabled fields, but we can do for fields having property readonly="readonly".

所以问题是当我们在Orbeon代码中的绑定定义中说readonly =true时，是否可以为HTML浏览器上的字段获取readonly =readonly而不是disabled =disabled属性

So the question is when we say readonly="true" in bind definition in Orbeon code, is it possible to get property as readonly="readonly" instead of disabled="disabled" for a field on the HTML browser

示例Orbeon代码和HTML网页源代码快照位于下面

Sample Orbeon Code and HTML page source snapshot is below

<xhtml:html xmlns:xforms="http://www.w3.org/2002/xforms"
    xmlns:f="http://orbeon.org/oxf/xml/formatting"
    xmlns:xhtml="http://www.w3.org/1999/xhtml"
    xmlns:xxforms="http://orbeon.org/oxf/xml/xforms"
    xmlns:ev="http://www.w3.org/2001/xml-events"
    xmlns:xsd="http://www.w3.org/2001/XMLSchema"
    >

    <xhtml:head>
        <xforms:model xmlns:xforms="http://www.w3.org/2002/xforms"
                xmlns:xs="http://www.w3.org/2001/XMLSchema" id="main-model">

          <xforms:instance id="form-instance">
            <form>
              <field-1></field-1>
              <field-2></field-2>
              <field-3></field-3>
            </form>
          </xforms:instance>

          <xforms:instance id="form-attributes">
            <attributes>
                <summary>false</summary>
            </attributes>
          </xforms:instance>

          <xforms:bind id="summary" nodeset="instance('form-attributes')/summary" />
          <xxforms:variable name="summary" select="instance('form-attributes')/summary" />

          <xforms:bind nodeset="instance('form-instance')" readonly="$summary='true'" />

          <xforms:bind id="field-1" nodeset="instance('form-instance')/field-1" />
          <xforms:bind id="field-2" nodeset="instance('form-instance')/field-2" />
          <xforms:bind id="field-3" nodeset="instance('form-instance')/field-3" />

        </xforms:model>
    </xhtml:head>

    <xhtml:body>

      <table>
        <tr>
            <td>
                <xforms:trigger appearance="minimal" id="readonly-view">
                    <xforms:label>Readonly View</xforms:label>
                    <xforms:action ev:event="DOMActivate">
                        <xforms:setvalue bind="summary" value="'true'" />
                    </xforms:action>
                </xforms:trigger>
            </td>
            <td>
                <xforms:trigger appearance="minimal" id="editable-view">
                    <xforms:label>Editable View</xforms:label>
                    <xforms:action ev:event="DOMActivate">
                        <xforms:setvalue bind="summary" value="'false'" />
                    </xforms:action>
                </xforms:trigger>
            </td>
        </tr>
        <tr>
            <td>
                Field 1: 
            </td>
            <td>
                <xforms:input bind="field-1" id="field-1-id" xxforms:maxlength="10" /> 
            </td>
        </tr>
        <tr>
            <td>
                Field 2: 
            </td>
            <td>
                <xforms:input bind="field-2" id="field-2-id" xxforms:maxlength="10" /> 
            </td>
        </tr>
        <tr>
            <td>
                Field 3: 
            </td>
            <td>
                <xforms:input bind="field-3" id="field-3-id" xxforms:maxlength="10" /> 
            </td>
        </tr>
      </table>

    </xhtml:body>
</xhtml:html>

HTML网页来源的快照：

Snap shot of the HTML page source:

推荐答案

此时，您注意到，Orbeon Forms在只读表单字段而不是上生成 disabled =disabled readonly =readonly，并且在不更改Orbeon表单的情况下无法更改。

At this point, as you noticed, Orbeon Forms generates disabled="disabled" on read-only form fields, not readonly="readonly", and this cannot be changed without changing Orbeon Forms.

问题的可能解决方案是使用静态外观，只有控件，它只是以类似于 xf：output 会做的方式显示字段的值，而不是只读表单字段。这通常可用于非常轻松地创建审核页面，您可以在其中向用户显示他们在提交之前输入的所有值。

A possible solution to your problem is to use the static appearance for read-only controls, which just shows the values of fields, in a way similar to what an xf:output would do, rather than the read-only form field. This is typically useful for very easily creating review pages, where you show users all the values they entered before submitting them.

这篇关于只读字段在Orbeon表单中的行为的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！