Question

[请参阅更新以获得更精确的规范......]

我最近开始在我的asp.net mvc应用程序中使用jquery jeditable插件。到目前为止一切都很好。

http://forums.asp.net/p/1541654/3789265.aspx的最后一篇文章非常有用，我最后几乎逐字逐句地使用它。但是，建模的错误行为不适合我的应用程序。如果出现错误，它们会丢弃更改，将可编辑区域还原为纯文本，并将错误消息弹出为警报。这对于短输入来说很好，但对于更长的textarea输入是不可接受的。

我的问题：如何更改onerror功能以将可编辑区域恢复为使用被拒绝的输入播种的表单以允许连续编辑？

我想作为首发我应该删除对original.reset（）的调用，但我不知道还有什么要调用以抛出占位符并还原表单。

<h2 class="editable_area" id="Report_Title_<%: Model.report.ReportID %>"><%: Model.report.Title %></h2>
<div class="editable_area" id="Report_HeaderText_<%: Model.report.ReportID %>"><%: Model.report.HeaderText %></div>

<script type="text/javascript" src="../../Scripts/jeditable/jquery.jeditable.js"></script>
<script type="text/javascript">
    $(function () {
        $('.editable_area').each(function (index, element) {

            // Get the property name and menu item id for the AJAX request  
            var identifiers = $(element).attr('id').split('_');
            var target = identifiers[0];
            var property = identifiers[1];
            var id = identifiers[2];

            $(element).editable('/' + target + '/UpdateSettings', {
                name: property,
                submitdata: function (value, settings) {
                    return { 'id': id, '__property': property };
                }, 
                onerror: function (settings, original, xhr) {  
                    var error = eval('(' + xhr.responseText + ')');
                    // This will be reverted by reset. 
                    // $('<span class="field-validation-error">' + error.Message + '</span>').appendTo($(this));  
                    alert(error.Message);  
                    original.reset();  
                },  
                type: 'textarea',
                rows: '10',
                cancel: 'Cancel',
                submit: 'OK',
                indicator: 'Saving...',
                tooltip: 'Click to edit...'
            })
        });
    });
</script>

谢谢，达菲

[更新]看起来诀窍涉及避免设置指示器，然后在错误重新聚焦输入字段期间。

不幸的是，我对onerror的部分解决方案仅适用于IE。在firefox上，focus（）被捕获在“ajaxError”事件中。

           $(element).editable('/' + target + '/UpdateSettings', {
                [...]
                onerror: function (settings, original, xhr) {
                    $('.editable-field-validation-error').remove();
                    var error = eval('(' + xhr.responseText + ')');
                    $('<span class="editable-field-validation-error">' + error.Message + '</span>').prependTo($(this).parent());
                    // This works on IE but not on FireFox due to "ajaxError" event.
                    $(':input:visible:enabled:first', $(this)).focus();
                },
                // indicator: 'Saving...',
                onblur: 'cancel'
            })

问题：如何防止焦点和ajaxError事件纠结？

谢谢！

Answer 1

好吧，事实证明，上面更新中发布的代码段是正确的。它所需要的只是重新启动浏览器。

jquery可编辑插件的错误处理

1 个答案: