Question

请帮帮我..我想验证表格并发送ajax。

验证没有''onsubmit =“return validateForm（this）;”''工作。

但是当表单正确时，它的发送形式（页面刷新..）请耐心等待，帮助我..

这个页面在php上。但我必须只用js / jquery验证然后发送ajax。

这对我来说很重要，这个页面适用于新的goob ..

形式：

<form action="index.php?page=insertContact" id="ajax_form" enctype="multipart/form-data" method="post" onsubmit="return validateForm(this);">
        <div>

            <input type="text" id="name" name="name" placeholder="Imię i nazwisko:" />
            <ul class="error"></ul>

            <input type="text" id="mail" name="mail" placeholder="Adres e-mail:"/>
            <ul class="error"></ul>
            <div>
                <input type="text" id="phone_area" name="phone_area" placeholder="Nr. kier.:"/>
                <div class="clear"></div>
                <ul class="error phone_area"></ul>
            </div>
            <div>
                <input type="text" id="phone" name="phone" placeholder="Telefon kontaktowy:"/>
                <div class="clear"></div>
                <ul class="error phone"></ul>
            </div>

            <input type="text" id="title" name="title" placeholder="Tytuł wiadomości:"/>
            <ul class="error"></ul>

            <textarea id="content_area" name="content_area" placeholder="Treść wiadomości:"></textarea>
            <ul class="error"></ul>
            <input type="submit" name="submit" class="submit" value="Wyślij formularz"/>
            <a href="#" id="send_form" title="Wyślij">Wyślij</a>

        </div>


    </form>

和js：

function ValidateName(name) {
    var reg = /^([A-Za-z\-\. ]{1,50})$/;
    if (reg.test(name) == false) {
        return false;
    }
    else {
        return true;
    }
}


function ValidateEmail(address) {
    var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
    if (reg.test(address) == false) {
        return false;
    }
    else {
        return true;
    }
}
function ValidatePhoneArea(phone_area) {
    var reg = /^[0-9]{4}$/;
    var reg2 = /^[+]{1}[0-9]{2}$/;
    if ((reg.test(phone_area) || reg2.test(phone_area)) == false) {
        return false;
    }
    else {
        $('#ajax_form ul.phone_area').find('li').remove();
        return true;
    }
}
function ValidatePhone(phone) {
    var reg = /^[0-9]{7}$/;
    var reg2 = /^[0-9]{9}$/;
    if ((reg.test(phone) || reg2.test(phone)) == false) {
        return false;
    }
    else {
        $('#ajax_form ul.phone').find('li').remove();
        return true;
    }
}
function ValidateTitle(title) {
    if ((title.length) > 100) {
        return false;
    }
    else {
        return true;
    }
}
function ValidateContent(content_area) {
    if ((content_area.length) > 1000) {
        return false;
    }
    else {
        return true;
    }
}


function validateForm(AForm) {

    var tekst = '';
    if (AForm.name.value == "") {
        $('#ajax_form #name').next('ul').children().remove();
        $('#ajax_form #name').next('ul').append('<li>Wpisz swoje imię i nazwisko</li>').css('display', 'block');
        tekst = "Nieprawidłowe dane";
    }
    else if (AForm.name.value != "") {
        $('#ajax_form #name').next('ul').children().remove();
        if (!ValidateName(AForm.name.value)) {
            $('#ajax_form #name').next('ul').children().remove();
            $('#ajax_form #name').next('ul').append('<li>Wpisz poprawnie swoje imię i nazwisko</li>').css('display', 'block');
            tekst = "Nieprawidłowe dane";

        }
    }


    if (AForm.mail.value == "") {
        $('#ajax_form #mail').next('ul').children().remove();
        $('#ajax_form #mail').next('ul').append('<li>Wpisz swój adres e-mail</li>').css('display', 'block');
        tekst = "Nieprawidłowe dane";
    } else if (AForm.mail.value != "") {
        $('#ajax_form #mail').next('ul').children().remove();
        if (!ValidateEmail(AForm.mail.value)) {
            $('#ajax_form #mail').next('ul').children().remove();
            $('#ajax_form #mail').next('ul').append('<li>Wpisz poprawnie swój adres e-mail</li>').css('display', 'block');
            tekst = "Nieprawidłowe dane";
        }
    }

    if (AForm.phone_area.value == "") {
        $('#ajax_form ul.phone_area').find('li').remove();
        $('#ajax_form ul.phone_area').append('<li>Wpisz numer kierunkowy</li>').css('display', 'block');
        tekst = "Nieprawidłowe dane";
    } else if (AForm.phone_area.value != "") {
        $('#ajax_form ul.phone_area').find('li').remove();
        if (!ValidatePhoneArea(AForm.phone_area.value)) {
            $('#ajax_form ul.phone_area').find('li').remove();
            $('#ajax_form ul.phone_area').append('<li>Poprawny nr. kier. np. +48 lub 0048</li>').css('display', 'block');
            tekst = "Nieprawidłowe dane";
        }
    }


    if (AForm.phone.value == "") {
        $('#ajax_form ul.phone').find('li').remove();
        $('#ajax_form ul.phone').append('<li>Wpisz swój numer telefonu</li>').css('display', 'block');
        tekst = "Nieprawidłowe dane";
    } else if (AForm.phone.value != "") {
        $('#ajax_form ul.phone').find('li').remove();
        if (!ValidatePhone(AForm.phone.value)) {
            $('#ajax_form ul.phone').find('li').remove();
            $('#ajax_form ul.phone').append('<li>Wpisz poprawnie swój numer telefonu</li>').css('display', 'block');
            tekst = "Nieprawidłowe dane";
        }
    }


    if (AForm.title.value == "") {
        $('#ajax_form #title').next('ul').children().remove();
        $('#ajax_form #title').next('ul').append('<li>Wpisz tytuł wiadomości</li>').css('display', 'block');
        tekst = "Nieprawidłowe dane";
    }
    else if (AForm.title.value != "") {
        $('#ajax_form #title').next('ul').children().remove();
        if (!ValidateTitle(AForm.title.value)) {
            $('#ajax_form #title').next('ul').children().remove();
            $('#ajax_form #title').next('ul').append('<li>Tytuł za długi</li>').css('display', 'block');
            tekst = "Nieprawidłowe dane";

        }
    }
    if (AForm.content_area.value == "") {
        $('#ajax_form #content_area').next('ul').children().remove();
        $('#ajax_form #content_area').next('ul').append('<li>Wpisz treść wiadomości</li>').css('display', 'block');
        tekst = "Nieprawidłowe dane";
    }
    else if (AForm.content_area.value != "") {
        $('#ajax_form #content_area').next('ul').children().remove();
        if (!ValidateContent(AForm.content_area.value)) {
            $('#ajax_form #content_area').next('ul').children().remove();
            $('#ajax_form #content_area').next('ul').append('<li>Treść za długa</li>').css('display', 'block');
            tekst = "Nieprawidłowe dane";

        }
    }



    if (tekst != "") {
        return false;
    } else {
        alert('send');
//        return false;
        $(function () {

//            $('#ajax_form').on('click', '.submit', function () {
            var $form = $(this).parents('form');
            var sendData = $form.serialize();
            var action = $form.attr('action');
//                validateForm();

            $.ajax({
                type: "POST",
                url: 'index.php?page=insertContact',
                data: sendData,
                dataType: 'html',
                cache: false,

                success: function (response) {
                    alert(1);
                }
            });
            return false;
        });
//        });

//        return true;
    }


}

更新现在验证和ajax工作（页面没有刷新），但不形成任何帖子。 Meybe我有php的错误..

<?php
    $title = "";
    if (isset($_GET['page']) && $_GET['page'] != ''){
        $page = $_GET['page'];
        switch ($page){
            case 'contact' :
                include "page.php";
                break;
            case 'insertContact':
                $name = $_POST['name'];
                $mail = $_POST['mail'];
                $phone = $_POST['phone'];
                $title = $_POST['title'];
                $content = $_POST['content_area'];
                $lol = $name."\t".$mail."\t".$phone."\t".$title."\t".$content."\n";
                $file = "baza.txt";
                $fp = fopen($file, "a+b");
                flock($fp, 2);
                fwrite($fp, $lol );
                flock($fp, 3);
                fclose($fp);
                mysql_query("insert into pages (pName, pMail, pPhone, pTitle, pContent) values ( '$name', '$mail', '$phone', '$title', '$content')");
                header("Location: index.php");
                break;
     }
    } else {
        include "page.php";
    }
?>

正确答案

1。 John S的帖子是正确的

2。我更正：

if (tekst != "") {
return false;
} else {
return true;
}

Tnx求助：）

Answer 1

首先，不要在表单的提交按钮上添加点击处理程序。而是向表单添加一个on-submit处理程序。其次，请勿在{{1}}函数内执行此操作。

将以下代码放在<{1}}函数之外：

validateForm()

您还必须这样做，以便validateForm()函数返回$(function() { $('#ajax_form').submit(function(e) { e.preventDefault(); var $form = $(this); if (validateForm($form[0])) { $.ajax('index.php?page=insertContact', { type: 'POST', data: $form.serialize(), dataType: 'html', cache: false, success: function(html) { alert('Response: ' + html); } }); } }); }或validateForm()，具体取决于表单是否有效。

使用ajax验证onsubmit并保存表单 - 重要

正确答案

1 个答案: