Javascript.RU

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

Загадка onsubmit
Здравствуйте!
В попытках сделать обработку формы перед отправкой на сервер столкнулся с проблемой, которую ну никак не могу понять.
Вернее будет сказать, что проблем несколько.
Итак, есть вот такая форма:
<form name='Registration' method="post" onsubmit="return check(this)">
//Здесь идут элементы формы (на всякий случай упомяну, что они собраны в несколько таблиц)
</form>


Как видно onsubmit ссылается на функцию check.
Первая проблема заключается в том, что, если функция прописана во внешнем файле, то где бы и как бы на странице я не ссылался на этот файл ничего не работает.

Вторая проблема интереснее. Если я внутри страницы с формой под тегом <script> пишу вот такую функцию:
function check(form) {
  var name = form.login.value;
  alert(name);
}

То все замечательно работает (login - одно из имен для input в форме). Я нажимаю кнопку подтверждения, получаю alert с введенным текстом и страница автоматически перезагружается.

НО, если я точно так же прописываю вот такую функцию:
function check(form) {
    alert('Начали!');
     var login = form.login.value;
     var pass = form.password.value;
     var semipass = form.semiPassword.value;
     var mail = form.mail.value;
     ......
     var err = "";

     if (login.length < 4) err += "Слишком короткий логин \n";
     if (pass.length < 4) err += "Слишком короткий пароль \n";
     if (pass != semipass) err += "Пароли не совпадают \n";
     if ((mail.indexOf("@") < 0) || (mail.length < 2)) err += "Введен некорректный e-mail \n";
     ......

     if (err != "") return false;
     else return true;
   }

То при прочих равных функция не срабатывает. Я даже не получаю самого первого alert'а "Начали!", который специально для того и вводил, чтобы проверить срабатывание функции.

Что скажете? В чем проблема и что я не так делаю?
Ответить с цитированием
  #2 (permalink)  
Старый 17.01.2017, 09:03
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,215

Сообщение от asdffak
Первая проблема заключается в том, что, если функция прописана во внешнем файле, то где бы и как бы на странице я не ссылался на этот файл ничего не работает.
Видать не умеешь файлы подключать... А может и сами файлы такие писать/оформлять...
Сделай простенький пример и покажи тут, так многое прояснится...
Сообщение от asdffak
НО, если я точно так же прописываю вот такую функцию
Такой же вариант - сделай тестовый пример, на нем и посмотрим чего там у тебя...
Ответить с цитированием
  #3 (permalink)  
Старый 17.01.2017, 10:41
Новичок на форуме
Отправить личное сообщение для asdffak Посмотреть профиль Найти все сообщения от asdffak
 
Регистрация: 17.01.2017
Сообщений: 7

Сообщение от ksa Посмотреть сообщение
Видать не умеешь файлы подключать... А может и сами файлы такие писать/оформлять...
Да, вроде, все по "инструкции". Ну ок.
Вот пример подключения файла:
<html>
 <head>
 <title>Регистрация аккаунта: Спектроскопия координационных соединений</title>
 <link rel="stylesheet" type="text/css" href="style.css">
 <script type="text/javascript" src="../Script/Test.js"></script>
</head>
<body>
......
</body>
</html>

(html-файл хранится в папке Client в основной папке сайта, скрипт лежит в папке Script так же в основной папке сайта, поэтому путь прописываю таким вот образом, к слову такой вариант написания пути работает для скрипта, записанного в action)

Аналогично теги <script> пытался запихнуть в саму обрабатываемую форму и в конец файла перед закрывающим <body>.

Сам файл содержит только следующие строки, ничего лишнего:
function test(form) {
  var name = form.login.value;
  alert(name);
 }

Пытался так же достучаться до формы через document.form... не пробовал, правда, через getElementById (точнее пробовал, но только сейчас понял, что ошибся и спутал id и name формы), но, как говорят, должно работать и так. Может врут?

Собственно вот как выглядит html-файл сейчас:
<!DOCTYPE HTML>

<html>
 <head>
 <title>Регистрация аккаунта: Спектроскопия координационных соединений</title>
 <link rel="stylesheet" type="text/css" href="../style.css">
 <script type="text/javascript">
   function check(form) {
     var login = form.login.value;
     var pass = form.password.value;
     var semipass = form.semiPassword.value;
     var mail = form.mail.value;
     var surname = form.surname.value;
     var name = form.name.value;
     var lastname = form.lastname.value;
     var day = form.day.value;
     var month = form.month.value;
     var year = form.year.value;
     var city = form.city.value;
     var org = form.organization.value;
     var post = form.post.value;
     var m_phone = form.m_phone.value;
     var err = "";

     if (login.length < 4) err += "Слишком короткий логин \n";
     if (pass.length < 4) err += "Слишком короткий пароль \n";
     if (pass != semipass) err += "Пароли не совпадают \n";
     if ((mail.indexOf("@") < 0) || (mail.length < 2)) err += "Введен некорректный e-mail \n";
     if (surname.length < 2) err += "Введите фамилию полностью \n";
     if (name.length < 2) err += "Введите полное имя \n";
     if ((lastname.length < 2) && (lastname.length <> 0)) err += "Введите отчество полностью \n";
     if ((day.length < 2) || (month.length < 2) || (year.length < 4)) err += "Некорректно указан день рождения \n";
     if (city.length = 0) err += "Не указан город \n";
     if (org.length = 0) err += "Не указана организация \n";
     if (post.length = 0) err += "Не указана должность \n";
     if (m_phone.length = 0) err += "Укажите телефон для связи \n";

     if (err != "") return false;
     else return true;
   }
 </script>
 </head>

 <body>
  <div id="container">
   <div id="header">
     <h1> <span style="border-bottom:2px solid green"> <strong>Спектроскопия координационных соединений </strong> </span> </h1>
   
     <p class="menu" id="menu">  <!--Меню с переходом в другие разделы-->
     <a href="../index.html">Главная</a> 
     <a href="../Registration.html">Регистрация и тезисы</a>
     <a href="../Organizers.html">Организаторы</a>
     <a href="../Materials.html">Материалы конференции</a>
     <a href="../Place.html">Место проведения</a> <br> <br>
     <a href="../History.html">История конференции</a>
     <a href="../Contacts.html">Контакты</a>
     </p>
    
     <hr noshade width="100%" align="center" color="#311f84" size="3">
     <p text-align="center" style="margin-bottom:5px; padding:bottom:0px">
     <img src="../img/Emblem.png" height="110" width="110" style="margin-right:15px">
     <img src="../img/cropped-header.jpg" height="110" width="707">
     <img src="../img/Emblem.png" height="110" width="110" style="margin-left:15px">
     </p>
     
     <table id="submenu">
     	<tr>
     	<td valign="middle" width="120" style="font-size: 16px; font-style: oblique; font-weight: bold"> Мой кабинет: </td>
     	<td valign="middle" width="50" style="font-weight: bold"> <a href="Enter.html">Вход</a> </td>
     	<td valign="middle" width="740" style="font-weight: bold"> <span class="active">Регистрация</span> </td>
     	<td align="right"> <a href="../en/Main.html"><img src="../img/flag_en.png" height="30" width="46" title="English"></a> </td>
     	</tr>
     </table>
   </div>  

   <div id="content">
   <p style="margin-bottom: 10px">Для прохождения регистрации заполните форму ниже:</p>
   <p style="font-size: 12px"><sup>*</sup>Поля обязательные для заполнения</p>

   <form name='Registration' method="post" onsubmit="return check(this)"> <!-- action="../Script/Registrate.php" -->
   <!-- <script type="text/javascript" src="../Script/RegCheck.js"></script> -->
   <table class="formal" style="margin-bottom: 16px">
       <tr>
       <td>Логин<sup>*</sup>:</td> <td><input type="text" name="login"></td>
       </tr>
       <tr>
       <td>Пароль<sup>*</sup>:</td> <td><input type="password" name="password"></td>
       </tr>
       <tr>
       <td>Повторите пароль<sup>*</sup>:</td> <td><input type="password" name="semiPassword"></td>
       </tr>
       <tr>
       <td>e-mail<sup>*</sup>:</td> <td><input type="e-mail" name="mail"></td>  
       </tr>
   </table>
   <table class="formal" style="margin-bottom: 16px">
       <tr>
       <td>Фамилия<sup>*</sup>:</td> <td><input type="text" name="surname"></td>
       </tr>
       <tr>
       <td>Имя<sup>*</sup>:</td> <td><input type="text" name="name"></td>
       </tr>
       <tr>
       <td>Отчество:</td> <td><input type="text" name="lastname"></td>
       </tr>
       <tr>
       <td>День рождения<sup>*</sup>:</td> <td>дд <input type="text" name="day" size="1" maxlength="2">  мм <input type="text" name="month" size="1" maxlength="2">
       гггг <input type="text" name="year" size="2" maxlength="4"></td>
       </tr>
       <tr>
       <td>Город<sup>*</sup>:</td> <td><input type="text" name="city"></td>
       </tr>       
   </table>
   <table class="formal" style="margin-bottom: 16px" width="">
       <tr>
       <td colspan="3">Ученая степень<sup>*</sup>:</td>
       </tr>
       <tr>
       <td><input type="radio" name="degree" value="none" checked>нет</td>
       <td><input type="radio" name="degree" value="PhD">кандидат наук</td>
       <td><input type="radio" name="degree" value="PhD+">доктор наук</td>
       </tr>
       <tr>
       <td colspan="3">Ученое звание<sup>*</sup>:</td>
       </tr>
       <tr>
       <td><input type="radio" name="title" value="none" checked>нет</td>
       <td><input type="radio" name="title" value="asProf">доцент</td>
       <td><input type="radio" name="title" value="Prof">профессор</td>
       </tr>
       <tr>
       <td><input type="radio" name="title" value="academ">академик</td>
       <td><input type="radio" name="title" value="corresp">член-корреспондент</td>
       </tr>
   </table>
   <table class="formal">
       <tr>
       <td>Организация<sup>*</sup>:</td> <td><input type="text" name="organization"></td>
       </tr>
       <tr>
       <td>Должность<sup>*</sup>:</td> <td><input type="text" name="post"></td>
       </tr>
       <tr>
       <td>Рабочий телефон:</td> <td><input type="text" name="w_phone"></td>
       </tr>
       <tr>
       <td>Мобильный телефон<sup>*</sup>:</td> <td><input type="text" name="m_phone"></td>
       </tr>
   </table>
   <br>
   <input type="submit" value="Регистрация">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="reset" value="Очистить">
   </form>
   </div>

  </div>
 </body>
</html>

action и ссылку на файл с основным скриптом (который сейчас вписан в head) закомментировал, чтобы пока не мешались.

Такой вариант работает, хотя если вставить между тегами скрипт короткий тестовый вариант (указан выше, как пример отдельного файла), то все замечательно.

Последний раз редактировалось asdffak, 17.01.2017 в 10:51.
Ответить с цитированием
  #4 (permalink)  
Старый 17.01.2017, 11:06
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Сообщение от asdffak
if ((mail.indexOf("@") < 0) || (mail.length < 2)) err += "Введен некорректный e-mail
То есть 1@ (и даже такой " @"), это будет корректный адрес?

Отладчик покажет чего у вас накосячено.
Ответить с цитированием
  #5 (permalink)  
Старый 17.01.2017, 11:16
Новичок на форуме
Отправить личное сообщение для asdffak Посмотреть профиль Найти все сообщения от asdffak
 
Регистрация: 17.01.2017
Сообщений: 7

Сообщение от laimas
То есть 1@ (и даже такой " @"), это будет корректный адрес?
Готов выслушать предложения по оптимизации. Такого варианта, мне кажется, будет достаточно, да и лучшего, если честно, не знаю. Конечно можно заморачиваться с проверкой кучи условий вроде выделения домена и типа почтового сервера или хз чего еще, но как-то влом, если честно.
Ответить с цитированием
  #6 (permalink)  
Старый 17.01.2017, 11:30
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Сообщение от asdffak
Такого варианта, мне кажется, будет достаточно
Тогда, для начала, ВНИМАТЕЛЬНО прочесть это.
Ответить с цитированием
  #7 (permalink)  
Старый 17.01.2017, 11:42
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,215

Сообщение от asdffak
Вот пример подключения файла
Под примером я имел ввиду реально действующий пример.

Вот tmp.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<script src='tmp.js'></script>
<!--
<script src='http://code.jquery.com/jquery-latest.js'></script>
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
</script>
</head>
<body>
<button onclick='test();'>Test</button>
</body>
</html>

Это tmp.js
function test(){
	alert('Ok');
};

У меня все работает, если этот текст превратить в файлы и разместить в одном каталоге...
Ответить с цитированием
  #8 (permalink)  
Старый 17.01.2017, 14:38
Новичок на форуме
Отправить личное сообщение для asdffak Посмотреть профиль Найти все сообщения от asdffak
 
Регистрация: 17.01.2017
Сообщений: 7

Всем спасибо. Не знаю, что я делал не так, но заработал и подсоединенный внешний файл и сам код.

Как выяснилось код не работал из-за одной строчки:
if ((lastname.length < 2) && (lastname.length <> 0)) err += "Введите отчество полностью \n";

Привычка от паскаля обозначать не равно как <>. Все исправил.
Ответить с цитированием
  #9 (permalink)  
Старый 22.01.2017, 08:01
Профессор
Отправить личное сообщение для psiklop Посмотреть профиль Найти все сообщения от psiklop
 
Регистрация: 04.03.2015
Сообщений: 163

в этом учебнике есть регэксп для валидности email

var regexpemail = /^\s*[a-z0-9!$%&'*+\/=?^_`{|}~-]+(?:\.[a-z0-9!$%&'*+\/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+(?:[a-z]{2,4}|museum)\s*$/i;

if (value.search(regexpemail) == -1)) \\ошибка

кстати я сам для себя написал небольшую функцию которая исправляет домены на популярные, так как пользователи часто ошибаются и пишут с ошибкой слово yandex или вместо mail.ru - mail.com

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

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

Последний раз редактировалось psiklop, 22.01.2017 в 08:13.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
onsubmit отправка формы chelsea Общие вопросы Javascript 13 22.11.2018 14:18
Не срабатывает onsubmit в ie SuperTester Events/DOM/Window 4 11.03.2016 11:42
как изменить атрибут onsubmit в форме средствами jquery imediasun1 Элементы интерфейса 2 21.04.2014 19:10
Разобраться с onsubmit noak96 Общие вопросы Javascript 3 05.01.2014 00:53
У элемента img внутри form пропадает событие после onsubmit формы Eugene Events/DOM/Window 2 18.06.2009 19:21