Validation validates wrong input field if field names are similar?

[Rainer]

Hello Telerik Team, hello Community

I have a grid with two columns that have a similar name: Leadauditor (decimal) and Leadauditor_DisplayName (string). I initially designed it this way so that the user can search the Name in the Leadauditor_DisplayName field and then I programmatically write the ID into the (hidden) Leadauditor field (using e.g. model.set('Leadauditor', 3).

Since I upgraded from 2013.2.716 to 2014.1.318 this does not work any more. My assumption is that the validation fails because it validates the wrong field...

Kindly refer to my attached screenshots:
in the Kendo.min.js, _validate Method, there are 4 elements when it searches with :Input[data-bind*=\"value:Leadauditor\"]. The data() from the jquery.min.js function returns the [0] Position, which is actually the Leadauditor_DisplayName. Now the validation fails because this contains actually a string but the rules for an mvcdecimal are applied...
If the search string is changed to :Input[data-bind=\"value:Leadauditor\"] then it should work because it only returns one search result (kindly refer to the third screenshot).

best regards,
Rainer

[Alexander Popov]

Hi Rainer,

I am afraid that the attached code snippets and screenshots do not reveal what exactly is causing this. Sharing code snippets, live link, or ideally - a runnable sample project where the issue is reproduced would help us pinpoint the exact reason for this behavior and advise you further. 

Regards,
Alexander Popov
Telerik

 

 

[Rainer]

Hello,

no Problem (kindly refer to http://wwwu.edu.uni-klu.ac.at/rweident/KendoUIMvcApplication1.zip )

My observations so far:  My EditorTemplate is causing this behavior. If you comment out the Edit-Template in Index.cshtml (Line 26) then it works. It seems to be related to the order of the input fields used in the "TestEditor.cshtml". As also mentioned it somehow also is related to Kendo's "_validate" method that has slightly changed since the last Version.

Another Observation: I cannot add the [Required]-Annotation for the Country-ID (Models\TestModel.cs, line 13). Because if I then want to set the Country ID programmatically it complains that it is required...?! So the verification is done before I am allowed to set it.

Thank you so much,
Rainer

[Alexander Popov]

Hello again Rainer,

Thank you for the provided project. I reviewed it and noticed that the Country field is used as Model ID. The ID should not changed manually, otherwise the item will not be treated as new and the Update controller will be invoked instead of the Create when adding new items. Additionally, this might cause an existing item to be overwritten. In the current scenario I would recommend adding one more property to the Model, which should be unique for each record and will be used as ID. For example: 

public class TestModel
{
    [ScaffoldColumn(false)]
    public int ID{ get; set; }
    public int CountryID { get; set; }
    public string CountryDisplayName { get; set; }
}

@model IEnumerable<KendoUIMvcApplication1.Models.TestModel>
@(Html.Kendo().Grid(Model)
    .Name("Grid")
    .ToolBar(toolbar => toolbar.Create())
    .DataSource(dataSource => dataSource.Ajax().ServerOperation(true)
        .Create(update => update.Action("Test_Update", "Home").Type(HttpVerbs.Post))
        .Model(model => {
                model.Id(p => p.ID);
        })
    )
    .ColumnMenu()
    .Columns(c =>{
        c.Bound(p => p.CountryID);
        c.Bound(p => p.CountryDisplayName);
    })
    .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("TestEditor"))
)

Then you can modify the EditorTemplate so it displays a ComboBox bound to the CountryID field and attach an change event to it, that assigns the selected item's text to the CountryDisplayName field: 

@model KendoUIMvcApplication1.Models.TestModel
<script>
    function onCountryChange(e) {
        var uid = this.wrapper.closest("[data-uid]").attr("data-uid"); //get the uid if the currently edited item
        var grid = $("#Grid").data("kendoGrid");
        var item = grid.dataSource.getByUid(uid);
        item.set("CountryDisplayName", this.text());
    }
</script>
<span class="k-widget k-combobox k-header" data-bind="text: CountryDisplayName" style="width:500px" />

    @(Html.Kendo().ComboBoxFor(m=>m.CountryID)
        .Events(e=>e.Change("onCountryChange"))
        .Suggest(true)
        .ValuePrimitive(true)
        .AutoBind(true)
        .MinLength(1)
        .DataTextField("DisplayName")
        .DataValueField("ID")
        .DataSource(source => source.Read(read =>
            {
                read.Action("Country_Filter", "Home").Type(HttpVerbs.Post);
            })
            .ServerFiltering(true)
        )
     )

Regards,
Alexander Popov
Telerik

 

 

[Rainer]

Hello,

sorry for the late Feedback. I couldn't get it to work, but recently I upgraded from 2014.1.318 to 2014.1.519 and now it works.
Best regards,
Rainer