(Edited- pivoted back to using [Remote] validation, but need to figure out how to keep popup in place after ModelState validation failure if user clicks submit)

Hi all,

I am working on a PopUp Editor for a Grid widget that displays user account information.  The PopUp Editor is a custom template, and has Telerik TextBox widgets for the user account's data, including UserName.  We want to validate the UserName by making a clientside call to the server to see if the UserName is already in use.

I am using  [Remote] validation in our view model that makes a call from the clientside to a method in our controller that checks if the UserName is already in use.  As has been the case with other people, this call is made even if a user clicks through the UserName Textbox and doesn't change the value for UserName, but our use case is such that I can work around this issue.

The problem is that if a user changes the username to an existing username, the Remote validation fires, but does not prevent the user from clicking Update on the PopUp- the user can click Update.  On the server side, the Update will fail due to ModelState.IsValid = false, and a failure message is returned, but the user is not notified of the failure- the PopUp just fades out.  If the user clicks "Edit" again, the username has the updated value in the PopUp, even though the update failed.

I was expecting that if the user clicks Submit, then the failure message that's returned would be displayed, and the PopUp would not fade out.   I suspect it may have to do with using an custom Editor Template,  but I'm hoping somebody can point out whatever it is I might be missing.

I used the following as guides:

• https://demos.telerik.com/aspnet-mvc/grid/editing-remote-validation
• https://www.telerik.com/forums/remote-validation-of-fields-in-grid-popup
• https://docs.telerik.com/aspnet-core/html-helpers/data-management/grid/editing/popup#handling-modelstate-errors

Has anybody been successful in using a custom template for PopUpEditor on a Grid, with a [Remote] validation, with the returned ModelState errors preventing the PopUpEditor from disappearing, instead displaying the returned error(s)?

Thanks in advance!

Taylor

Hi

We are having a grid with editable field option which triggers when you click on the field.

I wanted to enable tab functionality so that if you are on any field and click tab it should make the next field enable/editable.

When I am clicking on any field to show like this. On tab press I wanted make Charlotte editable.

ANY help appreciated. Thanks!

<p>For a .netcore 3.1 web application I have a grid using grideditmode.inline and the columns are loaded using columns.LoadSettings(Model.columns)</p><p>The width of the editable columns is set in the Model.columns but no matter how I change the size, it always displays the same width.&nbsp; The width is too small in either state (editable or view) that you cannot see a full number if it is longer than 4 characters.</p><p>The columns that are set to not editable seem to follow the column width setting as passed in the columns.LoadSettings(Model.columns).&nbsp; I set the first editable field to a ridiculously large number and it made no difference.</p><p>What am I missing?</p><p>&nbsp;</p><p>&nbsp;</p>

This is a snippet of the columns - only showing a section for brevity since it is over 40 columns total (only half are visible.)

     IList<GridColumnSettings> columns = new List<GridColumnSettings>
        {
            new GridColumnSettings
            {
                Member = "rowId",
                //Member = "rowId",
                Title = "Row Id",
                Visible = false
                //Locked = true
            },
            new GridColumnSettings
            {
                Member = "fgid",
                Visible = false
            },
            new GridColumnSettings
            {
                Member = "PartNumber",
                //Member = "PartNumber",
                Title = "Part",
                Width = "150px",
                Filterable = true,
                //Visible = true,
                Locked = true
            },
            new GridColumnSettings
            {
                Member = "currentMon1",
                Title = titles[0],
                Visible = true,
                Width = "500px",
                Filterable = false,
                Locked = false
            },
             new GridColumnSettings
            {
                Member = "currentMon1Id",
                Title = "Mon1Id",
                Visible = false
            },

this is the grid:

  @(Html.Kendo().Grid<PartRowView>().Name("grid1")
        .Sortable()
        .Editable(x => x.Mode(GridEditMode.InLine))
        .Scrollable()
        .Filterable()
        .Resizable(r => r.Columns(true))
        .ToolBar(tools => tools.Excel().IconClass("k-icon k-i-download"))
        .Excel(excel => excel
             .FileName(Model.filename)
             .Filterable(true)
            .AllPages(true)
            .ProxyURL("/forecast/TestPage?handler=Save")
          )
        .Columns(columns => columns.LoadSettings(Model.columns)
        )
    .DataSource(ds => ds.Ajax()
    .Events(events => events.Error("errors_handler"))
    .ServerOperation(false)
    .Read(r => r.Url(Url.Action() +"?handler=Read").Data("forgeryToken"))
    .Update(u => u.Url(Url.Action() +"?handler=Update").Data("forgeryToken"))
    .Model(model =>
    {
        model.Id(p => p.rowId);
        model.Field(p => p.PartNumber).Editable(false);
        model.Field(p => p.currentMon1Id).Editable(false);
        model.Field(p => p.currentMon2Id).Editable(false);
        model.Field(p => p.currentMon3Id).Editable(false);
        model.Field(p => p.currentMon4Id).Editable(false);
        model.Field(p => p.currentMon5Id).Editable(false);
        model.Field(p => p.currentMon6Id).Editable(false);
        model.Field(p => p.currentMon7Id).Editable(false);
        model.Field(p => p.currentMon8Id).Editable(false);
        model.Field(p => p.currentMon9Id).Editable(false);
        model.Field(p => p.currentMon10Id).Editable(false);
        model.Field(p => p.currentMon11Id).Editable(false);
        model.Field(p => p.currentMon12Id).Editable(false);
        model.Field(p => p.currentMon13Id).Editable(false);
        model.Field(p => p.currentMon14Id).Editable(false);
        model.Field(p => p.currentMon15Id).Editable(false);
        model.Field(p => p.currentMon16Id).Editable(false);
        model.Field(p => p.currentMon17Id).Editable(false);
        model.Field(p => p.currentMon18Id).Editable(false);
    })
        .PageSize(100)
    )
    .Pageable()
)