es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Colección de elementos de inicio de asp.net core no funciona con controles de kendo.

29 Jul, 2023 Programación

He utilizado BeginCollectionItem en asp.net core. Dentro de esta colección he utilizado un combobox de Kendo y un datepicker, pero los datos no se enlazan con la lista del modelo al enviar los datos. ¿Alguien tiene alguna idea al respecto?

A continuación se muestra un ejemplo de código para el archivo cshtml:

@using HtmlHelpers.BeginCollectionItemCore
@using DemoProject.Model
@model BatchDetail

<tr data-rownum="@Model.Seq">
    @using (Html.BeginCollectionItem("oBatchDetails"))
    {
        <td>                
        @Html.EditorFor(model => model.CheckCardNo, new { htmlAttributes = new { @class = "form-control input-sm patientCheckCard clsAlphaNumericText", maxlength = "50", autocomplete = "off" } })
        </td>
        <td>
        @(Html.Kendo().DatePickerFor(model => model.CheckDate).Format("MM/dd/yyyy").HtmlAttributes(new { style = "width:115px", @class = "smalldtpicker paidDate", autocomplete = "off", @type = "" }))
        </td>            
    }
</tr>

Cuando veo el $("#formid").serialize() en la consola, encuentro el siguiente resultado:

oBatchDetails%5B25e11650-70cd-4d04-9fe0-4ce0e621cbfd%5D.CheckCardNo=123456789&
CheckDate=12%2F27%2F2021&

Donde la fecha de verificación debería ser oBatchDetails%5B25e11650-70cd-4d04-9fe0-4ce0e621cbfd%5D.CheckDate=12%2F27%2F2021&

Pero el Begin collection item no maneja este datepicker de Kendo.

Tags:  , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Parece ser un problema con la serialización del datepicker de kendo en BeginCollectionItem para ASP.NET Core. Una forma de resolver este problema es serializar manualmente el datepicker de kendo y agregarlo a los datos del formulario antes de enviarlo.

    Puedes intentar agregar el siguiente código a tu script:

    // Serializar manualmente el datepicker de kendo
$('form').submit(function() {
    var datepicker = $(".k-datepicker input");
    var selectedDate = datepicker.val();
    var formattedDate = kendo.toString(kendo.parseDate(selectedDate), "MM/dd/yyyy");
    datepicker.attr("name", "CheckDate");
    datepicker.val(formattedDate);
});

    Este código convertirá los datos del datepicker de kendo al formato requerido y los agregará a los datos del formulario antes de enviarlo.

    Como alternativa, también puedes intentar usar una llamada ajax para enviar los datos en lugar de una envío tradicional del formulario, ya que esto te dará más control sobre los datos que se envían.

    Espero que esto te ayude. ¡Avísame si tienes alguna pregunta adicional!

Comments are closed.