如何显示尚未填写的字段

时间:2015-10-06 12:33:17

标签: javascript cq5 aem

我是AEM的新手。

我正在使用CQ5脚手架表格。其中一些字段标有allowBlank = false,这会阻止作者更新表单,直到他们处理完毕。

问题是这些字段分散的形式非常长,我们希望告诉用户他们需要填写的字段的名称。

我无法弄清楚如何在脚手架上点击更新按钮时运行javascript。

1 个答案:

答案 0 :(得分:2)

在你的对话框中,添加一个监听器来注册" beforesubmit"事件,如下所示:

<jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
          jcr:primaryType="cq:Dialog"
          title="Your Component"
          xtype="dialog">
    <items jcr:primaryType="cq:TabPanel">
...
    </items>
    <listeners
            jcr:primaryType="nt:unstructured"
            beforesubmit="function(dialog){return YourNamespace.validate(this);}" />

</jcr:root>

然后,在任何时候使用组件的JavaScript文件中(例如通过向组件添加客户端库),您可以编写所需的JavaScript。例如:

YourNamespace = {};

YourNamespace.validate = function (dialog) {
    var buttonText = dialog.getField('./buttonText'),
        buttonUrl = dialog.getField('./buttonUrl'),
        isValid = true,
        validMsg = 'Validation Failed: You must fill out this field.';

    if(buttonText.getValue().length > 0 && buttonUrl.getValue().length === 0){
        isValid = false;
    }

    if(!isValid){
        CQ.Ext.Msg.show({title: 'Validation Failed', msg: validMsg, buttons: CQ.Ext.MessageBox.OK, icon: CQ.Ext.MessageBox.ERROR});
        return false;
    }
};

引用小部件API,详细了解您可以对作为参数传递的对象执行的操作,例如&#34;对话框&#34;上例中的对象:https://docs.adobe.com/docs/en/cq/5-6-1/widgets-api/index.html