Проверка формы JavaScript + Получить значения формы на основе входных имен без идентификаторов - PullRequest
1 голос
/ 10 августа 2011

Я пытаюсь выполнить проверку формы, но она, похоже, не работает, у меня нет идентификаторов на элементах, поэтому я собираю их с помощью функции getElementsByName и getElementsByClass (написано Robert Nyman )

Мой JS:

        window.onload = function() {    
        var feedbackForm = getElementsByClassName("formBuilder"),
            feedbackName = document.getElementsByName("form-name")[0],
            feedbackLocation = document.getElementsByName("form-location")[0],
            feedbackEmail = document.getElementsByName("form-email")[0],
            feedbackComment = document.getElementsByName("form-comment")[0];

        feedbackForm.onsubmit = function () {

            var errors, errorDiv, errorUL = [];

            // check all the fields
            if (!feedbackName.value.match(/\b\w+\b/)) { errors.push("Please enter your full name"); }
            if (!feedbackLocation.value.match(/\b\w+\b/)) { errors.push("Please enter your location"); }
            if (!feedbackEmail.value.match(/^([0-9a-zA-Z]+[\-._+&])*[0-9a-zA-Z_]+@([\-0-9a-zA-Z]+[.])+[a-zA-Z]{2,6}$/)) { errors.push("Please enter a correct email address"); }
            if (!feedbackComment.value.match(/\b\w+\b/)) { errors.push("Please make a comment"); }

            // if there are errors, display them and cancel submit
            if (errors.length) {
                errorDiv = document.querySelector('#feedback-errors') || appendDiv(feedbackForm, {id: 'feedback-errors', innerHTML: '<ul></ul>'});
                errorUL = errorDiv.querySelector('ul');
                errorUL.innerHTML = errors.map(function (v) {
                    return "<li>#{v}</li>";
                }).join('');
                return false;
            }
            // submit the form
            return true;    
        };          
    }

Вот моя скрипка, показывающая мою наценку & js: http://jsfiddle.net/calebo/rBnwh/

Приветствуются любые предложения о том, как лучше написать js.

ps: jQuery не разрешен.

1 Ответ

0 голосов
/ 10 августа 2011

Методы getElementsByClassName и getElementsByName возвращают массив элементов, и, следовательно, вы должны использовать индекс для использования определенного элемента.

...