在JavaScript

时间:2016-08-15 13:53:14

标签: javascript html

基本上我有一个HTML表单,其中包含一个文本框和一个提交按钮,我想要的是当我按下提交按钮时,应检查文本框是否没有错误然后继续提交。

这是我的按钮代码:

 <form id="thisform">
 <div id="Registeration" class="Registeration">
            <input type="text" id="textbox" class="textbox"
            placeholder="My textbox" name="fBox" maxlength="30"/>
        </div>

<div class="Registration_Submit_Div">
    <input type="submit" value="submitform" id="SumbitForm_btn" class="SumbitForm_btn" name="Submit_btn" onclick="submit()"/>
</div></form>

function(){
    alert('hello');
    return false;
}

2 个答案:

答案 0 :(得分:0)

你可以使用AngularJS:

Angular允许您获取有关表单的状态:$ invalid / $ valid

以下代码将禁用该按钮,直到表单有效:

<input type="button" value="Submit" ng-click="submit()" class="button" ng-disabled="myForm.$invalid">

请参阅以下示例:

HTML:

<div ng-app>
<form ng-controller="FormController" name="myForm">
   <div class="header padding-b--10">Form Area</div>
        <div class="padding-b--10">
            <input name="empId" placeholder="Employee ID" ng-model="data.empId"
                   style="padding:5px" required/> 
            <span ng-if="myForm.empId.$dirty && myForm.empId.$invalid" ng-bind="invalid" class="error"></span>
        </div>
        <div class="padding-b--10">
            <input name="empEmail" type="email" placeholder="Email" ng-model="data.empEmail"
                   style="padding:5px" required/>
            <span ng-if="myForm.empEmail.$dirty && myForm.empEmail.$invalid" ng-bind="invalid" class="error"></span>
        </div>
        <input type="button" value="Submit" ng-click="submit()" class="button" ng-disabled="myForm.$invalid">

</form>

控制器:

    function FormController($scope){

    $scope.invalid = "Invalid";

    $scope.submit = function(){
        console.log($scope.data);
    }

};

工作示例:https://jsfiddle.net/pqz3hsac/22/

答案 1 :(得分:0)

这是一个简单的JS示例,只有在文本长度至少为5个字符时才会提交表单。

Security > SSL certificate and key management > Key stores and certificates