Get the value of a drop-down (select) with JQuery

Question

Get the value of a drop-down (select) with JQuery

Navigation

#1 by (4 votes)
#2 by (2 votes)
#3 by (0 votes)

1

I have this HTML code to create a combobox from an enumerated

Enumerated

public enum tipoFormasPago
{
    [Display(Name = "Efectivo")]
    E,
    [Display(Name = "Tarjeta")]
    T,
    [Display(Name = "Paypal")]
    P
}

HTML code

<td>Forma de pago</td>
<td>
    @Html.DropDownList(
        "formaDePago",
        EnumHelper.GetSelectList(typeof(testweb.Classes.EnumUtils.tipoFormasPago)),
        "Selecciona",
        new { @class = "formaDePago form-control" }
    )
    <span class="error">Forma de pago obligatoria</span>
</td>

If I look at the HTML with firebug I see the following:

<select class="formaDePago form-control" id="formaDePago" name="formaDePago">
    <option value="">Selecciona</option>
    <option value="0">Efectivo</option>
    <option value="1">Tarjeta</option>
    <option value="2">Paypal</option>
</select>

And from javascript I want to collect the value of the combobox, for this I have tried in these ways but I always receive "0" :

var var1 = $('#formaDePago').find('option:selected').val();
var var2 = $('select[name=formaDePago]').val();

I would also like the values to be completed with the list I have created.

Thank you.

javascript jquery asp.net-mvc-5

asked by ilernet 26.05.2017 в 13:32

source

3 answers

When in.close () is used; of the Scanner class? Iterate over sublists within a list

score 4 · Answer 1

To get the value you only need the .val anyway I leave the code to get the option and the valor

I hope this serves you

$(document).ready(function(){
    $("#formaDePago").click(function(){
        var select = $("#formaDePago option:selected").text();
        var valor= $("#formaDePago").val();
        $("#selector").val(select)
       $("#valor").val(valor)
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="formaDePago form-control" id="formaDePago" name="formaDePago">
	<option value="">Selecciona</option>

	<option value="E">Efectivo</option>

	<option value="T">Tarjeta</option>

	<option value="P">Paypal</option>

</select>
<input id="selector"></input>
<input id="valor"></input>

score 2 · Answer 2

To get the selected value of select you only need:

$('#formaDePago').val();

Look at this example:

$('button').click(function(){
  var var2 = $('#formaDePago').val();
  alert("valor: " + var2);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="formaDePago form-control" id="formaDePago" name="formaDePago">
	<option value="">Selecciona</option>
	<option value="0">Efectivo</option>
	<option value="1">Tarjeta</option>
	<option value="2">Paypal</option>
</select>
<button>Mostrar valor</button>

score 0 · Answer 3

I do not know if it's helpful for what you want to do but MVC5 (5.2) rectifico has a new helper for the enumerables. and your example works, it does not show you E, T and P because you have it defined in an inverse way.

Test this way in the model you create your enum

public enum Tipo
{
     [Display(Name = "Efectivo")]
     E,
     [Display(Name = "Tarjeta")]
     T,
     [Display(Name = "Paypal")]
     P
}

public class PruebaViewModel
{

    public Tipo? Tipo { get; set; }


}

and in your sight

 @Html.EnumDropDownListFor(model => model.Tipo, new { @class = "form-control" })

and in your controller questions

if (prueba.Tipo == Tipo.E)

I hope it helps you