AngularJS空表单验证错误

时间:2015-12-19 12:27:07

标签: javascript php html angularjs controller

我有这种形式,用户的输入需要从表单传递到控制器,然后在PHP数据库中发布。

当我单击“提交”并且输入为空时,false语句有效,但是如果我在输入内部键入然后手动清空它们,则数据仍然会插入,即使它为null(返回{ {1}})。

HTML代码:

true

AngularJS控制器:

<div id="container">    
    <section ng-controller="mapController">
            <h1> Contact Us</h1>                
            <br>
            <h2> If you wish to contact us about prices and information, kindly fill in the form below. </h2>
            <br>
            <form class="form-group" id="customForms" ng-controller="getContactsCtrl">
                    <label> E-mail </label> 
                    <input id="customFormsInput" class="form-control" ng-model="contact.email" type="email" placeholder="E-mail goes here" required/>
                    <br> 
                    <label> Mobile Number </label>
                    <input id="customFormsInput" class="form-control" ng-model="contact.mobile" type="number" placeholder="Your number goes here" required/>
                    <br> 
                    <label> How may we be of service? </label>
                    <br>
                    <textarea rows="4" cols="100" ng-model="contact.text" type="text" placeholder="Insert text here" required>
                    <!-- User text -->
                    </textarea>
                    <br><br>
                    <button class="btn btn-primary" ng-click="newContact(contact)"> Submit </button>
                    <br> <br><p> {{queryMsg}} </p>
                </form> 
            <h2> You can also visit us at our premises at Smart City, Xghajra. </h2>
            <br>
            <div id="googleMap" style="width:500px;height:380px;"></div>
            <br><br>
    </section>  
</div>

PHP代码:

    app.controller('getContactsCtrl', ['$scope', '$http', function($scope, $http)   
{
    $scope.newContact = function(contact) {
        console.log(contact);
        $scope.queryMsg= ""; //displays if sent or not in html form
        //post is used to create
        $http.post('model/addContact.php', contact).success(function(data) {
                if (data && contact != null) 
                {//row inserted
                  $scope.queryMsg = "Query has been sent successfully.";
                  console.log("Query received in DB");
                  $scope.contact=""; //clear text again after submit is pressed
                }
                else
                {
                  $scope.queryMsg = "We were unable to fetch your query at this time.";
                  console.log("Query not received");
                }
            })
        };
    }
]);

0 个答案:

没有答案