Missing server-side values

2 posts, 0 answers
  1. Alex Tushinsky
    Alex Tushinsky avatar
    52 posts
    Member since:
    Feb 2006

    Posted 03 Dec 2014 Link to this post

    I'm fairly new to MVC and the Kendo MVC extensions, and I must be missing something fairly basic here.  

    I have a page with a strongly types model, which uses a Kendo Dropdown List, and two date pickers.  When the form is submitted, I do not get the selected values from server-side.

    Here's my code:

    Model:
    public class ExportData
       {
           public DateTime startDate { get; set; }
     
           public DateTime endDate { get; set; }
     
           public string exportType { get; set; }
            
       }


    Chtml:
    @using Microsoft.AspNet.Identity
    @using Kendo.Mvc.UI
     
    @model InsulinCalculator.Models.ExportData
     
    @using (Html.BeginForm("Export", "Home", FormMethod.Post))
    {
        <div class="form-group">
            <label class="col-md-2 control-label" for="dtpStartDate" style="white-space:nowrap;">Start Date:</label>
            <div class="col-md-3">
                <div class="input-group">
                    @(Html.Kendo()
                          .DatePickerFor(model => model.startDate)
                          .Name("dtpStartDate")
                          .Format("MM/dd/yyyy")
                          .HtmlAttributes(new { style = "width:180px" })
                    )
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-md-2 control-label" for="dtpEndDate" style="white-space:nowrap;">End Date:</label>
            <div class="col-md-3">
                <div class="input-group">
                    @(Html.Kendo()
                          .DatePickerFor(model => model.endDate)
                          .Name("dtpEndDate")
                          .Format("MM/dd/yyyy")
                          .HtmlAttributes(new { style = "width:180px" })
                    )
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-md-2 control-label" for="exportType" style="white-space:nowrap;">Format:</label>
            <div class="col-md-3">
                @(Html.Kendo()
                      .DropDownListFor(model => model.exportType)
                      .Name("exportType")
                      .HtmlAttributes(new { style = "width:180px" })
                      .BindTo(new List<string>()
                             {
                                 "Microsoft Excel (XLSX)",
                                 "Microsoft Word (DOCX)",
                                 "Adobe Acrobat (PDF)"
                             })
                )
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-4">
                <input type="submit" value="Export Data" class="btn btn-sm bg-purple2 pull-right">
            </div>
        </div>
    }

    Server-Side:
    [Authorize]
    [HttpPost]
    public ActionResult Export(ExportData oData)
    {
        Response.Write(oData.startDate + " " + oData.endDate + " " + oData.exportType);
        return View();
    }

    The model comes into the Export method correctly, but the only value that's populated is the exportType (which has a default selection), the two date pickers are completely empty.

    I'd like to preserve the selections after the form submit in the pickers / dropdown, and, of course, have the data available to me on the server.  Like I said, I seem to be missing something basic, but can't figure out what!  Any help is appreciated.

    Regards,
    Alex
  2. Alexander Popov
    Admin
    Alexander Popov avatar
    1416 posts

    Posted 05 Dec 2014 Link to this post

    Hi Alex,

    This happens because the widgets are using names different from the Model's field names. As a result, the model binder cannot accurately get the values and assign them to the respective fields. I would suggest not using the Name method when working with *For helpers in order to avoid such complications. For example: 
    @(Html.Kendo()
          .DatePickerFor(model => model.startDate)
          .Format("MM/dd/yyyy")
          .HtmlAttributes(new { style = "width:180px" })
    )

    Regards,
    Alexander Popov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. UI for ASP.NET MVC is VS 2017 Ready
Back to Top