Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 11.02.2013, 00:55
Новичок на форуме
Отправить личное сообщение для bnr17 Посмотреть профиль Найти все сообщения от bnr17
 
Регистрация: 11.02.2013
Сообщений: 4

Некорректная обработка двух форм на странице
Доброго времени суток!

Целый день бьюсь и не могу понять - почему для двух разных форм ВСЕГДА вызывается только один обработчик??!! Подскажите, в чем ошибка???

<!DOCTYPE html
       PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="ru-RU" xmlns:og="http://ogp.me/ns#" itemscope itemtype="http://schema.org/Article">
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<div>
<!-- form 1 -->
	<form action="javascript: alert('call')" method="POST" id="call_form" name="form1">
		<table>
			<tr><td style=" padding: 3px;">Name</td><td style=" padding: 3px;"><input name="fio" type="text"></td></tr>
			<tr><td style=" padding: 3px;">Phone<span style="color: red;">*</span></td><td style=" padding: 3px;"><input id="phoneMain" name="phone" type="text"></td></tr>
			<tr><td style=" padding: 3px;">E-mail<span style="color: red;">*</span></td><td style=" padding: 3px;"><input id="mailMain" name="leadmail" type="text"></td></tr>
			<tr><td style=" padding: 3px;">&nbsp;</td><td style="padding: 3px;"><input class="inpb" type="submit" name="send" value="Send!"></td></tr>
		</table>
	</form>
	</div>
	
	<hr />

<!-- Form 2 -->
	<div>
	<form action="javascript: alert('hidden')" method="POST" id="hidden_form" name="form2">
		<table>
			<tr><td style=" padding: 3px;">Name</td><td style=" padding: 3px;"><input name="fio" type="text"></td></tr>
			<tr><td style=" padding: 3px;">Phone<span style="color: red;">*</span></td><td style=" padding: 3px;"><input id="phoneHidden" name="phone" type="text"></td></tr>
			<tr><td style=" padding: 3px;">E-mail<span style="color: red;">*</span></td><td style=" padding: 3px;"><input id="mailHidden" name="leadmail" type="text"></td></tr>
			<tr><td style=" padding: 3px;">&nbsp;</td><td style="padding: 3px;"><input class="inpb" type="submit" name="send" value="Send!"></td></tr>
		</table>
	</form>	
	</div>
<script type="text/javascript">

function isEmailValid(email) {
	return (/^([a-z0-9_\-]+\.)*[a-z0-9_\-]+@([a-z0-9][a-z0-9\-]*[a-z0-9]\.)+[a-z]{2,4}$/i).test(email);
}

// Always works this one
$('#call_form').submit(function () {
	var email = $('#mailMain').val();
	if (!isEmailValid(email)) {
		alert( 'NOT VALID: ' + email );
	} else {  alert('valid'); }		
});
	
$('#hidden_form').submit(function () {
	var email = $('#mailHidden').val();
	if (!isEmailValid(email)) {
		alert( 'NOT VALID: ' + email );
	} else {  alert('valid'); }
	
});
		
</script>
 
</body>
</html>
Ответить с цитированием
  #2 (permalink)  
Старый 11.02.2013, 01:11
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

У меня - разные (Проверил в ИЕ6-7, Опера FF и Хром
<!DOCTYPE html
       PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="ru-RU" xmlns:og="http://ogp.me/ns#" itemscope itemtype="http://schema.org/Article">
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<div>
<!-- form 1 -->
	<form action="javascript: alert('call')" method="POST" id="call_form" name="form1">
		<table>
			<tr><td style=" padding: 3px;">Name</td><td style=" padding: 3px;"><input name="fio" type="text"></td></tr>
			<tr><td style=" padding: 3px;">Phone<span style="color: red;">*</span></td><td style=" padding: 3px;"><input id="phoneMain" name="phone" type="text"></td></tr>
			<tr><td style=" padding: 3px;">E-mail<span style="color: red;">*</span></td><td style=" padding: 3px;"><input id="mailMain" name="leadmail" type="text"></td></tr>
			<tr><td style=" padding: 3px;">&nbsp;</td><td style="padding: 3px;"><input class="inpb" type="submit" name="send" value="Send!"></td></tr>
		</table>
	</form>
	</div>
	
	<hr />

<!-- Form 2 -->
	<div>
	<form action="javascript: alert('hidden')" method="POST" id="hidden_form" name="form2">
		<table>
			<tr><td style=" padding: 3px;">Name</td><td style=" padding: 3px;"><input name="fio" type="text"></td></tr>
			<tr><td style=" padding: 3px;">Phone<span style="color: red;">*</span></td><td style=" padding: 3px;"><input id="phoneHidden" name="phone" type="text"></td></tr>
			<tr><td style=" padding: 3px;">E-mail<span style="color: red;">*</span></td><td style=" padding: 3px;"><input id="mailHidden" name="leadmail" type="text"></td></tr>
			<tr><td style=" padding: 3px;">&nbsp;</td><td style="padding: 3px;"><input class="inpb" type="submit" name="send" value="Send!"></td></tr>
		</table>
	</form>	
	</div>
<script type="text/javascript">

function isEmailValid(email) {
	return (/^([a-z0-9_\-]+\.)*[a-z0-9_\-]+@([a-z0-9][a-z0-9\-]*[a-z0-9]\.)+[a-z]{2,4}$/i).test(email);
}

// Always works this one
$('#call_form').submit(function () {alert('#call_form')
	var email = $('#mailMain').val();
	if (!isEmailValid(email)) {
		alert( 'NOT VALID: ' + email );
	} else {  alert('valid'); }		
});
	
$('#hidden_form').submit(function () {alert('#hidden_form')
	var email = $('#mailHidden').val();
	if (!isEmailValid(email)) {
		alert( 'NOT VALID: ' + email );
	} else {  alert('valid'); }
	
});
		
</script>
 
</body>
</html>

Последний раз редактировалось Deff, 11.02.2013 в 01:14.
Ответить с цитированием
  #3 (permalink)  
Старый 11.02.2013, 01:12
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 32,045

Сообщение от bnr17
Подскажите, в чем ошибка???
и в каком браузере это проявляется?
Ответить с цитированием
  #4 (permalink)  
Старый 11.02.2013, 01:36
Новичок на форуме
Отправить личное сообщение для bnr17 Посмотреть профиль Найти все сообщения от bnr17
 
Регистрация: 11.02.2013
Сообщений: 4

хром
Ответить с цитированием
  #5 (permalink)  
Старый 11.02.2013, 01:37
Новичок на форуме
Отправить личное сообщение для bnr17 Посмотреть профиль Найти все сообщения от bnr17
 
Регистрация: 11.02.2013
Сообщений: 4

и опера тоже глючит, а эксплорер нормально

Последний раз редактировалось bnr17, 11.02.2013 в 01:41.
Ответить с цитированием
  #6 (permalink)  
Старый 11.02.2013, 01:42
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

bnr17,
Просите проверить приятелей с иных компутеров
Ответить с цитированием
  #7 (permalink)  
Старый 11.02.2013, 01:50
Новичок на форуме
Отправить личное сообщение для bnr17 Посмотреть профиль Найти все сообщения от bnr17
 
Регистрация: 11.02.2013
Сообщений: 4

Разобрался, у меня в исходнике в одном из input-ов не было закрывающего уголка >. Только поправил все заработало. Спасибо за помощь!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Обработка нажатия двух клавиш 12345678 Events/DOM/Window 1 15.01.2013 13:41
Опрос форм на странице pylyp Элементы интерфейса 2 17.07.2012 20:13
Обработка изображения до его отображения на странице после аякс запроса балерун Общие вопросы Javascript 1 30.05.2012 16:20
jQuery, pjax и обработка форм artemeff Общие вопросы Javascript 0 01.02.2012 12:34
Передача из двух форм kent2177 Общие вопросы Javascript 2 27.04.2009 12:11