2012-04-25 16 views
0

私はjqueryバリデータプラグインを使用しています。私はAJAXで最初の試みをしようとしています。Ajaxが起動されていませんか?

  <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を持って

は今、私は、次のHTMLコードを持っていますそこにアヤックスの結果を入れようとしています。

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

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

しかし、それは実際に動作しません:

私のAjaxのファイルは、単にPOST値をエコーし​​ようとしています。それは本当に何もしませんし、そうであればページを更新します。

私には何が欠けていますか?

よろしくお願いいたします。

+5

? –

答えて

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 
}); 

多くの例:AJAXのためのjQueryを使用しない理由
http://api.jquery.com/jQuery.post/
http://api.jquery.com/jQuery.ajax/

+0

ありがとうございました!私は$ .postを実装しましたが、今は動作しています。ありがとう! –

関連する問題