前提・実現したいこと
PHPとhtmlで作成されている入力フォームのプルダウンをjavascriptを用いて、プルダウン同士を連動させたいです。
プルダウンが1つずつであれば問題なく動くのですが、連動させるプルダウンを複数とした場合、どのようにしたらいいかご教示いただけないでしょうか。よろしくお願いいたします。
該当のソースコード
このようにプルダウンが1つずつであれば動くのですが、このプルダウンを複数作成し連動させたいです。
php
1<?php 2 echo(" 3 <body> 4 <form name=\"formName\" method=\"post\"> 5 <select name = \"selectName1\" onChange=\"functionName()\"> 6 <option value = \"果物\">くだもの</option> 7 <option value = \"野菜\">やさい</option> 8 </select> 9 10 <select name = \"selectName2\"> 11 </select> 12 13 <script type = \"text/javascript\"> 14 function functionName(){ 15 var select1 = document.forms.formName.selectName1; 16 var select2 = document.forms.formName.selectName2; 17 select2.options.length = 0; 18 if (select1.options[select1.selectedIndex].value == \"果物\"){ 19 select2.options[0] = new Option(\"りんご\"); 20 select2.options[1] = new Option(\"みかん\"); 21 select2.options[2] = new Option(\"オレンジ\"); 22 } 23 else if (select1.options[select1.selectedIndex].value == \"野菜\"){ 24 select2.options[0] = new Option(\"キャベツ\"); 25 select2.options[1] = new Option(\"きゅうり\"); 26 select2.options[2] = new Option(\"にんんじん\"); 27 select2.options[3] = new Option(\"たまねぎ\"); 28 } 29 } 30 </script> 31 </body> 32 ") 33?>
試したこと
htmlはfor文で複数作成し、それをjavascriptで連動させることを考えてますが、以下の方法はダメでした。どのようにしたらいいのでしょうか。
php
1<?php 2 echo(" 3 <body> 4 <form name=\"formName\" method=\"post\"> 5 "); 6 7for($ix=0;$ix<11;$ix=$ix+1){ 8 echo(" 9 <select name=\"selectName1[$ix]\" onChange=\"functionName()\"> 10 <option value=\"果物\">くだもの</option> 11 <option value=\"野菜\">やさい</option> 12 </select> 13 14 <select name=\"selectName2[$ix]\"> 15 </select> 16 "); 17} 18 19for($ix=0;$ix<11;$ix=$ix+1){ 20echo(" 21 <script type=\"text/javascript\"> 22 function functionName(){ 23 var select1=document.forms.formName.selectName1[$ix]; 24 var select2=document.forms.formName.selectName2[$ix]; 25 select2.options.length=0; 26 if(select1.options[select1.selectedIndex].value == \"果物\"){ 27 select2.options[0] = new Option(\"りんご\"); 28 select2.options[1] = new Option(\"みかん\"); 29 select2.options[2] = new Option(\"オレンジ\"); 30 } 31 else if(select1.options[select1.selectedIndex].value == \"野菜\"){ 32 select2.options[0] = new Option(\"キャベツ\"); 33 select2.options[1] = new Option(\"きゅうり\"); 34 select2.options[2] = new Option(\"ニンジン\"); 35 select2.options[3] = new Option(\"たまねぎ\"); 36 } 37 } 38 </script> 39"); 40} 41 42echo(" 43 </body> 44"); 45?>
補足情報(FW/ツールのバージョンなど)
htmlはfor文で複数作成を想定しております。phpのバージョンは5.6です。(サポートは切れてます?がもう少しこのバージョンを使用予定です)
回答3件
あなたの回答
tips
プレビュー