横にラジオ ボタンを表示する動的に作成されたリストがあります。ラジオボタンが変更されたときに、動的に作成されたリストと変更されたラジオボタンの横にドロップダウンリストが表示されるようにします。基本的に、ボタンをはい (表示) に変更すると、その横にドロップダウン リストが表示されます。リスト内の項目の数と、どの項目がはいに設定されているかに応じて、位置を設定するように見えるドロップダウン リスト (動的に作成された各ドロップダウン リストに 8 つの同じ固定オプションがあります)。
これまでのところ、jquery で onchange イベントを作成し、事前に作成されたドロップダウン リストを「再表示」するだけです。コードは正常に動作しますが、必要なものではありません。以下にコードと画像を掲載します。
//K's function:
function get_all_pages() {
global $connection;
$query = "SELECT *
FROM pages ";
$query .= "WHERE visible = 1 ";
$query .= "ORDER BY position ASC";
$page_set = mysql_query($query, $connection);
confirm_query($page_set);
return $page_set;
}
//K's function:
function list_all_pages(){
$output = "<ul>";
$page_set = get_all_pages();
while ($page = mysql_fetch_array($page_set)) {
$output .= "<li><a href=\"add_feature.php?page=" . urlencode($page["id"]) . "\">{$page["menu_name"]}</a></li>";
$output .= " <input type=\"radio\" class=\"unchecked\" onclick=\"uncheck()\" name=\"visible_{$page["id"]} \" value=\"0\" checked=\"checked\" /> No <input type=\"radio\" class=\"checked\" onclick=\"check()\" name=\"visible_{$page["id"]} \"value=\"1\" /> Yes";
}
$output .= "</ul>";
return $output;
}
---------- jquery
<script type="text/javascript">
$(document).ready(function() {
//alert("document ready");
$('#position').hide();
});
$('.checked').change(function() {
$('#position').show();
});
$('.unchecked').change(function() {
$('#position').hide();
});
</script>
--------- html (not what is wanted but the only thing I've got going right now....
<form>
<?php echo list_all_pages(); ?>
<div id="position">
<select name="position">
var count;
for (count=1; count <= 8; count++) {
<option value='count'>count</option>;
}
</select>
</div>
</form>
8 月 27 日の新しい情報 jfiddle での redrazor11 のヘルプのおかげで、半分は機能しています... PHP ループの JavaScript onchange は機能していますが、最初の 1 つだけ<li>
です... 実際、他の<li>
ラジオ ボタンをクリックすると、ドロップダウン メニューが表示されます時々最初<li>
に再び表示されます...コードと新しい写真は以下に掲載されています:
//K's function:
function list_all_pages(){
$output = "<ul>";
$page_set = get_all_pages();
while ($page = mysql_fetch_array($page_set)) {
$output .= "<li><a href=\"add_feature.php?page=" . urlencode($page["id"]) . "\">{$page["menu_name"]}</a></li>";
$output .= " <input onchange=\"javascript:document.getElementById(1).style.display = 'block';\" type=\"radio\" name=\"visible_{$page["id"]} \" value=\"0\" checked=\"checked\" /> No <input onchange=\"javascript:document.getElementById(1).style.display = 'none';\" type=\"radio\" name=\"visible_{$page["id"]} \"value=\"1\" /> Yes";
$output .= "<div id='1' style='display: none'><select name='position'><option value='count'>1</option><option value='count'>2</option><option value='count'>3</option></select></div>";
}
$output .= "</ul>";
return $output;
}
9 月 2 日の編集: ID として $counter を試し、次に $page[id] を使用してみましたが、どちらも div を各 li に表示するという点で機能する結果を返しました... しかし、問題があるようですonclick javascript が正しく動作している... redrazor11 または誰かが見て、onclick で発生しているこの奇妙な動作を理解できる場合は、リンクを投稿しますか? リンク:
http://www.firetreegraphics.com/widget_corp-final/add_feature.php
最近変更されたコードは次のとおりです。
//K's function:
function list_all_pages(){
$output = "<ul>";
//$output .= $counter = 0;
$page_set = get_all_pages();
while ($page = mysql_fetch_array($page_set)) {
$output .= "<li><a href=\"add_feature.php?page=" . urlencode($page["id"]) . "\">{$page["menu_name"]}</a></li>";
$output .= " <div id=\"$page[id]\" style='display: none'><select name='position'><option value='count'>1</option><option value='count'>2</option><option value='count'>3</option></select></div>";
$output .= " <input onchange=\"javascript:document.getElementById('$page[id]').style.display = 'block';\" type=\"radio\" name=\"visible_{$page["id"]} \" value=\"0\" checked=\"checked\" /> No <input onchange=\"javascript:document.getElementById('$page[id]').style.display = 'none';\" type=\"radio\" name=\"visible_{$page["id"]} \"value=\"1\" /> Yes";
//$output .= $counter = $counter+1;
}
$output .= "</ul>";
return $output;
}