Проверка формы
Здравствуйте
есть форма, вот пример <div id="ddd" style="border: 1px solid #CCCCCC; width:50px; height:10px; background:#f00; margin-bottom: 10px;"></div> <form action="#" method="post" name="ckform" onsubmit="return ckformcheck()"> <p>Имя</p> <input type="text" class="validate" name="name"/> <p>Email</p> <input type="text" class="validate" name="email"/> <p>Сообщение</p><textarea name="message" rows="6" cols="25"></textarea><br /> <input name="submit_bt" id="submit_bt" class="buttonRED" style="background:#ccc; padding:8px 10px;" type="submit" value="Отправить" /> </form>
<script type="text/javascript">
$("#submit_bt").live("click", function(){
var name = $(".validate").val();
if (name == "") {
$(".validate").addClass('fc-error');
}else{
$(".validate").removeClass('fc-error');
};
check();
});
check = function ckformcheck(form){
if($(".fc-error").length > 0){
alert("err");
//return false;
}else{
alert("NO err");
$("#submit_bt").attr('value', 'Форма отправляется');
$("#ddd").animate({'width':'900'},2500);
$("#submit_bt").prop('disabled', true);
return false;
// как продолжить отправку формы? return true;
};
};
</script>
есть проблемы, пожалуйста, помогите 1. в переменной check, в которую записана функция ckformcheck - не срабатывает onsubmit (return false; не останавливает форму) в браузерах ie и мозила Если функцию не записывать в переменную то все ок. Но нужно именно записать функцию в переменную. 2. в условии функции ckformcheck (если не существует инпута с классом .fc-error), то нужно выполнить следующие: - остановить отправку формы - изменить текст на кнопке, выполнить анимацию, заблокировать кнопку - продолжить отправку формы без onclick и preventDefault в кнопке нельзя менять type="submit" на type="button" , а также input на div |
Цитата:
Не делай обработку кнопки submit. Более оптимальный вариант - все делать в onsubmit формы. А вот это Цитата:
У функции и так есть идентификатор его и нужно использовать. Зачем еще и ссылку на эту функцию хранить? |
Цитата:
Цитата:
Я понял, что без preventDefault не обойтись, сделал так: <div id="ddd" style="border: 1px solid #CCCCCC; width:50px; height:100px; background:#f00; margin-bottom: 10px;"></div> <form action="#" method="post" name="ckform"> <p>Имя</p> <input type="text" class="validate" name="name"/> <p>Email</p> <input type="text" class="validate" name="email"/> <p>Сообщение</p><textarea name="message" rows="6" cols="25"></textarea><br /> <input name="submit_bt" id="submit_bt" class="buttonRED" style="background:#ccc; padding:8px 10px;" type="submit" value="Отправить" /> </form>
<script type="text/javascript">
function cancelEvent(event) { //IE
if (event.preventDefault) {
event.preventDefault();
} else {
event.returnValue = false;
}
}
$("#submit_bt").live("click", function(){
var name = $(".validate").val();
if (name == "") {
$(".validate").addClass('fc-error');
}else{
$(".validate").removeClass('fc-error');
};
check();
});
function check(event){
if($(".fc-error").length > 0){
//alert("err");
}else{
event.preventDefault();
var self = this;
//alert("NO err");
$("#submit_bt").attr('value', 'Форма отправляется');
$("#submit_bt").prop('disabled', true);
$("#ddd").animate({'width':'590'},2500, function(){ self.form.submit(); });
};
};
</script>
Передаю значение функции check в другую функцию (которая с кликом), в итоге preventDefault не работает. Если все сделать в одной функции, тогда все ОК. Но нужно именно значение одной функции, передать в другую. Это возможно? |
Цитата:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<!--
<script src='https://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'>
document.addEventListener('DOMContentLoaded',function(){
var o=document.getElementsByTagName('form')[0];
o.addEventListener('submit',function(Event){
// тут и нужно делать все действия
alert(1);
if (false) {
// если все хорошо - форма отправляется
} else {
// если что-то не так - форма не отправляется
Event.preventDefault();
};
});
});
</script>
</head>
<body>
<form>
<label for="num">Введите Ваш номер (число от 1 до 350): </label>
<input type="number" name="num" step="1" min="1" max="350" value="1" id="num"/>
<br>
<button type="submit">Подтвердите ввод</button>
</form>
</body>
</html>
|
Цитата:
|
Цитата:
Если так: check(event); то все равно не работает |
Цитата:
Цитата:
Программирование это не написание некоего текста на английскими буквами. :no: Тут кагбэ нужно понимать, что происходит и как этим всем пользоваться. Если не понимаешь - прямой путь в раздел Работа. |
ksa, спасибо!
|
| Часовой пояс GMT +3, время: 02:17. |