@Html.ListBox

Question

Preciso desabilitar a opção multipla escolha do list box abaixo:

@Html.ListBox("cod_AnimalSinant", null, new { id = "cod_AnimalSinant", size = "2" })

Eu poderia usar um DropDownList, mas eu preciso de dois cliques.

Também poderia usar um RadioButtonList, mas é preciso mirar na bolinha para a escolha, rsrs.

Answer 1

Olá Wilson,

você consegue verificar quando um evento click no list é disparado? Se conseguir isso fica fácil, apenas verifique se algum item está selecionado na próxima seleção, caso sim, desmarque o que já está selecionado.

Caso tenha dificuldades com o código poste novamente.

Wennder Santos

Answer 2

Weender,

com F12 na coluna Elements eu chego no comando e em Event Listners eu visualizo o evento click.

Não sei como proceder, rsrsrs

Answer 3

"mas é preciso mirar na bolinha para a escolha, rsrs."

Basta você colocar a "bolinha" radio button dentro de uma tag label:

<label>
<input type="radio" value="...">[Texto]
</labe>

Ao clicar no [Texto] a bolinha vai ser marcada.

Quanto a usar um listbox como um dropdownlist você pode tentar.

$("#id-do-dropdown option").click(function(){
       $(this).siblings().removeProp('selected');
});

Answer 4

Quanto ao ListBox com o código abaixo ele possibilita marcar mais de uma opção, tem alguma suloção?

CONTROLER

ViewBag.cod_MeioAmb_Observacao = new SelectList(db.Ag_Pol_C_MeioAmb_Mamifero_Obs, "id", "descricao");

CREATE
<div class="editor-field">
                                @Html.ListBox("cod_MeioAmb_Observacao", null, new { id = "cod_MeioAmb_Observacao" })
                                @*@Html.DropDownList("cod_MeioAmb_Observacao", String.Empty)*@
                                @Html.ValidationMessageFor(model => model.cod_MeioAmb_Observacao)
                            </div>


 <script type="text/javascript">
        $("#cod_MeioAmb_Observacao").click(function () {
            $(this).siblings().removeProp('selected');
        });

Answer 5

Olá,

O atributo que permite a múltipla seleção para o controle é MULTIPLE, ele está sendo apresentado em código, se sim já tentou configurar para FALSE?

At.

Answer 6

No código fonte retorna com multiple"multiple",  mas como configurar este rapaz?

 <div class="editor-field">
<select id="cod_MeioAmb_Observacao" multiple="multiple" name="cod_MeioAmb_Observacao"><option value="1">Sadio</option>
<option value="2">Suspeito</option>
<option value="3">Sacrificado por leigo</option>
<option value="4">Morto por atropelamento</option>
<option value="5">Desaparecido</option>
<option value="8">Ignorado</option>
</select>

 

Answer 7

      $("#cod_MeioAmb_Observacao option").click(function () {
            $(this).siblings().removeProp('selected');
        });

Você está esquecendo do "option" no seletor do jquery

Quanto à retirar o atributo multiple como ele já vem no Helper "ListBox" você pode remover o mesmo também com jquery:

$("#cod_MeioAmb_Observacao").removeProp("multiple")

Answer 8

Joao_Prado,

ainda não rolou o ListBox possibilitando apenas uma escolha, rsrsrs

CREATE
 <div class="editor-field">
 @Html.ListBox("cod_MeioAmb_Observacao", null, new { id = "cod_MeioAmb_Observacao"})
 @Html.ValidationMessageFor(model => model.cod_MeioAmb_Observacao)
 </div>

<script type="text/javascript">
        $("#cod_MeioAmb_Observacao option").click(function () {
            $(this).siblings().removeProp('selected');            
        });
        $("#cod_MeioAmb_Observacao").removeProp("multiple")
<div class="editor-field">


CÓDIGO FONTE
<select id="cod_MeioAmb_Observacao" multiple="multiple" name="cod_MeioAmb_Observacao"><option value="1">Sadio</option>
<option value="2">Suspeito</option>
<option value="3">Sacrificado por leigo</option>
<option value="4">Morto por atropelamento</option>
<option value="5">Desaparecido</option>
<option value="8">Ignorado</option>
</select>

Answer 9

Use somente uma das opções, é mais fácil retirar o atributo "multiple":

Lembrando que você tem que fazer isso dentro da inicialização do jquery:

$(function(){
     $("#cod_MeioAmb_Observacao").removeProp("multiple")
});

ou

$(function(){
     $("#cod_MeioAmb_Observacao").removeAttr("multiple")
});

Veja qual das duas funciona

Answer 10

João_Prado,

Meu ListBox está um enigma.....

se eu uso:

CREATE
 <div class="editor-field">
 @Html.ListBox("cod_MeioAmb_Observacao", null, new { id = "cod_MeioAmb_Observacao"})
 @Html.ValidationMessageFor(model => model.cod_MeioAmb_Observacao)
 </div>

$(function(){
        $("#cod_MeioAmb_Observacao").removeProp("multiple")
});

CÓDIGO FONTE:

<select id="cod_MeioAmb_Observacao" multiple="multiple" name="cod_MeioAmb_Observacao"><option value="1">Sadio</option>
<option value="2">Suspeito</option>
<option value="3">Sacrificado por leigo</option>
<option value="4">Morto por atropelamento</option>
<option value="5">Desaparecido</option>
<option value="8">Ignorado</option>
</select>

.....o retorno é um DropDownList em que eu preciso clicar para visualizar o conteúdo.

se eu uso:

CREATE
 <div class="editor-field">
 @Html.ListBox("cod_MeioAmb_Observacao", null, new { id = "cod_MeioAmb_Observacao"})
 @Html.ValidationMessageFor(model => model.cod_MeioAmb_Observacao)
 </div>

$(function(){
     $("#cod_MeioAmb_Observacao").removeAttr("multiple")
});

CÓDIGO FONTE:
  <select id="cod_MeioAmb_Observacao" multiple="multiple" name="cod_MeioAmb_Observacao"><option value="1">Sadio</option>
<option value="2">Suspeito</option>
<option value="3">Sacrificado por leigo</option>
<option value="4">Morto por atropelamento</option>
<option value="5">Desaparecido</option>
<option value="8">Ignorado</option>
</select>

.....o retorno é um ListBox e com possibilidade de multipla escolha permanece.

Answer 11

Confere esse fiddle aqui: http://jsfiddle.net/jmprado/C53yn/

Pelo menos ali funcionou, verifique se não está ocorrendo algum erro de javascript, provavelmente é por isso que você não está conseguindo retirar o atributo "multiple" do listbox.

Agora um detalhe, se você não precisa do atributo "multiple" porque não usa um DropDownList simples?

Answer 12

Joao_Prado,

Opa, agora acho que vamos nos entender, rsrs...

então o que eu preciso é um comando em que os item fiquem visíveis como um ListBox, porém que seja possível selecionar apena um item, ok?

No exemplo: http://jsfiddle.net/jmprado/C53yn/, os itens ficam invisíveis.

Ou seja, aparência de List e funcionamento de Drop.

Answer 13

Joao_Prado,

consegui com radiobutton:

<div class="btn-group" data-toggle="buttons">
                                    @foreach (var item in (List<Braun.Models.Ag_Pol_C_MeioAmb_Mamifero_Obs>)@ViewBag.cod_MeioAmb_Observacao)
                                    {
                                     
                                        <label class="btn btn-default" style="width: 200px">
                                            @*@Html.RadioButton("cod_MeioAmb_Encam", item.id) @item.descricao*@
                                            @*@Html.ListBox("cod_MeioAmb_Observacao", null, new { id = "cod_MeioAmb_Observacao" })*@
                                            @*@Html.DropDownList("cod_MeioAmb_Observacao", String.Empty)*@


                                            @Html.RadioButtonFor(model => model.cod_MeioAmb_Observacao, item.id) @item.descricao

                                        </label>   <br />
                                    }
                                </div>

Answer 14

É só você colocar o atributo size no DropDownList:

http://jsfiddle.net/jmprado/C53yn/3/