DropDownList dont show data with JSON

2 posts, 0 answers
  1. Eduardo
    Eduardo avatar
    1 posts
    Member since:
    Jun 2013

    Posted 09 Jul 2013 Link to this post

    i have a problem with a DropdownList control.
     i have a Grid with a popup edditing and when i show a popup the DropDownList doesnt show any data, im using MVC4 and KendoUI controls

    this is the code.The Grid.

    @(Html.Kendo().Grid<CashControl.Models.Usuario>()
    .Name("grid")
    .Columns(columns =>
    {
    columns.Bound(p => p.nombre).Width(100);
    columns.Bound(p => p.nombreUsuario).Width(100);
    columns.Bound(p => p.email).Width(100);
    columns.Command(command => { command.Edit(); command.Destroy(); }).Width(160);
    })
    .ToolBar(toolbar => toolbar.Create())
    .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("DropDownListUsuarios"))
    .Pageable()
    .Sortable()
    .Scrollable()
    .HtmlAttributes(new { style = "height:430px;" })
    .DataSource(dataSource => dataSource
    .Ajax()
    .PageSize(20)
    .Events(events => events.Error("error_handler"))
    .Model(model =>
    {
    model.Id(p => p.idUsuario);
    })
    .Create(update => update.Action("EditingInline_Create", "Grid"))
    .Read(read => read.Action("UsuariosRead", "Configuracion"))
    .Update(update => update.Action("EditingInline_Update", "Grid"))
    .Destroy(update => update.Action("EditingInline_Destroy", "Grid"))
    )
    )

    The PopUp

    <div class="demo-section" style="width: 250px;">
    <h2>Products</h2>
    @(Html.Kendo().DropDownList()
    .Name("products")
    .HtmlAttributes(new { style = "width: 250px" })
    .DataTextField("nombre")
    .DataValueField("idnombre")
    .DataSource(source => {
    source.Read(read =>
    {
    read.Action("UsuarioRead", "Configuracion");
    });
    })
    )
    </div>
    <style scoped>
    .demo-section {
    width: 250px;
    margin: 35px auto 50px;
    padding: 30px;
    }
    .demo-section h2 {
    text-transform: uppercase;
    font-size: 1.2em;
    margin-bottom: 10px;
    }
    </style>

    and the Controller.

    public ActionResult UsuarioRead([DataSourceRequest] DataSourceRequest request)
    {
    IQueryable<Usuario> products = CashControl.Usuario;
    var rest = products.Select(n => new
    {
    idUsuario = n.idUsuario,
    nombre = n.nombre,
    nombreUsuario = n.nombreUsuario,
    email = n.email
    });

    DataSourceResult result = rest.ToDataSourceResult(request);

    return Json(result, JsonRequestBehavior.AllowGet);
    }
    and this is the JSON

    result{"Data":[{"idUsuario":1,"nombre":"Eduardo","nombreUsuario":"Brakyo","email":"eduardomeji@gmail.com"}],"Total":1,"AggregateResults":null,"Errors":null}


  2. Daniel
    Admin
    Daniel avatar
    2117 posts

    Posted 11 Jul 2013 Link to this post

    Hello Eduardo,

    The dropdownlist does not use the DataSourceResult and expects a collection e.g.

    public ActionResult UsuarioRead()
    {
        IQueryable<Usuario> products = CashControl.Usuario;
        var rest = products.Select(n => new
        {
            idUsuario = n.idUsuario,
            nombre = n.nombre,
            nombreUsuario = n.nombreUsuario,
            email = n.email
        });
     
        return Json(rest, JsonRequestBehavior.AllowGet);
    }
    Regards,
    Daniel
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. UI for ASP.NET MVC is VS 2017 Ready
Back to Top