2

次のようなドロップダウンリストがあります。

<select name="school"><option value="None" selected>None</option>
<option value="DeSoto">DeSoto</option>
<option value="Hillsboro">Hillsboro</option>
<option value="Grandview">Grandview</option>
<option value="Festus">Festus</option>
<option value="R-7">R-7</option>
<option value="Home-Schooled">Home-Schooled</option>

データベースに入力されている連絡先がドロップダウンリストにリストされていない学区に住んでいる場合、データ入力担当者はデータベースに学校を追加する必要があります。エンドユーザーが学校名を入力できるように、リストの最後に選択を追加するにはどうすればよいですか。

PHPコードを処理してエントリを処理できます。ドロップダウンリストをユーザー入力フィールドに変換する方法、またはその他の解決策についてのアイデアが必要です。助けてくれてありがとう!

4

5 に答える 5

4

コンボボックスを使用できます:入力+ドロップダウンリスト。

http://javascript.about.com/library/blcombo.htm

デモ: http: //jsfiddle.net/P39W5/

または、入力ボックスを動的に追加できます。

http://jsfiddle.net/EMEVL/

JS:

$(document).ready(function() {
    $('#newSchool').hide();
    $("#schoolContainer").change(function() {
        var val = $(this).val();      
        if (val == 'Other School') {
            $('#newSchool').show();
        } else {
            $('#newSchool').hide();
        }
    }).change();
});

HTML:

School: <select name="school" id="schoolContainer">
    <option value="None" selected>None</option>
    <option value="DeSoto">DeSoto</option>
    <option value="Hillsboro">Hillsboro</option>
    <option value="Grandview">Grandview</option>
    <option value="Festus">Festus</option>
    <option value="R-7">R-7</option>
    <option value="Home-Schooled">Home-Schooled</option>
    <option value="Other School">Other School</option>
</select>

    <input type="text" id="newSchool"/>
    <input type="button" id="otherschool" value="Insert"/>
于 2012-08-31T23:18:34.790 に答える
1

jQueryは次のことに役立ちます。

$("select[name='school']").change(function() {
    var val = $(this).val();
    if(val == 'notlisted') {
        $('input[name="otherschool"]').show();
    } else {
        $('input[name="otherschool"]').hide();
    }
}).change();

そしてHTMLで

<input type="text" name="otherschool" style="display:none" />
于 2012-08-31T23:16:53.980 に答える
0

値otherで別のフィールドを追加<option>します。ユーザーがそれを選択すると、入力ボックスに学校名を入力できます。

于 2012-08-31T23:16:17.227 に答える
0

このドロップダウンの横に追加ボタンがありませんか?ドロップダウンの最後にエントリがあるのは直感的ではないようです。ユーザーとして、私はドロップダウンを展開することすらしません。現在の値をスクロールするだけです。

于 2012-08-31T23:17:07.497 に答える
0

ここにそのようなものがあります:

$(document).ready(function(){

    $("#addSchool").click(function(){
    $("#schoolContainer").append('<option value="' + $("#newSchool").val() + '">' + $("#newSchool").val() + '</option>');
    });

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<select name="school" id="schoolContainer">
    <option value="None" selected>None</option>
    <option value="DeSoto">DeSoto</option>
    <option value="Hillsboro">Hillsboro</option>
    <option value="Grandview">Grandview</option>
    <option value="Festus">Festus</option>
    <option value="R-7">R-7</option>
    <option value="Home-Schooled">Home-Schooled</option>
</select>
    
    <input type="text" id="newSchool"/>
    <input type="button" id="addSchool" value="Insert"/>

http://jsfiddle.net/damian_silvera/NcpKp/

于 2012-08-31T23:26:02.753 に答える