2011-01-11 11 views
0

私は、ユーザーが探しているものに基づいてデータベースを検索して同じ結果を返すページで作業をしていますページ。私はjQueryを使ってページからものを消す方法を知っていますが、AJAXを使ってそれらをページに追加する方法を知りたいと思います。データベースを検索し、返されたクエリをjQueryとAJAXを使用してページにロードします。

私が求めているのは不足しています。私はDBにクエリを行い、結果をページをリロードすることなくウェブサイトにポップアップさせたいと思います。

以下の回答は本当に私の質問に答えていないので、例を挙げてより詳細な質問をします。

<input type="textbox" id="name" name="name" /> 
    <input type="button" id="search" name="search" value="Search the Database" /> <br/><br/> 
    <label class="userinfo">First Name: </label><input type="text" class="userinfo" id="first" name="first" /> <br/> 
    <label class="userinfo">Last Name: </label><input type="text" class="userinfo" id="last" name="last" /> <br/> 
    <label class="userinfo">Username: </label><input type="text" class="userinfo" id="uname" name="uname" /> <br/> 
    <label class="userinfo">E-Mail: </label><input type="text" class="userinfo" id="email" name="email" /> <br/> 
    <label class="userinfo">Admin Status: </label><input type="text" class="userinfo" id="admin" name="admin" /> <br/> 

私は最初のテキストボックスに基づいてデータベースを検索することで何が起こるか、AJAXは、検索ボタンが押されたとき、それは別のページに移動し、DBに問い合わせを行います発生します。これらの結果を元のページに戻して、下のテキストボックスに入力するにはどうすればよいですか?以下のテキストボックスは、検索ボタンがクリックされるまで隠されています。だから私は1つの変数を送信し、複数の変数を取得する必要があります。それはあなたが私をもっと助けてくれるのに役立ちますかここで

答えて

0

はアヤックス+ htmlの追加のサンプルです:

<html> 
     <head> 
     <script type="text/javascript"> 

     $(function() { 

     $('.go-right').click(function(){ 

      $.ajax({ 

         type: "POST", 
         url: "process_thumbs.html", 
         data: "showposts=25", 
         success: function(html){ 
          $("#output").html(html); 
         } 

      }); 
     }); 

      }); 

     </script> 

     </head> 
     <body > 


     <div id="output"></div> 

     <a class="go-right">RIGHT</a> 

     </body> 
     </html> 

もちろんの「process_thumbs.html」クエリの結果を返す動的なページです。

関連する問題