Current filter:
                                You should refresh the page.
                                  • Hi there,

                                    We want to make the focus stay at the errored cell, but currently the focus will go to the first editable cell, as shown in the screenshot. The invalid Disc. Price -80 is provided, in Controller this is detected and handled with error message, but the focus cannot stay on this cell but go to Quantity cell.

                                    Controller: 
                                    [C#]
                                    if (//DiscountPrice <= 0) { ViewData["EditError"] = "Line price must be a positive value."; ModelState.AddModelError("_FORM", "Line price must be a positive value."); return PartialView("LinesGrid", Model.ToList()); }

                                    ASPX:
                                    [C#]
                                    Html.DevExpress().GridView( settings => { //... settings.Width = Unit.Percentage(100); settings.KeyFieldName = "Id"; settings.SettingsPager.WithPager(); settings.SettingsResizing.ColumnResizeMode = ColumnResizeMode.NextColumn; settings.Styles.Cell.Wrap = DefaultBoolean.False; //...

                                    [C#]
                                    var discountedUnitPriceColumn = settings.Columns.Add("DiscountedUnitPrice"); discountedUnitPriceColumn.IsMoney4().Caption("Disc. Price"); discountedUnitPriceColumn.Width = Unit.Percentage(7); discountedUnitPriceColumn.IsEditableOrReadOnly(ViewContext, fieldsEditable); discountedUnitPriceColumn.SetDataItemTemplateEditableContent(ViewContext).CellStyle.CssClass = //... //... }).Bind(Model).GetHtml();



                                1 Solution

                                Creation Date Importance Sort by

                                Hello,

                                As I can see in your code, you are using the server-side validation. In this case, you need to set the focus to the required editor manually. Here are the main steps:

                                1) Handle the editor's client-side Init event.The Client-Side API article describes how to do this.
                                2) Check if the editor is valid using the MVCxClientEdit.GetIsValid method.
                                3) If the editor is not valid, call the Focus method. 

                                [C#]
                                settings.Columns.Add(col=> { col.FieldName = "UnitPrice"; col.EditorProperties().TextBox(tbox => { tbox.ClientSideEvents.Init = "onInit"; }); });

                                 

                                [JavaScript]
                                function onInit(s, e) { if (!s.GetIsValid()) s.Focus(); }

                                I've attached a video illustrating how this approach works. 

                                Please note that only one editor can be focused at a time, while there might be validation errors in several editors. So, this scenario is efficient when it is possible to get only one validation error. In other cases, you may need to adjust the client-side logic according to your needs.
                                If you face difficulties with implementation, please send us a sample runnable project illustrating your scenario. 

                                • Junlong Wang 05.16.2018
                                  Hi Helen, 

                                  Thanks very  much for your suggestions. From my understanding, this approach requires me to configure the TextBox.Init() method multiple times for each specific cell, however, I want to set the focus on whichever editable cell with the error. Is there a way to make it?
                                • Stason (DevExpress Support) 05.17.2018

                                  Hello Junlong,

                                  It is possible to use the MVCxClientGlobalEvents component and handle the MVCxClientGlobalEvents.ControlsInitialized event. In this case, you can find all the editors on the edit form, check if some of them is not valid and focus an invalid editor. To handle this event, use the following JavaScript code:

                                  [JavaScript]
                                  MVCxClientGlobalEvents.AddControlsInitializedEventHandler(OnInitialized); function OnInitialized(s, e) { // some steps }

                                  To find all the controls within the form, you can use their names. Or, you can use the client-side ASPxClientControl.GetControlCollection method that gets all the client instances of our controls, and then you can find the required one.

                                • Junlong Wang 05.17.2018
                                  Hi Stason, 

                                  I'm using ASPxGridView and saw that there's an equivalent of MVCxClientGlobalEvents, ASPxClientGlobalEvents. I assume I should refer to ASPxGridView, but I didn't meaningful example as a guide to use it. Would you mind providing a simple project or demo to show the usage?  Thank you very much
                                • Stason (DevExpress Support) 05.18.2018

                                  Hello Junlong,


                                  Initially, you provided the GridView extension's code, but in the latest message, you mentioned the use of ASPxGridView. Would you please clarify how you are using ASPxGridView in an MVC application?

                                  As for the example with Global events I suggest you take a look at the Using jQuery / jQuery UI libraries with DevExpress ASP.NET Controls / MVC Extensions KB article that illustrates how to use Global events for WebForms and MVC - refer to the Global events section.