0

我正在使用 jquery 验证器插件,并且正在尝试使用 AJAX 对其进行第一次尝试。

现在,我有以下 HTML 代码:

            <div class="grid_12" id="info">
        </div>


        <div class="grid_12">
            <div class="block-border">
                <div class="block-header">
                    <h1>Inserir nova página</h1><span></span>
                </div>
                <form id="formulario" class="block-content form" action="<?=$_SERVER['PHP_SELF'];?>" method="post">
                    <div class="_100">
                        <p><label for="textfield">Nome da página</label><input id="page_name" name="textfield" class="required text" type="text" value="" /></p>
                    </div>

                    <div class="_100">
                        <p><label for="textarea">Conteúdo da página</label><textarea id="page_content" name="textarea" class="required uniform" rows="5" cols="40"></textarea></p>
                    </div>
                    <div class="block-actions">
                        <ul class="actions-left">
                            <li><a class="button red" id="reset-validate-form" href="javascript:void(0);">Limpar</a></li>
                        </ul>
                        <ul class="actions-right">
                            <li><input type="submit" class="button" name="send" value="Inserir"></li>
                        </ul>
                    </div>

还有我的 JS 代码:

  <script type="text/javascript">
$().ready(function() {

    /*
     * Form Validation
     */
    $.validator.setDefaults({
        submitHandler: function(e) {
            $.jGrowl("Ação executada com sucesso.", { theme: 'success' });
            $(e).parent().parent().fadeOut();


            /*
             * Ajax
             */
            var mypostrequest=new ajaxRequest();
            mypostrequest.onreadystatechange=function(){
             if (mypostrequest.readyState==4){
              if (mypostrequest.status==200 || window.location.href.indexOf("http")==-1){
               document.getElementById("info").innerHTML=mypostrequest.responseText;
              }
              else{
               alert("An error has occured making the request")
              }
             }
            }
            var page_name=encodeURIComponent(document.getElementById("page_name").value);
            var page_content=encodeURIComponent(document.getElementById("page_content").value);
            var parameters="page_name="+page_name+"&page_content="+page_content;
            mypostrequest.open("POST", "ajax/inserir_utilizador.php", true);
            mypostrequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
            mypostrequest.send(parameters);




            v.resetForm();
            v2.resetForm();
            v3.resetForm();

            return false;
        }
    });
    var v = $("#create-user-form").validate();
    jQuery("#reset").click(function() { v.resetForm(); $.jGrowl("User was not created!", { theme: 'error' }); });

    var v2 = $("#write-message-form").validate();
    jQuery("#reset2").click(function() { v2.resetForm(); $.jGrowl("Message was not sent.", { theme: 'error' }); });

    var v3 = $("#create-folder-form").validate();
    jQuery("#reset3").click(function() { v3.resetForm(); $.jGrowl("Folder was not created!", { theme: 'error' }); });

    var formulario = $("#formulario").validate();
    jQuery("#reset-validate-form").click(function() { formulario.resetForm(); $.jGrowl("O formulário foi limpo!", { theme: 'information' }); });
    });

我有一个 div #info,其中没有任何内容,我试图将 ajax 的结果放在那里。

我的 ajax 文件只是试图回显 POST 值:

<?php
$page_name=$_POST["page_name"];
$page_content=$_POST["page_content"];

echo $page_name."<br />";
echo $page_content;
?> 

但这真的行不通。它真的没有做任何事情,或者如果有,它会刷新页面。

我错过了什么?

问候和感谢!

4

1 回答 1

0

我建议您使用$.ajax()or $.post()
它更容易,你的头痛肯定会消失。

$.ajax({
  type: 'POST',
  url: 'url to post',
  data: data,
  success: function(data, status) {
    //callback for success
  },
  error: error, //callback for failure
  dataType: "json" //or "html" etc
});

这里有很多例子:http: //api.jquery.com/jQuery.post/
http://api.jquery.com/jQuery.ajax/

于 2012-04-25T04:20:58.800 回答