Home / Questions / 251209
Accepted
Nicolas Oñate
Asked: 2020-04-04 02:18:03 +0800 CST 2020-04-04 02:18:03 +0800 CST

如何在 ASP.NET 中获得选择的结果？

  • 772

我有一个视图，当<select>在前一个视图中选择时，它会改变其内容，我必须捕获选择了哪个元素。

我正在使用Html.DropDownListFor来获取底漆中的数据，<select>如下所示：

@Html.DropDownListFor(m => m.ListaClases, new SelectList(Model.ListaClases, "IdClase", "Clase"), new { @class = "input form-control input-lg", @required = "required", @style = "height: 40px; font-size:16px" })

我必须在不使用 javascript 的情况下在同一个视图中获得选择的值以便能够绘制另一个值。

我试图尝试生成一个隐藏字段并使用与此问题类似的onChange@Html.HiddenFor事件为其分配值，但我无法做到

如何在IdClase不使用 javascript 的情况下获得并直接反映在 Html 中？

编辑 1

为了进一步澄清我上传当前视图的问题，我将从捕获表单开始： 形式

  1. text 类型的三个输入，不产生任何冲突
  2. 类和子类，两个Lists相互链接，Class就是我要获取的id
  3. 属性和值，这些必须根据类而有所不同（目前在 javascript 中工作）
  4. 用于向表格添加/删除属性的按钮
  5. 接受按钮使表单提交

窗口代码（cshtml）：

    @model ArticuloVm
    @{
        /**/

        Layout = null;
        var variable = 1;
    }
    @using (Html.BeginForm())
    {
        @Html.HiddenFor(m => m.Id)

        <div class="row">
            <div class="col-md-2">
            </div>
            <div class="col-md-4">

                Código
                <input class="form-control input-lg" type="text" name="Codigo" id="Codigo" style=" height: 50px; font-size:21px;" autocomplete="off" value="@Model.Codigo">

            </div>

            <div class="col-md-4">

                Código Ean
                <input class="form-control input-lg" type="text" name="CodigoEan" id="CodigoEan" style="height: 50px; font-size:21px;" autocomplete="off" value="@Model.CodigoEan">

            </div>
            <div class="col-md-2">
            </div>


        </div>
        <br />
        <div class="row">
            <div class="col-md-2">
            </div>
            <div class="col-md-8 offset-md-2">

                Descripción
                <input class="form-control input-lg" type="text" name="Descripcion" id="Descripcion" style="height: 50px; font-size:21px;" autocomplete="off" value="@Model.Descripcion">

            </div>

        </div>
        <br />
        <div class="row">
            <div class="col-md-2">
                &nbsp;
            </div>
            <div class="col-md-4">
                Clase
                @Html.DropDownListFor(m => m.ListaClases, new SelectList(Model.ListaClases, "IdClase", "Clase"), new { @class = "input form-control input-lg", @required = "required", @style = "height: 40px; font-size:16px", onchange = variable++ }) 
                //probando si funcionaba el evento onchange para capturar la variable, con esta prueba he descubierto que tan solo lo ejecuta 1 vez poniendo el valor a 2
            </div>
            <div class="col-md-4">
                SubClase
                @Html.DropDownListFor(m => m.ListaSubClases, new SelectList(Model.ListaSubClases, "IdClase", "Clase"), new { @class = "input form-control input-lg", @required = "required", @style = "height: 40px; font-size:16px" })
            </div>
        </div>
        <br/>   
        <div class="row">
            <div class="col-md-2">
                &nbsp;
            </div>      


            <div class="col-md-4">  

    //Actualmente puesto en dos selects, es lo que quiero transformar según el id de la Clase
                    <select class="input form-control input-lg" id="valor" name="valor"

 style="height: 40px; font-size:16px; position:absolute; visibility: hidden; width: 92%;">
                    <option value="1">Valor máximo</option>
                    <option value="2">Valor mínimo</option>
                </select>
                <select class="input form-control input-lg" id="Tiene" name="Tiene" style="height: 40px; font-size:16px; position:absolute; width: 92%;">
                    <option value="1">Tiene Solomillo</option>
                    <option value="2">Tiene rabo</option>
                </select>
            </div>
            <div class="col-md-2">
                Valor:
                <input style="height: 40px; width: 92%; font-size:18px; visibility: hidden;  position:absolute;" class="form-control input-lg" placeholder="Valor" name="cantidad" id="cantidad" autocomplete="off">
                <select class="input form-control input-lg" id="sino" name="sino" style="height: 40px; font-size:16px; position:absolute; width: 92%;">
                    <option value="1">Si</option>
                    <option value="2">No</option>
                </select>

            </div>
            <div class="col-md-2" style="padding-top: 1.5%;">
                <div class="col-md-6">
                    <div class="input-group">
                        <button id="anadir" type="button" class="btn btn-success btn-lg">Añadir</button>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="input-group">
                        <button disabled id="quitar" type="button" class="btn btn-danger btn-lg">Quitar</button>
                    </div>
                </div>
            </div>
        </div>  
        <br/>   
        <div class="row" style="overflow-y:scroll; height: 200px">
            <div class="col-md-3"></div>
            <div class="col-md-6 offset-md-3">
                <table id="Propiedades" class="display projects-table table table-striped table-bordered table-hover" cellspacing="0">
                    <thead>
                        <tr>
                            <th>Propiedad</th>
                            <th>Valor</th>
                        </tr>
                    </thead>
                </table>
            </div>
        </div>

    }

当我按下 OK 按钮时，它会跳转到控制器并进入以下功能：

        [TsVisible]
        [HttpPost]
        public ActionResult NuevoArticulo(ArticuloVm vm)
        {

            try
            {               
                Debug.WriteLine("Datos: " + vm.Codigo + ", " + vm.Descripcion + ", " + vm.CodigoEan + ", " + vm.ListaClases + ", " + vm.ListaSubClases);

                //_svcConfiguraciones.AnadirArticulo(vm.Codigo, vm.Descripcion, vm.CodigoEan, vm.Datos);
                return AjaxResp.Ok("Nuevo Articulo", "Articulo añadido correctamente");

            }
            catch (Exception ex)
            {
                _log.Error(ex);
                return AjaxResp.Error("Nuevo Árticulo", "Se ha producido un error al añadir el árticulo");
            }

        }

由于调用_svcConfiguraciones进入负责管理数据库的类的调用，由于明显的原因被阻止，事实证明调试消息向我显示了模型在视图中定义的那些，而不是我通过 javascript/Jquery 捕获的那些，方法有什么用：

$('#aceptarPost').click(function () {

mvc.Configuracion.NuevoArticulo.post({ Codigo: $('#Codigo').val(), CodigoEan: $('#CodigoEan').val(), Descripcion: $('#Descripcion').val() }, res => {        
    console.log("Respuesta");
});
});

这个调用目前只有三个参数，但从我之前做的测试来看，所有的值都被定义了。

c#

1 Answers

  1. Best Answer

    出现您的问题是因为您使用不正确Html.DropDownListFor()。

    请记住，它作为第一个参数接收的 lambda 表达式是将<select>与对应于属性的名称相关联的表达式，例如在您的情况下。

    @Html.DropDownListFor(m => m.ListaSubClases, new SelectList(Model.ListaSubClases, "IdClase", "Clase"), new { @class = "input form-control input-lg", @required = "required", @style = "height: 40px; font-size:16px" })

    您的第一个参数引用ListaSubClases，因此它将namedel分配select为ListaSubClases，因此您的 Controller 将尝试将其与ListaSubClases您的模型属性相关联，但它无法做到，因为它的类型与int.

    为了解决这个问题，你必须做的是在你ViewModel有一个int接收数据的地方，例如

    public class ViewModel 
{
    public int ListaSubClasesId { get;set; }
    public List<T> ListaSubClases { get; set; }
}

    T指您存储的列表的类型ListaSubClases

    然后，在视图中，它将如下所示

    @Html.DropDownListFor(m => m.ListaSubClasesId, new SelectList(Model.ListaSubClases, "IdClase", "Clase"), new { @class = "input form-control input-lg", @required = "required", @style = "height: 40px; font-size:16px" })

    这样，对于您的控制器，Iddel将到达您的 ViewModelselect的属性中ListaSubClasesId

    • 2