-1

このポップアップajaxフォームがあり、データを送信して同じページにとどまる代わりに、データを送信しますが、フォームからファイルsend.phpに移動します。何故ですか？ほぼ同じフォームを別のサイトに正しく実装しました。ここで何が間違っているのかわかりません...

形：

<form id="form" action="send.php"  name="form" method="post" >

    <input type="text"  id="name" name="name" value="" /><br />

    <input type="text"  id="email" name="email" value=""  /><br />

    <textarea name="message" cols="4" rows="4"  id="message" ></textarea><br />

    <input type="submit" value="" id="submit" title="Send!"/>

</form>

ajax：

<script type="text/javascript">

$(document).ready(function () {
    $('#form').ajaxForm({
        beforeSubmit: validate
    });

    function validate(formData, jqForm, options) {
        var name = $('input[name=name]').fieldValue();
        var email = $('input[name=email]').fieldValue();
        var message = $('textarea[name=message]').fieldValue();

        if (!name[0]) {
            alert('Please enter a value for name');
            return false;
        }
        if (!email[0]) {
            alert('Please enter a value for email');
            return false;
        }
        if (!message[0]) {
            alert('Please enter a value for message');
            return false;
        }

        else {

        $("#prima_form").fadeOut(1000, function () {
            $(this).html("<img src='images/de_multumire.png'/>").fadeIn(2000);
        });

        var message = $('textarea[name=message]').val('');
        var name = $('input[name=name]').val('');
        var email = $('input[name=email]').val('');

} 
}

});

</script>

send.php：

<?php
        if($_POST){
                $email = $_POST['email'];
                $name = $_POST ['name'];
                $message = $_POST ['message'];
                // response hash
                $ajaxresponse = array('type'=>'', 'message'=>'');

                try {
                        // do some sort of data validations, very simple example below
                        $all_fields = array('name', 'email', 'message');

                        foreach($all_fields as $field){
                                if(empty($_POST[$field])){
                                        throw new Exception('Required field "'.ucfirst($field).'" missing input.');
                                }
                        }

                        // ok, if field validations are ok
                        // now Send Email, ect.

                        // let's assume everything is ok, setup successful response
                        $subject = "New Contact";
                        //get todays date
                        $todayis = date("l, F j, Y, g:i a") ;

                        $message = " $todayis \n
                        Attention: \n\n
                        Please see the message below: \n\n
                        Email Address: $email \n\n
                        Message: $message \n\n

                        ";

                        $from = "From: $email\r\n";


                        //put your email address here
                        mail("contact@xxx.ro", $subject, $message, $from);

                        //prep json response
                        $ajaxresponse['type'] = 'success';
                        $ajaxresponse['message'] = 'Thank You! Will be in touch soon';  
                } catch(Exception $e){
                        $ajaxresponse['type'] = 'error';
                        $ajaxresponse['message'] = $e->getMessage();
                }
                // now we are ready to turn this hash into JSON
                print json_encode($ajaxresponse);
                exit;
        }
?>

私のjsコンソールはこれを提供します：

[17:38:03.840] [cycle] terminating; zero elements found by selector @ http://sociallab.ro/js/jquery_003.js:10
--
[17:38:16.012] POST http://sociallab.ro/send.php [HTTP/1.1 200 OK 218ms]

[17:38:16.204] The character encoding of the HTML document was not declared. The document will render with garbled text in some browser configurations if the document contains characters from outside the US-ASCII range. The character encoding of the page must to be declared in the document or in the transfer protocol. @ http://sociallab.ro/send.php

ありがとう！

4

3 に答える 3

1

これを追加してみてください：

$('#submit').click(function(){ return false; /* stop html form from submitting*/ })

jqueryがajaxを介してフォームデータを送信していると思いますが、デフォルトの「送信」ボタンが通常のようにhtmlフォームを送信するのを止めていません。上記のコードを追加すると、送信ボタンのデフォルトアクション（send.phpへのフォームの送信）が停止し、現在のページが表示されたままになります。

于 2012-10-01T15:06:20.200 に答える
1

純粋なJavascriptでは、次のようなことを行う必要があります。

function sendWithAjax() {
    var ajax = new XMLHttpRequest();
    ajax.open("POST", "send.php", true);

次に、入力要素から値を読み取ります。

    var email = document.getElementById('email').value;
    var name = document.getElementById('name').value;
    var message = document.getElementById('message').value;

.send（）を呼び出す前に、ここでフォームを検証できます。

（escape（）関数を使用してフォーム要素の内容をエスケープする必要がある場合があります）

そして、それらをsendメソッドに入れます。

    ajax.send("email="+ email +"&name="+ name +"&message="+ message);

また、フォームコードから完全なフォームタグを削除します。したがって、送信ボタンは必要ないので、単純なボタンに変更します。

<input type="text"  id="name" name="name" value="" /><br />
<input type="text"  id="email" name="email" value=""  /><br />
<textarea name="message" cols="4" rows="4"  id="message" ></textarea><br />
<input type="submit" value="" id="submit" title="Send!" onclick="javascript:sendWithAjax()"/>

ajax応答を取得するには、次を使用します。

    var response = ajax.responseText;
}
于 2012-10-01T14:50:45.283 に答える
0

Something like:

   $(document).ready(function(event){
        event.preventDefault();
        $('#FORMID').ajaxForm({
            type: 'POST',
            dataType: 'json',
            beforeSubmit: function(){
            },
            success: function(resp){

            },
            error: function(resp){

            }
        });
    });

Hope this will help.

于 2014-01-26T13:45:58.400 に答える