2016-07-18 2 views
0

Создавать веб-приложение. Он имеет форму с 5 обязательными полями ввода. Он имеет 2 кнопки. Один из них отправляет & другой сэкономит на потом. Когда я нажимаю кнопку «Отправить», форма должна проверять все обязательные поля & сохранить введенные пользователем данные. Это отлично работает для меня.удалять валидации динамически с использованием углового JS

Когда я нажимаю «Сохранить на потом», должно быть обязательно только первое поле ввода. Все остальные поля должны быть изменены как необязательные. Как достичь этого, используя угловые js?

+1

попробуйте динамическое связывание «ng-required» для проверки –

+0

Возможно, вы могли бы вызвать функцию внутри ng-required и использовать флаг, чтобы определить, будет ли это сохранение или сохранение для последующего действия. В этом случае вы должны иметь возможность обрабатывать валидацию, как вам нравится. –

ответ

0

См. ng-required.

Директива устанавливает требуемый атрибут элемента, если Угловое выражение внутри ngRequired имеет значение true.

Пример ниже:

angular 
 
    .module('exampleApp', []) 
 
    .controller('ExampleController', ExampleController); 
 

 
function ExampleController() { 
 
    var vm = this; 
 
    vm.required = false; 
 
}
<!DOCTYPE html> 
 
<html ng-app='exampleApp'> 
 

 
<head> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.5/angular.min.js"></script> 
 
</head> 
 

 
<body ng-controller="ExampleController as vm"> 
 
    <form name="vm.form"> 
 
    <label for="required">Toggle required:</label> 
 
    <input type="checkbox" ng-model="vm.required" id="required" /> 
 
    <br> 
 
    <label for="input">This input must be filled if `required` is true:</label> 
 
    <input type="text" ng-model="model" id="input" name="input" ng-required="vm.required" /> 
 
    <br> 
 
    <p>required status: {{vm.required}}</p> 
 
    <p>form error: {{vm.form.input.$error}}</p> 
 
    </form> 
 

 
</body> 
 

 
</html>

+0

Спасибо, Скотт. Попробуй это. – Ramya

+0

Пробовал использовать код. – Ramya

+0

попробовал тот же код с 2 кнопками. Нажав на сохранение позже, попытался изменить значение false на false. Не работает. Не могли бы вы помочь? angular.module ('ngRequiredExample', []) .controller ('ExampleController', laterSave); функция laterSave ($ scope) { $ scope.required = false; } – Ramya

1

Просмотр

<form name="Form" ng-controller="testController"> 
<input name="input" type="text" id="txtName" ng-model="Name" class="form-control" required> 
<select ng-model="state" ng-options="s for s in stateList" id="state" ng-change="stateOnChange()" class="form-control"></select> 
<input name="input" type="text" id="txtstate" ng-model="pincode" class="form-control" required> 
<input name="input" type="text" id="txtplace" ng-model="place" class="form-control" ng-required={{isRequired}}> 
<button type="submit" class="btn btn-success" ng-submit="saveAction();">Save</button> 

Угловое Контроллер

$scope.isRequired = false; 
$scope.stateOnChange = function() { 
if ($scope.state == "TN") { 
    $scope.isRequired = true; 
} 
else { 
    $scope.isRequired = false; 
}} 
Смежные вопросы