jQuery - отменить отправку формы (используя «return false»?)? - PullRequest
Новая
       53

jQuery - отменить отправку формы (используя «return false»?)?

9 голосов
/ 25 августа 2010

У меня проблемы с попыткой отменить отправку формы. Я следовал этому руководству (хотя я не делаю сценарий входа в систему), и, похоже, он работает для него.

Вот моя форма: 

    <form action="index.php" method="post" name="pForm">
        <textarea name="comment" onclick="if(this.value == 'skriv här...') this.value='';" onblur="if(this.value.length == 0) this.value='skriv här...';">skriv här...</textarea>
        <input class="submit" type="submit" value="Publicera!" name="submit" />
    </form>

А вот и jquery: 

$(document).ready(function() {
    $('form[name=pForm]').submit(function(){

        return false;

    });
});

Я уже импортировал jQuery в шапку и знаю, что он работает. Моей первой мыслью было, что это может быть устаревшим, но на самом деле это всего лишь год назад.

Так кто-нибудь видит, что не так?

Заранее спасибо.

РЕДАКТИРОВАТЬ: Из того, что я прочитал, самый простой и подходящий способ прервать отправку - это return false ? Но я не могу заставить его работать. Я искал на форуме, и я нашел несколько полезных тем, но ни одна из них на самом деле не работает. Я должен что-то напортачить.

Ответы [ 12 ]

0 голосов
/ 31 октября 2012

У меня была такая же проблема, и это было связано с использованием Rails и :remote => true в форме. Драйвер Rails jQuery входил и отправлял форму ajax, пока моя собственная функция пыталась остановить процесс отправки, используя return false и event.preventDefault().

Так что обратите внимание на рамки и действия по умолчанию, которые мешают вашему собственному javascript. return false должно работать:)

0 голосов
/ 25 августа 2010

Я столкнулся с похожими проблемами. Я решил их, удалив действие и метод формы до проверки, а затем добавив их обратно после проверки. Вот валидатор, который я написал: 

var Validator = function (formSelector) {
    this.formSelector = formSelector;
//  $(formSelector).submit(function() {return false;});
        this.Action = $(formSelector).attr("action");
        this.Method = $(formSelector).attr("method");
    $(formSelector).attr("action",function(){return ""}).attr("method",function(){return ""});  
        var donotsubmit = false;
        var notjustcheckbox = false;
        var checknotchecked = false;
    this.Required = new Array();
    this.Email = new Array();
    this.validate = function () {
        this.form = $(this.formSelector);
        var i = 0;
        for (i in this.Required){
            $(this.Required[i]).attr("value", function(index,attr){
                // Check on checkboxes...   
                if (this.getAttribute("type") == "checkbox"){
                    if (this.checked == false){ 
                        checknotchecked = true;
                        donotsubmit = true;
                    } else {
                    }       
                } else {    
                    if (attr == "" || attr == undefined){   
                        this.style.border = "1px solid red";
                        notjustcheckbox = true;
                        donotsubmit = true;     
                    } else {
                        this.style.border = "1px solid green";
                    }
                }
            });
        }
        i = 0;
        for (i in this.Email){
            $(this.Email[i]).attr("value", function(index,email){
                var filter=/^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i ;
                if (filter.test(email) == true || filter.test(email) == "true") {
                    this.style.border = "1px solid green";
                } else if (filter.test(email) == false) {
                    donotsubmit = true;
                    notjustcheckbox = true;
                    this.style.border = "1px solid red";
                }
            });
        }
        if (donotsubmit == true){
            if (checknotchecked == true && notjustcheckbox == true){    
                alert("Please correct the fields in red and check the required checkboxes");
            } else if (checknotchecked == true && notjustcheckbox == false){
                alert("Please check the required checkboxes");
            } else {
                alert("Please correct the fields in red");
            }
            checknotchecked = false;
            notjustcheckbox = false;
            donotsubmit = false;
        } else {
            $(formSelector).attr({action : ''+this.Action+''});
            $(formSelector).attr({method : ''+this.Method+''});
            $(formSelector).submit();   
        }
        return true;
    };
};

Вы можете реализовать это так: 

$(document).ready(function(){
    var myForm = new Validator("#formId");
        myForm.Required = new Array("input.lightborder");
                myForm.Email = new Array("#email");
                $("#form-submit-button-id").click(function(){
                    myForm.validate();
                });
});

Вы можете добавить CSS-селекторы для обязательных полей. Адрес электронной почты должен быть уникальным.

Страница:
...