How to prevent the user from Selecting anegative number

When I am editing my grid field I have a number field. I have added validation to make sure they don't enter a negative number. i would like to know how I can make it to that when they are using the up and down arrows the number will not go below zero?



1 Reply

AG Ajith Govarthan Syncfusion Team September 10, 2021 08:37 AM UTC

Hi Danyelle, 

Thanks for contacting Syncfusion support. 

Query: When I am editing my grid field I have a number field. I have added validation to make sure they don't enter a negative number. i would like to know how I can make it to that when they are using the up and down arrows the number will not go below zero? 
 
Based on your query you don’t want to decrease the numeric textbox component value below the 0 in the edit dialog of our EJ2 Grid. So, we have shared the code example in that we have added the min property value as 0 using the edit params feature for freight column. Which will prevent the numeric textbox value decrease below the 0 using the increase and decrease buttons. Please refer the below code example for your reference. 

Code Example: 
Index.cshtml 

@Html.EJS().Grid("EditParam").DataSource((IEnumerable<object>)ViewBag.datasource).Columns(col => 
    col.Field("OrderID").HeaderText("Order ID").IsPrimaryKey(true).Width("120").ValidationRules(new { required = "true" }).TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add(); 
    col.Field("CustomerID").HeaderText("Customer Name").Width("150").ValidationRules(new { required = "true", minLength = 3 }).Add(); 
    col.Field("Freight").HeaderText("Freight").Width("120").EditType("numericedit").Format("C2").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Edit(new { @params = new { min = 0} }).Add(); 
    col.Field("ShipCountry").HeaderText("Ship Country").EditType("dropdownedit").Edit(new { @params = new { value = "Germany" } }).Width("150").Add(); 
    col.Field("OrderDate").HeaderText("Order Date").EditType("datepickeredit").Edit(new { @params = new { value = new Date() } }).Width("150").Add(); 
    col.Field("Verified").HeaderText("Verified").EditType("booleanedit").Edit(new { @params = new { checked = true } }).Width("150").Add(); 
}).AllowPaging().EditSettings(edit => { edit.AllowAdding(true).AllowEditing(true).AllowDeleting(true).Mode(Syncfusion.EJ2.Grids.EditMode.Normal); }).Toolbar(new List<string>() { "Add", "Edit", "Delete", "Update", "Cancel" }).Render() 


Please get back to us if you need further assistance. 

Regards, 
Ajith G. 


Loader.
Up arrow icon