必填字段验证

时间:2014-01-22 18:05:17

标签: angularjs x-editable

我希望当我点击“更新”按钮时,它应该将用户验证为必填字段,我添加了属性 e-required 但不起作用。

请看这个小提琴: http://jsfiddle.net/NfPcH/669/

HTML:

<h4>Angular-xeditable Trigger manually (Bootstrap 3)</h4>
<div ng-app="app" ng-controller="Ctrl">
<span editable-text="user.name" e-form="textBtnForm" buttons="no" e-required />
{{ user.name || 'empty' }}
</span>
 <button class="btn btn-default" ng-click="(textBtnForm.$visible && save()) || textBtnForm.$show()" >
  {{textBtnForm.$visible | editOrUpdate}}
 </button>
</div>

Js控制器:

var app = angular.module("app", ["xeditable"]);

app.filter('editOrUpdate', function() {
return function(arg) {
    return (arg) ? 'Update' : 'Edit';
};
});

app.run(function(editableOptions) {
editableOptions.theme = 'bs3';
});

app.controller('Ctrl', function($scope) {
$scope.user = {
name: 'awesome user'
};
$scope.save = function(event){
    $scope.textBtnForm.$save();
    //save here your data
    //call the object that you passed ($scope.user)
    //get te specific value at ($scope.user.name)
    //alert($scope.user.name);
    return true;
};
});

请帮我解决这个问题。

感谢。

1 个答案:

答案 0 :(得分:1)

请尝试如下所示。祝你好运! :)

<强> HTML

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

<强> JS

var app = angular.module("app", ["xeditable"]);

app.run(function(editableOptions) {
  editableOptions.theme = 'bs3';
});

app.controller('Ctrl', function($scope) {
  $scope.user = {
    name: 'awesome user'
  };
});

现场演示: JSFiddle