如何使用外部javascript.js文件对表单（在内容页面上）进行客户端验证？ [英] How to do Client side validatation for the Form (on Content page ) with external javascript.js file ?
问题描述
我已经使用三个文本框和一个按钮对表单（位于我的内容页面）进行客户端验证？在我的按钮onclientclick上，我在我的主页头标记上的.js文件上调用了一个Javascript函数，但它无法正常工作。
.Js文件在我的脚本文件夹中：
I have do client side validation of form ( which is at my Content Page ) with three textboxes and one button ? And on my button onclientclick i called a Javascript function on .js file on my master page head tag but it is not working.
.Js File in my Script Folder :
function validate() {
var UserName = document.getElementById('<%= TextBox1.ClientID %>').value;
var City = document.getElementById('<%= TextBox2.ClientID %>').value;
var Designation = document.getElementById('<%= TextBox3.ClientID %>').value;
if (UserName == "") {
alert("Enter UserName");
return false;
}
if (City == "") {
alert("Enter City");
return false;
}
if (Designation == "") {
alert("Enter Designation");
return false;
}
}
My Master Page header section:
<head runat="server">
<title></title>
<link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />
<script src="Scripts/formvalidation.js" type="text/javascript"></script>
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</head>
My Content Page section:
<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Gridview.aspx.cs" Inherits="InsertUpdaateDeleteGridview.Gridview" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<div>
<table>
<tr>
<td>
UserName </td><td> <asp:TextBox ID="TextBox1" runat="server"></td></tr>
<tr><td>
City</td><td><asp:TextBox ID="TextBox2" runat="server"></td></tr>
<tr><td>
Designation</td><td> <asp:TextBox ID="TextBox3" runat="server"></td></tr>
<tr><td colspan="2"></td></tr>
<tr>
<td colspan="2" align="center">
<asp:Button ID="Button1" runat="server" Text="save" OnClientClick="return validate();" onclick="Button1_Click" /></td></tr>
<tr></tr></table></div>
推荐答案
这是一个在主/内容页面设置中从javascript / jquery调用控件的常见问题。
解决方案取决于多种因素的组合，例如脚本是在母版页或内容页面上，还是主页或内容页面上的控件。
退房这个由两部分组成的教程：从ASP.NET母版页和内容页面调用JavaScript [ ^ ]
It is a common problem in calling controls from javascript/jquery in a master/content page setup.
The solution depends on a combination of factors like if the script is on the master page or content page, or is the control on master page or content page.
Check out this 2-part tutorial: Calling JavaScript from ASP.NET Master Page and Content Pages[^]
我修改了以下行：
I modified following line:
<asp:button id="Button1" runat="server" text="save" onclientclick="return validate();" xmlns:asp="#unknown" />
i已删除onclick =Button1_Click，为了测试目的，我拖了formvalidation.js文件正好在div标签下面。 formvalidation.js文件中的validate（）正在调用，但由于在呈现页面时ID正在变化。现在您需要检查您的JavaScript代码。
i have deleted onclick="Button1_Click" and For testing purpose I dragged formvalidation.js file just below the div tag. Your validate() in formvalidation.js file is calling but since ID is getting change when page render. Now you need to check your JavaScript code.
<asp:Button ID="Button1" runat="server" Text="save" OnClientClick="return validate();" /></td></tr>
<tr></tr></table></div>
<script src="Scripts/formvalidation.js"></script>
这是你修改过的js代码：
Here is your modified js code:
function validate() {
var UserName = document.getElementById('MainContent_TextBox1').value;
var City = document.getElementById('MainContent_TextBox2').value;
var Designation = document.getElementById('MainContent_TextBox3').value;
if (UserName == "") {
alert("Enter UserName");
return false;
}
if (City == "") {
alert("Enter City");
return false;
}
if (Designation == "") {
alert("Enter Designation");
return false;
}
}
这篇关于如何使用外部javascript.js文件对表单（在内容页面上）进行客户端验证？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
