2012-04-25 109 views
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文件只是想呼應POST值:

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

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

但它確實不起作用。它確實沒有做任何事情,或者如果有,它會刷新頁面。

我錯過了什麼?

謝謝!

+5

爲什麼不使用jQuery的阿賈克斯? – 2012-04-25 04:11:13

回答

0

我建議您使用$.ajax()$.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/

+0

非常感謝!我已經實現了$ .post,現在它正在工作。謝謝! – 2012-04-25 18:56:45