Member 14186004 Ответов: 2

Нужна помощь в пользовательской проверке с использованием javascript в ASP.NET


Создайте веб-страницу с различными текстовыми полями. Веб - страница должна обеспечивать следующие функциональные возможности с помощью JavaScript для создания элементов управления проверкой:

о текстовое поле для ввода из текстового поля города, чтобы войти в город, убедитесь, что и города разные.

o текстовое поле для ввода даты отправления убедитесь, что дата отправления указана после сегодняшнего дня

текстовое поле для ввода даты возврата убедитесь, что дата возврата указана после даты отправления

Вопрос: Как я могу использовать JavaScript для выполнения валидации и отображения сообщения об ошибке, если проверка завершится неудачно, как описано выше?

Что я уже пробовал:

Это мой код до сих пор:

JS:
function validateCity(source, args) {
	var fromCity = document.getElementById("txtFromCity").value;
	var toCity = document.getElementById("txtToCity").value;
	
	if (fromCity == toCity) {
		 args.IsValid = false;
	} else {
		return args.IsValid = true;
	}
}


ASP.NET:
<table id="roundTrip" style="display:none;">
				<tr>
					<td>
						<asp:Label ID="Label4" runat="server" Text="From"></asp:Label>
					</td>
					<td>
						<asp:TextBox ID="txtFromCity" runat="server" Text=""></asp:TextBox>
					</td>
				</tr>
				<tr>
					<td>
						<asp:Label ID="Label5" runat="server" Text="To"></asp:Label>
					</td>
					<td>
						<asp:TextBox ID="txtToCity" runat="server" Text=""></asp:TextBox>
						<asp:CustomValidator ID="custToCity" runat="server" 
							ControlToValidate="txtToCity" 
							ErrorMessage="Not Same" 
							Display="Dynamic" 
							ClientValidationFunction="validateCity" /> 
					</td>
				</tr>
				<tr>
					<td>
						<asp:Label ID="Label6" runat="server" Text="Depart Date"></asp:Label>
					</td>
					<td>
						<asp:TextBox ID="TextBox6" runat="server" Text=""></asp:TextBox>
					</td>
				</tr>
				<tr>
					<td>
						<asp:Label ID="Label7" runat="server" Text="Return Date"></asp:Label>
					</td>
					<td>
						<asp:TextBox ID="TextBox7" runat="server" Text=""></asp:TextBox>
					</td>
				</tr>
				</table>

2 Ответов

Рейтинг:
0

Divya Srivastava

От и до настоящего времени валидация

Для проверки даты используйте всплывающий календарь. Таким образом, пользователь может легко выбрать дату из календаря.

Шаги использования всплывающего календаря

Шаг 1 Сначала зарегистрируйте всплывающий календарь в верхней части вашей страницы aspx.

<%@ Register Assembly="RJS.Web.WebControl.PopCalendar.Net.2008" Namespace="RJS.Web.WebControl"
    TagPrefix="rjs" %>


Шаг 2 Используйте календарь с текстовыми полями даты.
 <tr>
   <td><asp:Label ID="Label6" runat="server" Text="Depart Date"</asp:Label></td>
   <td><asp:TextBox ID="TextBox6" runat="server" Text=""></asp:TextBox>
   <div style="margin-left: 130px; margin-top: -21px;">
     <rjs:PopCalendar ID="calDepartureDateFrom" runat="server" Control="TextBox6"
     From-Date="1950-01-01" Separator="/" Format="dd mm yyyy" 
     ShowErrorMessage="false" />
   </div>
</td>
 </tr>

 <tr>
  <td><asp:Label ID="Label7" runat="server" Text="Return Date"></asp:Label></td>
  <td><asp:TextBox ID="TextBox7" runat="server" Text=""></asp:TextBox>
   <div style="margin-left: 130px; margin-top: -21px;">
    <rjs:PopCalendar ID="calReturnDateTo" runat="server" 
     Control="TextBox7" From-Date="" Separator="/" Format="dd mm yyyy" 
     ShowErrorMessage="false" From-Control="TextBox6" />
    </div>
  </td>
 </tr>


Шаг 3 Установите дату начала календаря вылета после сегодняшнего дня(рассекая прошлые даты). Дата может быть установлена на странице cs(Code behind) в событии загрузки страницы.
protected void Page_Load(object sender, EventArgs e)  
{
   calDepartureDateFrom.StartDate = DateTime.Now+1; //dissabling past dates
}