-1

アイデアを得るために、最初にクライアント サイトを参照してください。

上記のサイトでは、右側にギフトファインダー ボックスがあります。セレクトボックスは3つ。現在、これらの 3 つの選択ボックスに 3 つのフォームを使用しています。つまり、各ドロップダウン選択ボックスがフォームに埋め込まれています。最初のドロップダウン選択ボックスを選択すると、1 つが選択され、2 番目の選択ボックスの値は、最初の選択ボックスから選択された値が決定されます。したがって、男性を選択すると、男性に関連するすべての機会が秒単位のドロップダウン選択ボックスに表示されます。その正常に動作します。

しかし問題は、最初のドロップダウン ボックスを選択するたびに更新されることです。

ページを更新したくありません。秒の選択ボックスが関連する値を決定できるように、値を選択して値を渡す必要があります。

だから私は私たちにajaxを考えています。しかし、成功しません。

そのため、最初のドロップダウン選択ボックスのコードをいくつか含めました。

これは、html と php とワードプレスの混合です。

<div class="select-one">

 <form id="searrec" method="post" action="">
    <select name="selectionRecipient" id="selectionRecipient" onchange="this.form.submit();"> 

            <?php 
                    $results_rec = get_option('current_recipient');
                    if(isset($_POST['selectionRecipient'])){
                        $results_rec = $_POST['selectionRecipient'];
                        update_option('current_recipient', $results_rec);
                        $results_rec = get_option('current_recipient');
                    }
            ?>
        <?php 
        //asort($result_rec);
        $t_name_arr = array();

        foreach($result_rec as $rec):
                $t_id = $rec->term_id;
                $term = get_term($t_id , 'category' );
                $t_name_arr[] = $term->name;
        endforeach;

        //print_r($t_name_arr);

        rsort($t_name_arr);

        foreach ($t_name_arr as $t_name):?><option class="rec_val"<?php if($results_rec==$t_name){ echo 'selected="selected"';}?>value="<?php echo $t_name;?>"><?php echo $t_name;?></option>
      <?php endforeach;?>

      </select> 
    <input type="hidden" id="submitrec" value="Search" />
    </form> -->

</div>

そのため、フォーム メソッド post を使用して、選択した値を取得して変数$_POSTに渡しています。$results_rec

コードの後半で、Man などに関連する特定の項目をif.. else決定して表示するために使用しています。if $results_rec =='Man'

だから私が望むのは、最初のドロップダウン選択ボックスからアイテムを選択している間、ページを更新しないことです。

助けてください。

4

7 に答える 7

1

これを変える：

<select name="selectionRecipient" id="selectionRecipient" onchange="this.form.submit();">

これに：

<select name="selectionRecipient" id="selectionRecipient">

そしてjquery：

$("#searrec").submit(function(e) {
   e.preventDefault();

   // your code

   return false;
});

編集:

これを使用して、選択したインデックス (数値) を取得します

var index = $("#selectionRecipient")[0].selectedIndex;

または値:

var value = $("#selectionRecipient")[0].value;

次に、おそらくajaxを呼び出すことができます：（他の選択ボックスに「id = other_select」があると仮定します

$.ajax({url:"index.php",type:"POST",data {type:"populate",index:2,value:"option1"},dataType:"json",
   success: function(data) {
      // data (json) returned from server so populate other selection boxes with that..
  // in this example 'data' is an array, coming directly from server (see below the .php)   
      $("#other_select")[0].selectedIndex = 0;
  for(var x in data) {
     $("#other_select")[0].options[x] = new Option(data[x]);
  }
   }
})

あなたの.phpでは、リスト（データベースなど）を取得して、他の選択リスト（クライアント内）に入力すると仮定します。このコードは次のようになります。

if (isset($_POST["type"]) && $_POST["type"]=="populate") {
   echo json_encode(array("option1","option2","option3"));
   exit(1);
}
于 2012-06-15T15:41:54.067 に答える
0

みんなその修正。

Plzはhttp://giftideasitems.com/をご覧ください。

ギフトファインダーボックスを見て、それがどのように機能するかを見てください。

私はiframeを使用してフォームを埋め込み、そこにコーディングをドロップダウンしました。それでおしまい。

onchange = "this.form.submit（）"を使用し、ページが参照されていなくても、実際にはページが更新されます....ただし、メインページではなく、iframeのみが更新されます。これは問題ありません。これはまさに私が欲しかったものです。

<div id="gift-finder">
<div class="gift-finder-form">

            <iframe name="inlineframe" src="code.php" frameborder="0" 
                    scrolling="auto" width="200" height="180" 
                    marginwidth="0" marginheight="0" id="gift-iframe">
            </iframe>

</div>

これは私のiframeコードであり、srcを参照してください。code.phpを使用しました。したがって、すべてのコードは別々の場所にあります。

私はいくつかのcssを変更しなければなりませんでしたが、とにかくこれは問題ありません。

昨日貢献してくれた皆さん、ありがとうございました。

于 2012-06-16T10:31:27.023 に答える
0 
$('#searrec').submit(function () {
 //do some form submit work here
 return false;
});
于 2012-06-15T15:25:19.800 に答える
0

ページをリロードせずに、最初のボックスで選択した内容に基づいて、AJAX 呼び出しを使用して他の選択ボックスを設定する必要があります。

jQuery の AJAX 機能を調べてみることをお勧めします。読んでください$.ajax-$.post最初のリストボックスで選択した値をPHPスクリプトに送信し、その値に基づいて戻り、他の選択ボックスに入力できます。

于 2012-06-15T15:30:21.137 に答える
0

AJAX を使用して、ページを更新せずに他の選択を更新します。jQuery を使用して AJAX を簡単にします。

この質問が役に立ちます: ドロップダウン リストの選択された値を jQuery で変更する

于 2012-06-15T15:31:19.093 に答える
0

event onchange="this.form.submit();をコンボボックスから削除する必要があります

jquery で ajax を使用します。

$("#searrec").onchange(function() {
    $.ajax({
        url:"",
        success:function(response){
            alert("success");
        }
    });
});
于 2012-06-15T15:56:23.710 に答える
0 
$('#searrec').submit(function(e){

    e.preventDefault();

});
于 2012-06-15T15:40:29.217 に答える