0

選択リストにユーザー入力からの新しいオプションを入力するにはどうすればよいですか?

これまでの私のJSは次のとおりです。

<script type="text/javascript">
function show_prompt() {
    var name = prompt('Please enter new origin');
    if (name != null && name != "") {
      var select = document.getElementById("OriginSelect");
      select.options[select.options.length] = new Option('Text 1', 'Value1');
    }
}

以下は、本文の下にあるHTML\Coldfusionです。

<p class="_30NP" align="right">
                                <label>Origin&nbsp;</label>
                            </p>

                            <p class="_20NP">
                              <cfselect  name="OriginSelect" id="OriginSelect" query="Origin" display="description" value="code"  required="yes">
                              <option id="new" value="new" onClick="show_prompt()">New Origin</option>
                              </cfselect>
                            </p>

                            <a href="#" onClick="show_prompt()">New Origin</a>

したがって、基本的に、リストはデータベースから入力されますが、使用可能な適切なOriginがない場合、ユーザーはhrefをクリックすると、テキストフィールドを含むプロンプトボックスが表示されます(これは問題なく機能します)。次に、ユーザーは好きなものを入力して、JSスクリプトがタグに新しい要素を追加します。

ただし、ユーザーがテキストを入力して[OK]を実行したときに[OK]を押した後は、何も実行されません。Chromeのjavascriptデバッガーには、有用なものは何も表示されません。エラーのフラグも表示されません。

それがcfselectであるという事実は問題ですか?手動でオプションを追加しました(id = "new")。正常に表示されます。

編集:わかりました、それはcfselectのせいではありません。通常の選択ボックスにしましたが、それでも機能しません。

4

1 に答える 1

0

使用appendChild機能

function show_prompt() {
    var name = prompt('Please enter new origin');
    if (name != null && name != "") {
      var select = document.getElementById("OriginSelect");
      var option = new Option(name);
      select.appendChild(option);
    }
}
于 2013-03-05T20:49:58.357 に答える