チェックボックスを使用したドロップダウンリストの作成方法

Question

チェックボックスを使用してドロップダウンリストを作成するにはどうすればよいですか？これにはC＃langが優先されます。

Answer 1

できません。ない本物とにかく、しかし、あなたは（jQueryのを使用）ボタンをクリックしたときに表示されるスクロールのdivにすることにより、偽の1次のことができます。そして、あなたはその領域を表示したり、展開するいくつかのコードを追加する必要があると思い

<div id="cbListDiv" style="height: 172px; width:300px; overflow-y:scroll; border:1px solid silver; margin-top:8px;"> 
<asp:CheckBoxList id="cbList" runat="server" RepeatLayout="Flow" /> 
</div> 

をページ上のリンクをクリックすると表示されます。それは私が考えることができるほど近いです。

PLSのは、このリンクを経由し、私は強くあなたをお勧めします

Answer 2

..... ..... multiselect dropdownlist in aspnet using csharp

または

あなたはmulti select dropdwon list

Answer 3

あなたが使用できるためにjQueryを使用することができますこの目的のためのjQuery

jQuery MultiSelect

Answer 4

私は仕事場でこういうことをしなければなりませんでした。 JavaScriptの+ HTMLを使用して、私の同僚の1はこの思い付いた：

javascriptの

function Achicar(control, sHeight, indexPos) { 
control.style.height = sHeight; 
control.style.zIndex = 0; 
if (indexPos != '' && indexPos != null && indexPos != undefined) { 
    control.scrollTop = (20 + (24 * parseInt(indexPos))); 
} else control.scrollTop = 0; 

$(control).width($(control).attr('data-width-min')); 
} 

function Agrandar(control, sHeight, indexPos) { 
control.style.height = sHeight; 
control.style.zIndex = 99999; 
if (indexPos != '' && indexPos != null && indexPos != undefined) { 
    control.scrollTop = (20 + (24 * parseInt(indexPos))); 
} else control.scrollTop = 0; 

$(control).width($(control).attr('data-width-max')); 

} 

function RecorerTablaPos(idtabla) { 
    var vacio = true; 
    var posGuardada = ''; 
    $('#' + idtabla + ' input[type=checkbox]').each(function() { 
     if ($(this).is(':checked')) { 
      vacio = false; 
      var id = $(this).attr('id').split('_'); 
      var posActual = id[id.length - 1]; 
      if (posGuardada == '' || parseInt(posGuardada) > parseInt(posActual)) posGuardada = posActual; 
     } 
    }); 
    if (vacio) posGuardada = ''; 

    $('#' + idtabla).attr('data-indexpos', posGuardada); 
} 

function AtacharEvento() { 
    $('.divChkLst input[type=checkbox]').click(function() { 
     var idTabla = $($(this).parent().parent().parent().parent().parent()).attr('id'); 
     RecorerTablaPos(idTabla) 
    }); 

    $('.divChkLst').mouseenter(function() { 
     Agrandar(this, $(this).attr('data-height-max'), $(this).attr('data-indexpos')); 
    }) 
     .mouseleave(function() { 
     Achicar(this, $(this).attr('data-height-min'), $(this).attr('data-indexpos')); 
    }); 
} 

$(function() { 
    AtacharEvento(); 
}); 

HTML

<div id="divEjecutivo" data-height-max="200px" data-height-min="20px" data-indexpos="" class="divChkLst" data-width-max="500px" data-width-min="500px" style="margin-top: -11px; 
             width: 500px; height: 20px; overflow: auto; position: absolute; border: 1px solid rgb(167, 184, 193); 
             background-color: White;"> 
    <div style="height: 3px;"></div> <span visible="false" style="padding-left: 8px;">Seleccione ...</span><br /> 
    <input type="checkbox" /> This is checkbox <br /> 
<input type="checkbox" /> This is checkbox <br /> 
<input type="checkbox" /> This is checkbox <br /> 
<input type="checkbox" /> This is checkbox <br /> 
<input type="checkbox" /> This is checkbox <br /> 
<input type="checkbox" /> This is checkbox <br /> 

それはNickGが提供する答えに似ています。