Question

我已按照this article中的步骤创建基本的自定义编辑器，但在尝试从

进入表单编辑模式时出现404错误

/EPiServer/CMS/1.0.456/ClientResources/dtk/app/editors/EmailTextbox.js

文档链接文章指出，EPiServer会自动将/ ClinetResources / Scripts中的映射添加到app命名空间。我拿了一个平底船并将一个module.config添加到我的网站的根目录，如下所示：

<?xml version="1.0" encoding="utf-8"?>
<module>
    <assemblies>
        <!-- This adds the Alloy template assembly to the "default module" -->
        <add assembly="PropertyTest" />
    </assemblies>

    <dojoModules>
        <!-- Add a mapping from alloy to ~/ClientResources/Scripts to the dojo loader configuration -->
        <add name="app" path="Scripts" />
    </dojoModules>
</module>

这修复了404，但是当我尝试进入表单模式时，我在控制台中出现了类型错误

TypeError {} dojo.js：15
  （匿名函数）dojo.js：15
  dojo.Deferred.reject.errback的dojo.js：15个
  _174的dojo.js：15个
  dojo.Deferred._171.then.then的dojo.js：15个
  dojo.Deferred.when.dojo.when的dojo.js：15个
  dojo.declare._createInternal widgets.js：2
  （匿名函数）widgets.js：2
  _388的dojo.js：15个
  地图的dojo.js：15个
  dojo.declare._createWidgets widgets.js：2个
  （匿名函数）widgets.js：2
  _388的dojo.js：15个
  _c6的dojo.js：15个
  _36的dojo.js：15个
  _7a的dojo.js：15个
  _ee的dojo.js：15个
  req.injectUrl._109 dojo.js：15

为什么会出错？

我的JS文件的来源是根据链接的文章，但我在下面包含了完整性。

define([
    // Inherited mixins
    "dojo",
    "dojo/_base/declare",
    "dijit/_Widget",
    "dijit/_TemplatedMixin"
], function (
    dojo,
    declare,
    _Widget,
    _TemplatedMixin) {

    declare("app.editors.EmailTextbox", [_Widget, _TemplatedMixin], {

        // templateString: [protected] String  
        //    A string that represents the default widget template.  
        templateString: '<div> \
                          <input type="email" data-dojo-attach-point="email" data-dojo-attach-event="onchange:_onChange" /> \
                         </div>',

        postCreate: function () {
            // summary:  
            //    Set the value to the textbox after the DOM fragment is created.  
            // tags:  
            //    protected  

            this.set('value', this.value);

            if (this.intermediateChanges) {
                this.connect(this.email, 'onkeydown', this._onIntermediateChange);
                this.connect(this.email, 'onkeyup', this._onIntermediateChange);
            }
        },

        focus: function () {
            // summary:  
            //    Put focus on this widget.  
            // tags:  
            //    public  

            dijit.focus(this.email);
        },

        isValid: function () {
            // summary:  
            //    Indicates whether the current value is valid.  
            // tags:  
            //    public  

            var emailRegex = '[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+.[a-zA-Z0-9-.]+';
            if (!this.required) {
                emailRegex = '(' + emailRegex + ')?';
            }
            var regex = new RegExp('^' + emailRegex + '$');
            return regex.test(this.value);
        },

        onChange: function (value) {
            // summary:   
            //    Called when the value in the widget changes.   
            // tags:   
            //    public callback   
        },

        _onIntermediateChange: function (event) {
            // summary:   
            //    Handles the textbox key press events event and populates this to the onChange method.   
            // tags:   
            //    private   

            if (this.intermediateChanges) {
                this._set('value', event.target.value);
                this.onChange(this.value);
            }
        },

        _onChange: function (event) {
            // summary:   
            //    Handles the textbox change event and populates this to the onChange method.   
            // tags:   
            //    private   

            this._set('value', event.target.value);
            this.onChange(this.value);
        },

        _setValueAttr: function (value) {
            // summary:   
            //    Sets the value of the widget to "value" and updates the value displayed in the textbox.   
            // tags:   
            //    private   

            this._set('value', value);
            this.email.value = this.value || '';
        }
    });
});

Answer 1

如果您已正确加载脚本，那么部署脚本文件的调试版本是个好主意。请转至Debugging EPiServer CMS client side files进行下载，并说明如何部署它们。

使用压缩和缩小版本很难弄清楚出了什么问题。

Answer 2

如果您想要电子邮件验证，您是否知道可以使用RegularExpression属性？

[RegularExpression(EPiServer.Framework.Validator.EmailRegexString)]  
public virtual string Email { get; set; }

Answer 3

如果在开发框中发生这种情况，解决方案是在Visual Studio中禁用Broswer链接。

http://www.herlitz.nu/2016/09/19/cant-load-the-episerver-edit-gui-in-development-environment/

尝试加载自定义客户端编辑器时出错

3 个答案: