Search code examples
gridviewdotvvm

Business pack gridview - Validation and form editing


I am using dotvvm for a line of business application and need to use the gridview extensively and have a few issues I need resolved.

What is the recommended approach for validating when using inline inserting and editing? I can't seem to display any validation errors. I need it to work for both data annotations and custom validation.

Secondly, is there anyway I can use form editing in the gridview instead of inline? I am thinking something like the editform or popupeditform in devexpress. https://demos.devexpress.com/ASPxGridViewDemos/GridEditing/EditModes.aspx

<div Validation.Target="{value: Bloods}" Validator.InvalidCssClass="has-error" Validator.SetToolTipText="true">
    <bp:GridView DataSource="{value: Bloods}" InlineEditMode="SingleRow" AllowInlineInsert="true" class="page-grid">
        <Columns>
            <bp:GridViewComboBoxColumn Validation.Enabled="true" Validator.Value="{value: BloodProductID}" Value="{value: BloodProductID}" DataSource="{value: ProductList }" ItemValueBinding="{value: Value}" ItemTextBinding="{value: Text}" HeaderText="Product" />
            <bp:GridViewTextColumn Value="{value: Comments}" HeaderText="Comments" />
            <bp:GridViewTemplateColumn>
                <ContentTemplate>
                    <dot:LinkButton Validation.Enabled="false" Click="{command: _parent.Bloods.RowEditOptions.EditRowId = rowID}">
                        <bs:Icon Type="pencil" />
                    </dot:LinkButton>
                </ContentTemplate>
                <InsertTemplate>
                    <bp:Button Text="Save"
                               Type="Success"
                               Click="{command: _parent.SaveNewBlood()}"
                               Visible="{value: _parent.IsBloodInserting}"
                               Validation.Target={value: _this} />
                    <bp:Button Text="Cancel"
                               Type="Danger"
                               Click="{command: _parent.CancelInsertBlood()}"
                               Visible="{value: _parent.IsBloodInserting}"
                               Validation.Enabled="false" />
                </InsertTemplate>
                <EditTemplate>
                    <bp:Button Text="Save" Type="Success" Click="{command: _parent.UpdateBlood(_this)}" Validation.Target={value: _this} />
                    <bp:Button Text="Cancel" Type="Danger" Click="{command: _parent.CancelEditBlood()}" Validation.Enabled="false" />
                </EditTemplate>
            </bp:GridViewTemplateColumn>
        </Columns>
        <EmptyDataTemplate>
            No bloods found.
        </EmptyDataTemplate>
       

    </bp:GridView>
</div>
    <br />
    <bp:Button Text="Add Blood"
               Click="{command: InsertBlood()}"
               Visible="{value: !IsBloodInserting}"
               Validation.Enabled="false" />
    <bp:DataPager DataSet="{value: Bloods}" />

Solution

  • For making an edit form inside GridView, you can use the RowDetailTemplate.

    About the validation in the row editing and inserting, it should work automatically if you have set Validator.InvalidCssClass or a similar property anywhere on a parent element - this will tell DotVVM how the validation errors should be visualized. Also, if you are using the ValidationSummary control, make sure to set IncludeErrorsFromChildren=true to display the errors from child objects (elements of the DataSource collection).

    The ideal way is then set Validation.Target={value: _this} to all the buttons in the edit form/row so the validation errors are being checked only in the currently edited item.