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
405
Input validation in iggrid
posted

Exist there any option to easily validate the values changed in an igGrid? For example, if my model contains a "description" field with a maximum length of 50, so that in the grid I only can insert 50 characters (or an error message occurs).

For single editor controls I found this: http://igniteui.com/editors/data-annotation-validation

Such validation I need for the iggrid, exists there anything?

Simple example of my model:

public class SubTopicLocal
{
   [Required]
   public int SubTopicID { get; set; }

   [StringLength(10, ErrorMessage = "Error message abc ...")]
   public string Description { get; set; }
}

Simple example of my View:

@(Html.Infragistics()
   .Grid(Model)
   .ID("grid")
   .Height("100%")
   .Width("100%")
   .AutoGenerateColumns(false)
   .AutoGenerateLayouts(false)
   .RenderCheckboxes(true)
   .PrimaryKey("SubTopicID")
   .TemplatingEngine(GridTemplatingEngine.JsRender)
   .Columns(column =>
   {
      column.For(x => x.SubTopicsLocalCopy.First().SubTopicID).HeaderText("SubTopic ID");
      column.For(x => x.SubTopicsLocalCopy.First().Description).HeaderText("Description");
   })
   .Features(feature =>
   {
      feature.Updating().ColumnSettings(cs =>
      {
          cs.ColumnSetting().ColumnKey("SubTopicID").ReadOnly(true);
          cs.ColumnSetting().ColumnKey("Description").Required(true).Validation(true);
      });
      feature.Sorting();
      ...
      ...
   })
   .DataSourceUrl(Url.Action("GetSubTopicsLocal"))
   .UpdateUrl(Url.Action("SubTopicLocalSaveData"))
   .DataBind()
   .Render()
)

As like in the posted link, I need that by editing the (for example) "description", the iggrid validate the input, in this case that the length is smaller than 50. How can I do this? Analog to the validation with:

@Html.ValidationMessageFor(x => x.Description, ""new { @class = "text-danger" })
Parents
  • 17590
    Verified Answer
    Offline posted

    Hello Stanislas,

    Thank you for posting in our community.

    What I can suggest is setting a validator to your igGrid column and setting it`s maxLength property to 50. This property gets/sets maximum length of the text or maximum number of selected items. In order to set a validator for a particular column you should add column setting in the columnSettings collection in the Updating feature.  For example:

      @(Html.Infragistics().Grid(Model)
      .ID("grid1")
      .Height("700px")
      .AutoGenerateColumns(false)
      .PrimaryKey("ProductID")
      .Columns(col =>
    {
        col.For(c => c.ProductID).HeaderText("ProductID");
        col.For(c => c.Name).HeaderText("Name");
        col.For(c => c.ReleaseDate).HeaderText("ReleaseDate");
    })
    .Features(features =>
    {
        features.Updating().EditMode(GridEditMode.Row).ColumnSettings(cs => {
            cs.ColumnSetting().ColumnKey("Name").TextEditorOptions(o => o.ValidatorOptions(vo=> vo.MaxLength(10)));
        });
      
    })
    .DataSourceUrl(Url.Action("GetData"))
    .Render())

    I made a small sample and I am attaching it for your reference. In my sample I am adding a validator for the "Name" column and I am setting it`s maxLength to 10 symbols. If you enter a name longer than 10 symbols the validation message appears under the edited cell.

    Please have a look at my application and let me know if you have any questions afterwards.

    @(Html.Infragistics().Grid(Model)

    .ID("grid1")

    .Height("700px")

    .AutoGenerateColumns(false)

    .PrimaryKey("ProductID")

    .Columns(col =>

    {

    col.For(c => c.ProductID).HeaderText("ProductID");

    col.For(c => c.Name).HeaderText("Name");

    col.For(c => c.ReleaseDate).HeaderText("ReleaseDate");

    })

    .Features(features =>

    {

    features.Updating().EditMode(GridEditMode.Row).ColumnSettings(cs => {

    cs.ColumnSetting().ColumnKey("Name").TextEditorOptions(o => o.ValidatorOptions(vo=> vo.MaxLength(10)));

    });

    })

    .DataSourceUrl(Url.Action("GetData"))

    .Render())

    igGridValidatorMaxLength.zip
Reply Children