We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

dropdownlist validation

Thread ID:

Created:

Updated:

Platform:

Replies:

149803 Dec 10,2019 07:34 AM UTC Dec 12,2019 05:21 AM UTC ASP.NET MVC - EJ 2 1
loading
Tags: DropDownList
jsu
Asked On December 10, 2019 07:34 AM UTC

Hi Team,

Can you please advise how to implement required field validation for dropdownlist in edit template.

We use @Html.EJS().DropDownList

Thanks

Sureshkumar P [Syncfusion]
Replied On December 12, 2019 05:21 AM UTC

Hi jsu, 
 
We could see that you want to set the validation for the column with dropdownlist in edit template. We have created the created the sample with your requirement, in that we have set the validation rules for the dropdownlist of shipCountry column. please refer the below code for example, documentation and sample for more information.  
 
 
 
App.vue  
@Html.EJS().Grid("Validation").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").Add();  
    col.Field("ShipCountry").HeaderText("Ship Country").ValidationRules(new { required = "true"}).Edit(new { create = "create", read = "read", destroy = "destroy", write = "write"}).Width("150").Add();  
  
}).AllowPaging().PageSettings(page => page.PageCount(2)).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()  
  
  
<script>  
    var elem;  
    var dObj;  
    var data = @Html.Raw(Json.Encode(ViewBag.DataSource));  
    var shipCountryData = ej.data.DataUtil.distinct(data, 'ShipCountry', true);  
    function create(args) {  
        elem = document.createElement('input');  
        return elem;  
    }  
    function write(args) {  
          
        dObj = new ej.dropdowns.DropDownList({  
  
            dataSource: shipCountryData,  
  
            fields: { text: 'ShipCountry', value: 'ShipCountry' }, placeholder: 'Ship Country'  
        });  
        dObj.appendTo(elem);  
    }  
  
    function destroy() {  
        dObj.destroy();  
    }  
    function read(args) {  
        return dObj.value;  
    }  
</script>  
 
Regards, 
Sureshkumar P.    


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon