在angularjs中提交表单后字段清除

时间:2015-10-28 10:52:39

标签: angularjs formfield

我的模态打开按钮点击并使用angularjs提交表单并且成功消息来找我。我想在成功响应到来时清除表单字段。下面是我正在使用的html

<form name="registerproductForm" id="registerproduct" ng-submit="createRegisterProduct(registerproductForm.$valid)" novalidate>

            <div angucomplete-alt placeholder="Name" 
           pause="100" 
           selected-object="residentSelected"
           search-fields="ProductName" 
           title-field="ProductName" 
           minlength="1" 
           local-data="unregisterproducts"
           input-class="form-control form-control-small"
           match-class="highlight" 
           override-suggestions="true">
         </div>
            <p ng-show="(registerproductForm.ProductName.$invalid && !registerproductForm.ProductName.$pristine) || submitted" class="help-block">Product Name is required.</p>
            <input type="text" name="SerialNumber" id="productSerialNumber" placeholder="{{serialnumber}}" ng-model="productregister.SerialNumber" required/>
            <p ng-show="(registerproductForm.SerialNumber.$invalid && !registerproductForm.SerialNumber.$pristine) || submitted" class="help-block">Product S/N is required.</p>
            <input placeholder="Purchase Date" class="input-datepicker before" name="PurchaseDate" type="datetime" date-time min-view="date" ng-model="productregister.PurchaseDate" format="shortDate" required>
                <p ng-show="(registerproductForm.PurchaseDate.$invalid && !registerproductForm.PurchaseDate.$pristine) || submitted" class="help-block">Purchase Date is required.</p>
                <input placeholder="Registration Date" class="input-datepicker before" name="RegistrationDate" type="datetime" date-time min-view="date" ng-model="productregister.RegistrationDate" format="shortDate" required>
                    <p ng-show="(registerproductForm.RegistrationDate.$invalid && !registerproductForm.RegistrationDate.$pristine) || submitted" class="help-block">Registration Date is required.</p>
                    <input type="checkbox" ng-model="productregister.ReceiveDocuments" ng-true-value="YES" ng-false-value="NO"><span>Receive Document updates</span>
                        <input type="checkbox" ng-model="productregister.ReceiveResources" ng-true-value="YES" ng-false-value="NO"><span>Receive Resource updates</span><br />
                            <button type="submit" class="button white">Submit</button>
                            </form>

这是我正在使用的指令

.directive('registerModal', function($document) {
            return{
                restrict: 'E',
                replace: 'true',
                scope: {
                    show: '='
                },
                templateUrl: '/app/partial/modals/register.html',
                controller: function($scope, $timeout, $http, $location, $route) {
                    $http({
                        method: 'POST',
                        url: 'getunregisterproduct',
                    }).success(function(data) {
                        $scope.unregisterproducts = data.success.data;
                        //console.log(data.success.data);
                    })
                    $scope.productregister = {};
                    $scope.residentSelected = function(selected) {
                        //console.log(selected);
                        $scope.productregister.product_id = selected.description.id;
                        $scope.productregister.ProductName = selected.description.ProductName;
                    }
                    $scope.productregister = {
                        ReceiveDocuments: 'NO',
                        ReceiveResources: 'NO',
                    }
                    $scope.productnameplaceholder = 'Product Name';
                    $scope.serialnumber = 'Your S/N';
                    $scope.createRegisterProduct = function(isValid) {
                        $scope.validated = true;
                        $scope.submitted = true;

                        // check to make sure the form is completely valid
                        if (isValid) {

                            $scope.submitted = false;
                            var registerproductdata = $scope.productregister;
                            console.log(registerproductdata);
                            $http({
                                method: 'POST',
                                url: 'registerproduct',
                                data: registerproductdata, //forms user object
                            }).success(function(data) {
                                //console.log(data.success.message);
                                if (data.success.message) {
                                    //$scope.submitted = false;
                                    //$scope.productregister = {};
                                    //$scope.registerproductForm.$setPristine();
                                    //$location.path('/');
                                    //$route.reload();
                                }
                            });
                        }

                    };
                    $scope.focus = function() {
                        document.getElementById('searchInput').focus()
                    };
                }
                ,
                link: function(scope, element) {

                }
            }
        })

0 个答案:

没有答案