【问题标题】:Best way to pass css class attribute to grails fields plugin custom template将css类属性传递给grails字段插件自定义模板的最佳方法
【发布时间】:2014-09-09 04:21:36
【问题描述】:

使用 Grails Fields 插件,我有一些自定义模板,我想为其传递一个名为 class 的属性(用于 CSS 样式)。

例如这是我想做的:

<f:field property="someProperty" class="someCustomCssClass" />

问题是我不能简单地在自定义模板中查找“类”属性,因为这是一个保留字。我宁愿不使用不同的属性名称,例如“cssClass”,因为那样我就无法在默认字段模板用法和自定义字段模板用法之间轻松切换。

到目前为止,我唯一能想到的就是解析“widget”属性并从该字符串中获取类,但是有没有更好的方法来获取自定义字段模板中类属性的值?

【问题讨论】:

    标签: grails plugins


    【解决方案1】:

    想通了:

    pageScope["class"]
    

    【讨论】:

    • 你能解释一下吗?
    • 当然——这是来自我的一个被覆盖模板的 sn-p:&lt;input type="text" &lt;%= pageScope["class"] ? "class='${pageScope["class"]}'" : ""%&gt; &lt;%=readonly ? "readonly=readonly" : ""%&gt; etc... /&gt; 通常你可以只按名称查找属性,就像在 readonly 属性中一样。但是类通常不起作用...虽然它在 pageScope 属性 Map 中,所以你可以使用它的键名将它从那里拉出来。
    • 谢谢,太棒了!
    • 嗯。它对我不起作用。我使用带有此模板的 twitter bootstrap gist.github.com/VladimirHavenchyk/6725547 如何为小部件设置类?
    • 这是一个完整的要点示例。此示例中的 _field.gsp 是 String 类型覆盖。例如它位于 /views/_fields/string/_field.gsp 中。该模板不仅允许类,而且还使用引导程序 3.HTH。
    【解决方案2】:

    我在 f:field 标记中使用了以下属性,并且正在开发 1.3 版 Fields Plugin for Grails。

    <f:field property="someProperty" input-class="someCustomCssClass anotherCustomCssClass" />
    

    如果您想添加另一个自定义属性,您可以使用前缀名称“input-”并在前缀后添加所需的名称。所有带有前缀“input-”的属性都作为其属性传递给小部件。

    如果您已经是customized the filed rendering,这是当您在 views/_fields/_field.gsp 中创建默认模板时,您可以将自己的属性传递给在模板文件中添加它们的字段。以下是我用于Twitter Bootstrap 的模板。在这种情况下,我将表单控件类传递给字段。

    <div class="form-group ${invalid ? 'has-error has-feedback' : required && value ? 'has-success has-feedback' : ''}">
        <label class="col-sm-3 control-label" for="${property}">${label}</label>
        <div class="col-sm-9">
            <f:input bean="${bean}" property="${property}" class="form-control"/>
            <g:if test="${invalid}">
                <span class="glyphicon glyphicon-remove form-control-feedback"></span>
                <span class="help-block">${errors.join('<br>')}</span>
            </g:if>
            <g:else test="${invalid}">
                <g:if test="${required && value}">
                    <span class="glyphicon glyphicon-ok form-control-feedback"></span>
                </g:if>
            </g:else>
        </div>
    </div>
    

    如果要渲染默认字段,则必须删除该行:

    <f:input bean="${bean}" property="${property}" class="form-control"/>
    

    并将它们替换为

    ${raw(widget)}
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2019-01-29
      • 1970-01-01
      • 2015-02-18
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多