形式与内容编辑应具备可编辑` - form`属性编辑、应具备、属性、形式

由网友(各取所需‵)分享简介:我在其中我已经使用 X-编辑插件编辑一个文本字段的形式。但我得到下面的脚本错误。谁能告诉我一些这方面的解决方案。可编辑的元素 表应该有`编辑-form`属性。 <跨度可编辑的文本=user.nameE型=textBtnForm级=NG-NG范围,结合可编辑的> 工作演示 HTML < D...

我在其中我已经使用 X-编辑插件编辑一个文本字段的形式。但我得到下面的脚本错误。谁能告诉我一些这方面的解决方案。

可编辑的元素

 表应该有`编辑-form`属性。 <跨度可编辑的文本=user.nameE型=textBtnForm级=NG-NG范围,结合可编辑的> 

工作演示

HTML

 < D​​IV NG-应用='对myApp'NG控制器=ArrayController>    <形式的行动=#>        <跨度可编辑的文本=user.nameE型=textBtnForm>    {{user.name || '空'}}        < / SPAN>        <按钮类=BTN BTN-默认的NG点击=$ textBtnForm秀()。NG隐藏=$ textBtnForm可见。>编辑        < /按钮>    < /表及GT;< / DIV> 

脚本

  VAR应用= angular.module('对myApp',[xeditable]);app.controller('ArrayController',函数($范围){    $ scope.test =MANU;    $ scope.user = {        名称:'真棒用户    };}); 
用VB.net2008编写屏幕截图小程序

解决方案

有几件事情要做:

可编辑的形式属性添加到窗体的错误提示。删除电子形式=textBtnForm,它不需要您的要求。代替,将 textBtnForm 作为形式的名称。添加键入=按钮来的编辑按钮,否则它不能正常工作(不知道为什么..)。我也补充保存和取消按钮编辑为完整起见时。

结果是这样的:

 <形成可编辑的格式名称=textBtnForm行动=#>    <跨度可编辑的文本=user.name>        {{user.name || '空'}}    < / SPAN>    <按钮式=按钮级=BTN BTN-默认的NG点击=$ textBtnForm秀()。NG隐藏=$ textBtnForm可见。>        编辑    < /按钮>    <$ textBtnForm可见跨越NG-秀= GT;        <按钮式=提交级=BTN BTN-主要NG-禁用=&GTtextBtnForm $等待。          保存        < /按钮>        <按钮式=按钮级=BTN BTN-默认的NG-禁用=$ textBtnForm等待。NG点击=&GTtextBtnForm $取消()。          取消        < /按钮>    < / SPAN>< /表及GT; 

的jsfiddle: http://jsfiddle.net/5TZX5/1/

希望这有助于。

I have a form within which i have used x-editable plugin for editing a text-field. But i am getting the following script error. Can anyone please tell me some solution for this

Form with editable elements should have `editable-form` attribute. <span editable-text="user.name" e-form="textBtnForm" class="ng-scope ng-binding editable"> 

Working Demo

html

<div ng-app='myApp' ng-controller="ArrayController">
    <form action="#" > 
        <span editable-text="user.name" e-form="textBtnForm">
    {{ user.name || 'empty' }}
        </span>
        <button class="btn btn-default" ng-click="textBtnForm.$show()" ng-hide="textBtnForm.$visible">edit
        </button>
    </form>
</div>

script

var app = angular.module('myApp', ["xeditable"]);
app.controller('ArrayController', function ($scope) {
    $scope.test = "manu";
    $scope.user = {
        name: 'awesome user'
    };
});

解决方案

There are a couple things to do:

add the editable-form attribute to the form as the error suggest. remove the e-form="textBtnForm", it's not required for your requirement. instead, set the textBtnForm as a name of the form. add type="button" to the edit button, otherwise it doesn't work (don't know why ..). I've also add save and cancel button when editing for the sake of completeness.

The result would look like this:

<form editable-form name="textBtnForm" action="#"> 
    <span editable-text="user.name">
        {{ user.name || 'empty' }}
    </span>
    <button type="button" class="btn btn-default" ng-click="textBtnForm.$show()" ng-hide="textBtnForm.$visible">
        edit
    </button>
    <span ng-show="textBtnForm.$visible">
        <button type="submit" class="btn btn-primary" ng-disabled="textBtnForm.$waiting">
          Save
        </button>
        <button type="button" class="btn btn-default" ng-disabled="textBtnForm.$waiting" ng-click="textBtnForm.$cancel()">
          Cancel
        </button>
    </span>
</form>

JSFiddle: http://jsfiddle.net/5TZX5/1/

Hope this helps.

阅读全文

相关推荐

最新文章