DWZ 自定义异常及后台校验

Posted 2021-03-08 smokerbig

1.form表单提交弹出自定义异常

　　示例：　

<form 
　　id="pagerForm" 
　　method="post" action="后台访问地址" 
　　class="pageForm required-validate" 
　　onsubmit="return validateCallback(this,dialogAjaxDonereload)">
</form>

项目中默认使用：validateCallback 当前ajax提交在 dwz.ajax.js中，部分源码：

var _submitFn = function(){
        $.ajax({
            type: form.method || ‘POST‘,
            url:$form.attr("action"),
            data:$form.serializeArray(),
            dataType:"json",
            cache: false,
            success: callback || DWZ.ajaxDone,
            error: DWZ.ajaxError
        });
    };

 DWZ.ajaxError 会返回服务器异常信息在dwz.core.js 其中源码如下：

ajaxError:function(xhr, ajaxOptions, thrownError){
        if (alertMsg) {
            alertMsg.error("<div>Http status: " + xhr.status + " " + xhr.statusText + "</div>" 
                + "<div>ajaxOptions: "+ajaxOptions + "</div>"
                + "<div>thrownError: "+thrownError + "</div>"
                + "<div>"+xhr.responseText+"</div>");
        } else {
            alert("Http status2: " + xhr.status + " " + xhr.statusText + "
ajaxOptions: " + ajaxOptions + "
thrownError:"+thrownError + "
" 

+xhr.responseText);
        }
    }

 

在上面源码下新增一个DWZ出现error的信息，抛出自定义异常的时候只返回异常文本信息：

ajaxErrorMsg:function(xhr, ajaxOptions, thrownError){
        if (alertMsg) {
            alertMsg.info("<div>"+xhr.responseText+"</div>");
        } else {
            alert("Http status2: " + xhr.status + " " + xhr.statusText + "
ajaxOptions: " + ajaxOptions + "
thrownError:"+thrownError + "
" 

+xhr.responseText);
        }
    }

 

在dwz.ajax.js中复制一份validateCallback 的源码 修改方法名validateCallbackMsg，修改error的调用 使用刚刚新增的ajaxErrorMsg：

var _submitFn = function(){
        $.ajax({
            type: form.method || ‘POST‘,
            url:$form.attr("action"),
            data:$form.serializeArray(),
            dataType:"json",
            cache: true,
            success: callback || DWZ.ajaxDone,
            error: DWZ.ajaxErrorMsg
        });
    };

 

使用时直接使用validateCallbackMsg

2.A 连接抛出自定义异常

示例：

<a id="id" class="edit" href="后台地址"  target="ajaxTodo">下发通知</a>

 提交后会通过target中的ajaxTodo方法进行提交：ajaxTodo 是dwz.ajax.js中,新增ajaxTodoMsg:

function ajaxTodo(url, callback){
    console.info(11111111111111111112);
    var $callback = callback || navTabAjaxDone;
    if (! $.isFunction($callback)) $callback = eval(‘(‘ + callback + ‘)‘);
    $.ajax({
        type:‘POST‘,
        url:url.split(‘?‘)[0],
        data:url.split(‘?‘)[1],
        dataType:"json",
        cache: false,
        success: $callback,
        error: DWZ.ajaxError
    });
}

function ajaxTodoMsg(url, callback){
    var $callback = callback || navTabAjaxDone;
    if (! $.isFunction($callback)) $callback = eval(‘(‘ + callback + ‘)‘);
    $.ajax({
        type:‘POST‘,
        url:url.split(‘?‘)[0],
        data:url.split(‘?‘)[1],
        dataType:"json",
        cache: false,
        success: $callback,
        error: DWZ.ajaxErrorMsg
    });
}

 

 　　jquery扩展，在$.fn.extend中，修改后的如下：

$.fn.extend({
    ajaxTodo:function(){
        return this.each(function(){
            var $this = $(this);
            $this.click(function(event){
                var url = unescape($this.attr("href")).replaceTmById($(event.target).parents(".unitBox:first"));
                DWZ.debug(url);
                if (!url.isFinishedTm()) {
                    alertMsg.error($this.attr("warn") || DWZ.msg("alertSelectMsg"));
                    return false;
                }
                var title = $this.attr("title");
                if (title) {
                    alertMsg.confirm(title, {
                        okCall: function(){
                            ajaxTodo(url, $this.attr("callback"));
                        }
                    });
                } else {
                    ajaxTodo(url, $this.attr("callback"));
                }
                event.preventDefault();
            });
        });
    },ajaxTodoMsg:function(){
        return this.each(function(){
            var $this = $(this);
            $this.click(function(event){
                var url = unescape($this.attr("href")).replaceTmById($(event.target).parents(".unitBox:first"));
                DWZ.debug(url);
                if (!url.isFinishedTm()) {
                    alertMsg.error($this.attr("warn") || DWZ.msg("alertSelectMsg"));
                    return false;
                }
                var title = $this.attr("title");
                if (title) {
                    alertMsg.confirm(title, {
                        okCall: function(){
                            ajaxTodoMsg(url, $this.attr("callback"));
                        }
                    });
                } else {
                    ajaxTodoMsg(url, $this.attr("callback"));
                }
                event.preventDefault();
            });
        });
    }
});

上面源码 新增了一个ajaxTodoMsg 其中的ajaxTodoMsg调用在dwz.ui.js
if ($.fn.ajaxTodo) $("a[target=ajaxTodo]", $p).ajaxTodo();
if ($.fn.ajaxTodoMsg) $("a[target=ajaxTodoMsg]", $p).ajaxTodoMsg();

 

3 需要a连接提交方法前后台先验证如下修改：

//dialogs 其他a链接[target=dialog] target属性值不同的一样用此方法修改

$("a[target=dialog]", $p).each(function(){
        $(this).click(function(event){
            var $this = $(this);
            //打开前的数据校验。 使用Validation属性 Validation=“A()”
             var _callback = $this.attr("Validation");
                if (_callback != undefined && !$.isFunction(_callback)) {
                    _callback = eval("("+_callback+")" );
                    if (!_callback) return false;
                }

        ....................省略.........................

使用方法 在A连接上增加：Validation=“A()”
A()为js方法，JS中异步访问后台校验方法，返回 Boolean
JS中的Ajax后台校验对返回的false进行验证提示，相对比自定义异常麻烦。