Inline editing validation with drop-down list fails

[AP]

I've got a grid, which uses in-line editing on the sub-grid for the linked hierarchical data.

When just using a text box, the validation message display, and prevents entry of a blank value, but when I replace it with a drop-down list editor template, the validation fails to fire, causing an error message to be displayed (from the controller) when the record tries to save.  This is strange, as when I do similar drop-down lists with pop-up edit forms, the validation works fine.

The grid:-

  @(Html.Kendo().Grid<CMS_2013.Models.ApportionmentScenario>()

.Name("Grid")

.Events(e=>e.Edit("onEdit"))

.Columns(columns=>

{

 

    columns.Bound(o => o.ID).Title("ID");

    columns.Bound(o => o.FormattedDateTime).Title("Created");

    columns.Bound(o => o.ScenarioName).Title("Name");

    columns.Bound(o => o.CreatingUser).Title("User");

 

     

    columns.Command(command => { command.Edit(); command.Destroy(); });

 

      

    })

      .ClientDetailTemplateId("detailsTemplate")

  .ToolBar(commands=>commands.Create())

   .Editable(editable=>editable

        .Mode(GridEditMode.PopUp))

 

 

    .DataSource(dataSource=>dataSource

        .Ajax()

        .Model(m=>m.Id(p=>p.ID))

        .Events(events => events.Error("error"))

        .PageSize(10)

         

         

        .Read(read=>read.Action("ReadScenarios","Apportionment"))

        .Create(create=>create.Action("InsertScenario","Apportionment"))

        .Update(update=>update.Action("UpdateScenario","Apportionment"))

        .Destroy(delete=>delete.Action("DeleteScenario","Apportionment"))

        )

        .Pageable()

        .Sortable()

        .Filterable()

   

       )

    </div>

 

 

<script id="detailsTemplate" type="text/kendo-tmpl">

   

 

    @(Html.Kendo().Grid<CMS_2013.Models.ApportionmentData>()

        .Name("Data_#=ID#")

        .Columns(columns=>

            {

                columns.Bound(o => o.FormattedDateTime).Title("Date");

            columns.Bound(o => o.Purchaser).Title("Purchaser");

            columns.Bound(o => o.Apportionment);

            columns.Command(command => { command.Edit(); command.Destroy(); });

                 

            })

                .ToolBar(commands=>commands.Create())

   .Editable(editable=>editable

        .Mode(GridEditMode.InLine))

             

            .DataSource(dataSource=>dataSource

        .Ajax()

        .Model(m=>m.Id(p=>p.ID))

        .Events(events => events.Error("error"))

        .PageSize(10)

         

         

        .Read(read=>read.Action("ReadData","Apportionment", new { SID = "#= ID #" }))

          .Create(create=>create.Action("InsertData","Apportionment", new { SID = "#= ID #" }))

        .Update(update=>update.Action("UpdateData","Apportionment"))

        .Destroy(delete=>delete.Action("DeleteData","Apportionment"))

      

        )

        .Pageable()

        .Sortable()

        .ToClientTemplate())

The editor template for the purchaser field (PurchaserEditor.cshtml):-

@(Html.Kendo().DropDownList()

          .Name("Purchaser")

          .DataTextField("ShortName")

          .DataValueField("Purchaser")

          .OptionLabel("Choose Purchaser")

          

          .HtmlAttributes(new { style="width:180px;"})

          .DataSource(source=>source

              .Read(read=>read.Action("GetPurchaserLookUpList2","ManualData"))))

The object meta data:-

public class ApportionmentDataMD

     {

         

 

         [Required, StringLength(6)]

         [UIHint("PurchaserEditor")]

         public object Purchaser { get; set; }

 

         [Required]

         [UIHint("ApportionmentPercent")]

         public object Apportionment { get; set; }

 

 

 

     }

Thanks

[Vladimir Iliev]

Hi Andrew,

 
To enable the validation I would suggest to use the DropDownListFor HTMLHelper in the editor template - please check the example below:

@model object

@(Html.Kendo().DropDownListFor(m => m)
    .DataTextField("ShortName")
    .DataValueField("Purchaser")
    .OptionLabel("Choose Purchaser")
    .HtmlAttributes(new { style="width:180px;"})
    .DataSource(source=>source
        .Read(read=>read.Action("GetPurchaserLookUpList2","ManualData"))))

Kind Regards,
Vladimir Iliev
the Telerik team

[AP]

That fixed it.

Thanks

[Michael]

Hi,

I have the same problem, but in my case it´s not possible to use the DropDownList. I found this Kendo UI solution but I have no idea how I can adjust this for Kendo UI MVC. Have you a solution for me?

Thanks a lot!

[Vladimir Iliev]

Hi Andrew,

 
From the provided information it's not clear for us what exactly you are trying to achieve and what is the current setup that you have. Could you please open a new support ticket / forum post and provide more information about your current Grid setup and what is the exact behavior that you are trying to achieve? 

Kind Regards,
Vladimir Iliev
Telerik

[Chris]

Hi Vladimir,

Are you saying that you have to use DropDownListFor (and not DropDownList) when requiring client validation to use Model definition (e.g. [Required(ErrorMessage = "Field xxxx is required"] for validation rules?

In my case, I'm using an Editor Template which does not allow use if DropDownListFor and dynamic operations (m => m.FieldName).

Thanks,

 Chris.

[Georgi Krustev]

Hello Chris,

The strongly-typed Html extension (DropDownListFor<T>) is just an enhancement of the regular Html extension. Basically, the For<> stuff allows to the method to retrieve the correct model name and model value. You can find more details about the "strongly-typed extensions" concept here:

• http://weblogs.asp.net/scottgu/asp-net-mvc-2-strongly-typed-html-helpers

That being said, if you set the name of the widget correctly, as For<> extension does, then the widget will retrieve the model information as expected. You can set the name using ViewData.TemplateInfo.GetFullHtmlFieldName method.

The above solution will work in the case of Html.Editor method is used.

Regards,
Georgi Krustev
Telerik