0

私は以下を持っています、それは動的に新しい値オプションを選択ボックスに追加します。私が抱えている問題は、選択ボックスに新しいオプションを追加する前に、重複するエントリをチェックしないことです。コードに変更を加えて、重複するエントリが見つかったことをユーザーに警告し、同じオプション値の追加を停止する方法はありますか？

function refadd() {

var val = document.getElementById('docsref').value

    if (val != "") {

        var select = document.getElementById('docsref_list');

        var option = document.createElement('option');

        option.text = value

        select.add(option,select.option)

        select.selectedIndex = select.options.length - 1;
    }

}
4

2 に答える 2

1

最善の方法は、既存のすべてのオプションをループして、一致するものがあるかどうかを確認することです。
ループが追加されるため、IF条件の前に表示されます。
一致するものが見つかった場合は、ユーザーに通知して（たとえば、alert）、「return」ステートメントを実行できます。

以下のようなもの：

function refadd() 
{
    var value = document.getElementById('docsref').value
    if (value != "") 
    {
        var select = document.getElementById('docsref_list');
        var option = document.createElement('option');
        var flag = 0;
        for(var i = 0; i < select.length; i++)
        {
        if(select[i].value == value)
        {   
            flag = 1;
        }
        }
        if(flag == 1)
        {
        alert('Value is duplicate.');
        }
        else
        {
        option.text = value;
        select.add(option,select.option);
        select.selectedIndex = select.options.length - 1;
        }

    }
}

HTMLが次のような場合：

<div>
    <input type = "text" name = "docsref" id = "docsref" style = "width:100px;"/>
    <input type = "button" name = "addValues" id = "addValues" value = "AddValues" onClick = "refadd();"/>
    </br>
    <select id = "docsref_list">
    <option value = "1">1</option>
    <option value = "2">2</option>
    </select>
</div>

お役に立てば幸い

于 2013-03-05T15:28:09.763 に答える
0 
using jQuery...

    function refadd() {    
    var val = $("#docsref").val();
        if (val != "") {
    for(var i = 0; i < select.length; i++)
        {
        if(select[i].value == value)
        {   
            alert("can't add.");
            return false;
        }
        }
        var ob = new Option("option text", "value");
        $(ob).html("option text");
        $("#selectList").append(ob);
        }
    }
于 2013-03-05T15:34:27.283 に答える