locked
Enable client side validation in ASP.NET MVC RRS feed

  • Question

  • I enable client side validation in ASP.NET MVC 

    1) Add the following entries to Web.config
    <add key="ClientValidationEnabled" value="true"/>
    <add key="UnobtrusiveJavaScriptEnabled" value="true"/>

    2) Add JavaScript files
    <script type="text/javascript" src="@Url.Content("~/Scripts/lib/jquery-validation/dist/jquery.validate.min.js")"></script>
    <script type="text/javascript" src="@Url.Content("~/Scripts/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js")"></script>

    When I try to enter a space character to mandatory field, it cannot return any error message on client side. After I disable client side validation, it can show error message to notify user to input data

    Why there is difference between client side validation and server side validation?

    In addition, There is no response when I click on submit button. There is no problem when client side validation is disabled

    @using (Html.BeginForm())
    {
    	@Html.AntiForgeryToken()
    
    	@Html.ValidationSummary(true, "", new { @class = "text-danger" })
    
    	if (ViewBag.DisplayMode == "Edit")
    	{
    		@Html.HiddenFor(model => model.ID);
    	}
    
    	<div class="form-group">
    		<label for="groupName">@Html.LabelFor(model => model.Code) <span style="color:red">*</span></label>
    		@Html.TextBoxFor(model => model.Code, new { id = "txtCode", @class = "form-control", @maxlength = "10", @style = "width:300px" })
    		<label id="lblMesg"></label>
    		&nbsp;
    		@Html.ValidationMessageFor(model => model.Code, null, new { @class = "text-danger" })
    	</div>
    	<div class="form-group">
    		<label for="groupName">@Html.LabelFor(model => model.Desc) <span style="color:red">*</span></label>
    		@Html.TextBoxFor(model => model.Desc, new { @class = "form-control", @maxlength = "50", @style = "width:600px" })
    		&nbsp;
    		@Html.ValidationMessageFor(model => model.Desc, null, new { @class = "text-danger" })	
    	</div>	
    	<div class="row">
    		<div class="modal-footer">
    		<button type="button" class="btn btn-light" onclick="location.href='@Url.Action("Index", "Department")';">
    			<i data-feather="x" class="icons-sm"></i> Cancel
    		</button>
    		@if (ViewBag.DisplayMode == "Edit")
    		{
    			<button id="btnEdit" type="submit" class="btn btn-success waves-effect waves-light">
    				<i class="mdi mdi-content-save mr-1"></i> Save
    			</button>
    		}
    		else if (ViewBag.DisplayMode == "Add")
    		{
    			<button id="btnAdd" type="submit" class="btn btn-success waves-effect waves-light">
    				<i data-feather="plus" class="icons-sm"></i> Add
    			</button>
    		}
    		</div>
    	</div>
    }

    • Moved by CoolDadTx Wednesday, September 2, 2020 3:38 PM ASP.NET related
    Wednesday, September 2, 2020 9:26 AM

All replies

  • Hello,

    For ASP.NET use the following forum https://forums.asp.net/


    Please remember to mark the replies as answers if they help and unmarked them if they provide no help, this will help others who are looking for solutions to the same or similar problem. Contact via my Twitter (Karen Payne) or Facebook (Karen Payne) via my MSDN profile but will not answer coding question on either.

    NuGet BaseConnectionLibrary for database connections.

    StackOverFlow
    profile for Karen Payne on Stack Exchange

    Wednesday, September 2, 2020 11:16 AM