2013-08-02 11 views
5

私は、3つのメインフィールドといくつかの追加フィールドでフォームを作成しています。主なフィールドの1つは選択タイプであり、いくつかの追加フィールドも選択されます。すべての選択フィールドの値は、データベースに接続されている.phpファイルに含まれています。私の目標は、追加のフィールドにメインの選択フィールドの選択に関連する値のみを表示させることです。私がそれを見る方法は、メインの選択のonClickです。私は同じページに新しい値を送信し、メインのdivの内容をリフレッシュするajaxでjavascript関数を呼び出します(すべてのPHPインクルードファイル新しいパラメータと必要な値を示している)リフレッシュphpの内容onchange <select>

body 
    div id=container 
    div id=menu 
    div id=main 

私はアヤックスについて知っていることすべてが異なるPHPページに変数を送信し、エコー応答を取得する方法です。誰かが特定のdivをリフレッシュしながら同じページのphp変数の値を送信/変更する方法を説明することはできますか? (または誰かが私の問題に対してより良い解決策を知っているかもしれません)。あなたの時間をありがとう!

+0

JQueryは許可されていますか? – McGarnagle

+0

はい可です – user2644185

答えて

8

さんが言ってみましょう、あなたのメインのこのようなものです選択:

<select id="main_select"> 
    <option value="car">Cars</option> 
    <!-- other options --> 
</select> 

そして、あなたはあなたがPHPファイルを持っている

<div id="details"> 
    <!-- the details options will be added here --> 
</div> 

選択したオプションに基づいて詳細情報を表示するようになっているコンテナを持っています選択したオプションに基づいて詳細をエコーする

<?php 
$mainOption = $_POST['option']; 
details($mainOption); 

function details($opt) 
{ 
    if($opt == 'car') 
     echo '<select class="detail_select"> 
       <option value="bmw">BMW</option> 
       <option value="ferrari">Ferrari</option> 
       <option value="porsche">Porsche</option> 
      </select>'; 
    else if($opt == 'another_option') 
    { 
     echo 'other details'; 
    } 
} 
?> 

あなたのAjaxはsomこのようなもの:

$(document).ready(function() { 
    $('#main_select').change(function(){ 
     $.ajax({ 
      url: "something.php", 
      type: "post", 
      data: {option: $(this).find("option:selected").val()}, 
      success: function(data){ 
       //adds the echoed response to our container 
       $("#details").html(data); 
      } 
     }); 
    }); 
}); 
+0

ありがとうございます! – user2644185

関連する問題