表单onsubmit =“return validate()”问题

时间:2014-01-21 22:54:56

标签: javascript forms validation

我是这个网站的新手,我无法找到答案(老实说,我给了它最好的拍摄)

我有一个表单,我想在完成其操作之前验证。我对PHP的了解非常有限,所以希望你能帮我找到一个JavaScript解决方案。

以下是我到目前为止的一个例子:

<!DOCTYPE html>
<head>
<title>Example</title>
</head>
<body>

<script type="text/javascript">
// FAIL IF NOT A NUMBER
function validate()
    {
    if (a.value == isNaN)
    {
    return false;
    }
    if (b.value == isNaN)
    {
    return false;
    }
    if (c.value == isNaN)
    {
    return false;
    }
    return true;
    }
</script>

<form name="form1" action="#" onsubmit="return validate()" method="post">
<input type="text" name="a">
<input type="text" name="b">
<input type="text" name="c">
<input class="button" type="submit" value="Submit">
</form>

</body>
</html>

3 个答案:

答案 0 :(得分:1)

试试@Scott

function validate() {
    a = document.getElementsByName("a")[0].value;
    b = document.getElementsByName("b")[0].value;
    c = document.getElementsByName("c")[0].value;

    if (isNaN(a[0].value) && a!="") {
        return false;
    }

    if (isNaN(a[0].value) && b!="") {
        return false;
    }

    if (isNaN(a[0].value) && c!="") {
        return false;
    }

    return true;
}

<form name="form1" action="" onsubmit="validate()" method="post">
    <input type="text" name="a">
    <input type="text" name="b">
    <input type="text" name="c">
    <input class="button" type="submit" value="Submit">
</form>

答案 1 :(得分:0)

您可以在按钮

中调用该功能
<button onclick="validate()" type="submit">Submit</button>
<input type="text" id="a" name="a"> 

并抓住像这样的价值

<script type="text/javascript">
// FAIL IF NOT A NUMBER
function validate()
    {
    var a = document.getElementById("a").value; // or getElementByName
    var b = document.getElementById("b").value;
    var c = document.getElementById("c").value;
    var d = document.getElementById("d").value;
    if (a.match(/[a-zA-Z]))
    {
    return false;
    }
    if (b.value == isNaN)
    {
    return false;
    }
    if (c.value == isNaN)
    {
    return false;
    }
    return true;
    }
</script>

答案 2 :(得分:0)

    HTML CODE : 

<!-- createNewAbout is my module name and submitAboutContent is the Controller You you can call it the backend function . 
You Can Use URL in Form Action too.  -->
    <form action="createNewAbout/submitAboutContent" method="post" enctype="multipart/form-data" onSubmit="return validationOnlySubmitForm('submitStaffData', new Array('subject','details'))">
<!--  I am Calling a function before submit if this function returns true then only the data will be Submit . -->
    <div class="form-group col-md-12">
<!--   there are simple form -->
    <label for="title">Enter Title</label>
    <input type="text" class="form-control" placeholder="Enter Title" id="subject" name="subject">
    </div>
    <div class="form-group col-md-12">
    <label for="title">Enter Description</label>
    <textarea type="text" class="form-control" placeholder="Enter Description" id="details" name="details"></textarea>
    </div>
    <div class="form-group col-md-12">
    <label for="title">Add Image</label>
    <input type="file" id="file" name="file" style="padding: 5px;font-size: 15px;width: 100px;">
    </div>
    <div class="col-md-12 mrg15px ">
    <button class="btn btn-primary center-block" type="submit">Submit</button>
    </div>
    </form>


<!-- this is the function Which i am Calling . I am taking value of  name attribute of button to disable button for multiple fuction call and also taking an array of values of name attribute of  manditory fields. Here we cant use values of ID attribute so we have to use name . -->
    <script> 
    function validationOnlySubmitForm(button_name="", arr="") {
    var fields = arr, flag  = 0;
    document.getElementsByName(button_name)[0].setAttribute("disabled" , true);
    for (var i = 0 ; i <= fields.length - 1 ; i++) {
    if (document.getElementsByName(fields[i])[0].value.length == 0) {
    flag = 1;
    document.getElementsByName(fields[i])[0].focus();
    alert(fields[i] + " is manditory.");
    document.getElementsByName(button_name)[0].removeAttribute("disabled");
    return false;
    }
    }

    if (flag == 0)
    return true;
    }

    </script>