Forums Ignite UI for ASP.NET MVC
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
Rohit Rawat
515
Regarding igvalidation in iggrid in asp.net core mvc
posted

Hello  everyone,

So , I created a mvc project to bind and display data in igrid. The data binding and display part is done but now i want to apply validation in each column. I m confused how to do that. Can anyone please help me out with it with suitable example. The documentation shows use of igvalidator by targeting each element with id. but i have not created any elements i have created columns in grid and displayed data.

Here's my view code Please let me know how to apply validation and custom error messages with validations.

@using Infragistics.Web.Mvc;
@using System.Text.Json

@*@model IEnumerable<GridTransaction.Models.Student>*@
@* The Ignite UI for MVC Grid data source uses LINQ and therefore only accepts instances of IQueryable<T>.
Even when you opt to use the GridMode you will explicitly set the DataSource property which
requires an instance of IQueryable<T> .*@


<html>
<head>

</head>
<body>

<div>
<table id="grid">

</table>
</div>

<div class="text-center">
<button id="savechanges" class="btn btn-primary">Save</button>
</div>




</body>
</html>

@section scripts{

@*Batch Update*@
<script>
$(function () {
$("#grid").igGrid({
primaryKey: "id",
renderCheckboxes: true,
autoGenerateColumns: false,
updateUrl: "/Student/put/",
width: "100%",

columns: [
{ headerText: "Student ID", key: "id", dataType: "number", width: "15%" },
{ headerText: "Student Name", key: "name", dataType: "string", width: "30%" },
{ headerText: "Marks", key: "marks", dataType: "number", width: "30%" },
{
headerText: "Image",
key: "imagepath",
dataType: "string",
width: "15%",
template: "<img src='${imagepath}' width='50' height='50' />"
},
{ headerText: "Subject", key: "subject", dataType: "string", width: "15%" }
],
dataSourceUrl: "/Student/Data12",
dataSource: "/Student/Data",


features: [
{
name: "Selection",
mode: "row",
multipleSelection: true
},
{
name: "RowSelectors",
enableCheckBoxes: true,
enableRowNumbering: true
},
{
name: "GroupBy"
},
{
name :"Paging",
type:"local",
pageSize : 7
},

{
name: "Filtering",
columnSettings: [
{
columnKey: "selectColumn",
allowFiltering: false
}
]
},
{
name: "Sorting",
type: "remote",
// sortUrlKey: 'sort',
// sortUrlKeyAscValue: 'asc',
// sortUrlKeyDescValue: 'desc'
},
{
name: "Updating",
enableAddRow: true,
editMode: "row",
validation: true,
enableDeleteRow: true,
rowAdded: function (evt, ui) {
// Custom logic to execute when a row is added
console.log("Event arguments (ui):", ui);
console.log("Row data:", ui.rowId);
console.log(typeof (ui.values));
},
columnSettings: [
{
columnKey: "id",
readonly: true

},
{
columnKey: "name",
readonly: true,
required: true,

}
]
}
]
});

$("#savechanges").on("click", function () {
alert("Save button clicked");
// Save changes when the button is clicked
$("#grid").igGrid("saveChanges");
});
});

</script>


}





Parents Reply
  • 1700
    Offline posted in reply to Rohit Rawat

    Hello Rohit,

    Regarding the editorType, I recommend you reviewing the following documentation page, which provides information about the editorType property. It specifies the type of editor to use for the column and when it is set to text, an igTextEditor will be created for the column, which takes string data, that could also be a number as well as a regular text.

    For your second questions, this line of code is used to retrieve the HTML element associated with the igValidator. It allows you to work with the validation component for this specific column, so that you could set or modify validation-related options.

    For your final question I recommend you reviewing the following forum post, which explains how a cascading combo could be creating inside the igGrid and provides a small sample with three different combos that depend on each other.

    Please let me know if you need any further assistance.

    Regards,
    Ivan Kitanov

Children