0

チェックリストボックス内を検索したい。ユーザーがテキストフィールドにテキストを入力すると、そのような項目がチェックボックスリストに存在する場合、それが選択されます。

HTML:

<asp:TextBox ID="TextBox1" runat="server" OnTextChanged= "return SearchList();"/>
<asp:CheckBoxList ID="CheckBoxList1" runat="server">
    <asp:ListItem>Vincent</asp:ListItem>
    <asp:ListItem>Jennifer</asp:ListItem>
    <asp:ListItem>Shynne</asp:ListItem>
    <asp:ListItem>Christian</asp:ListItem>
    <asp:ListItem>Helen</asp:ListItem>
    <asp:ListItem>Vladi</asp:ListItem>
    <asp:ListItem>Vinz</asp:ListItem>
    <asp:ListItem>Churchill</asp:ListItem>
    <asp:ListItem>Rod</asp:ListItem>
    <asp:ListItem>Mark</asp:ListItem>
</asp:CheckBoxList>

JavaScript:

function SearchList() {
    try {
        var l = document.getElementById('<%= CheckBoxList1.ClientID %>');
        var tb = document.getElementById('<%= TextBox1.ClientID %>');
        var p = l.item.length
        if (tb.value == "") {
            ClearSelection(l);
        } else {
            for (var i = 0; i < l.options.length; i++) {
                if (l.options[i].value.toLowerCase().match(tb.value.toLowerCase())) {
                    l.options[i].selected = true;
                    return false;
                } else {
                    ClearSelection(l);
                }
            }
        }
    } catch (e) {}
}

function ClearSelection(lb) {
    lb.selectedIndex = -1;
}
4

1 に答える 1

0

aspについてはわかりませんが、簡単な HTML
で理解しようとしています。参考になるかもしれません。
HTML部分

<select id="combo">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>
<br>
<input type="text" id="searchTXT" onblur="checkCombo();"> 

Javascript部分

function checkCombo() {
    try{
        var searchVal = $('#searchTXT').val();
        var options= document.getElementById('combo').options;
        for (var i= 0, n= options.length; i < n ; i++) {
        if (options[i].value.toLowerCase()==searchVal.toLowerCase()) {
            document.getElementById("combo").selectedIndex = i;
            break;
        }
    }
    }
    catch(e){}
    }
于 2013-04-11T11:02:53.667 に答える