Forums Ignite UI for jQuery
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Kenn Crowell
345
Custom Validation Example using Razor Syntax
posted

I have an igGrid that we would like to have custom client side Validation instead of the simple range validation.

I cannot find any examples of using custom validation with this type of syntax for setting up the features.

I need to evaluate Price1, Price2 and NotStocked together.

Thanks for your help in advance.

.Features(feature =>
{
feature.Updating().EnableDeleteRow(false).EnableAddRow(false).ColumnSettings(cs =>
{
cs.ColumnSetting().ColumnKey("DetailId").ReadOnly(true);
cs.ColumnSetting().ColumnKey("BrandDes").ReadOnly(true);
cs.ColumnSetting().ColumnKey("Price1").EditorType(ColumnEditorType.Numeric).ReadOnly(Model.ReadOnly).Required(false).NumericEditorOptions(o => o.ValidatorOptions(vo => vo.ValueRange(Model.MinPack1Price, Model.MaxPack1Price, Model.Pack1PriceRangeErrorMessage)));
cs.ColumnSetting().ColumnKey("Price2").EditorType(ColumnEditorType.Numeric).ReadOnly(Model.ReadOnly).Required(false).NumericEditorOptions(o => o.ValidatorOptions(vo => vo.ValueRange(Model.MinPack2Price, Model.MaxPack2Price, Model.Pack2PriceRangeErrorMessage)));
cs.ColumnSetting().ColumnKey("NotStocked").EditorType(ColumnEditorType.Checkbox).ReadOnly(Model.ReadOnly);
});
})

Parents
No Data
Reply
  • 1320
    Offline posted

    Hello Kenn,

    After investigating this further, I determined that using custom validation in Razor syntax could be achieved by the validatorOptions property - Custom and then specifying a method, which returns true or false, depending on the condition and specifying an error message. If validation should happen based on other cells within the same row, the id of the row can be stored in a variable every time a row enters edit mode. This is achieved the following way:

    feature.Updating().AddClientEvent("editRowStarting", "edit(evt, ui)").ColumnSettings(cs =>

    {

    cs.ColumnSetting().ColumnKey("Editor").EditorType(ColumnEditorType.Numeric).TextEditorOptions(o =>

    {

           o.ValidatorOptions(vo =>

           {

                  vo.Custom("validate", "not validated");

                  vo.Required(true, "required");

           });

    });

    });

     

    <script>

           var rowID;

    function validate(value, fieldOptions) {

                var idCell = $("#grid").igGrid("getCellValue", rowID, "ID");

                if (value == idCell)

                    return true;           

                return false;

            }

           function edit(evt, ui) {

                rowID = ui.rowID;

    }

    </script>     

    Where “ID” is the primary key column for the grid.

    In addition, more validation rules and options could be found in the following topic. They can be used with Razor by changing the syntax as the above snippet.

    Please let me know if you need more information.

    Regards,

    Monika Kirkova,

    Infragistics

Children
No Data