Попытка проверить каждый ввод формы и очистить его значение по умолчанию в jquery ajaxform () - PullRequest
0 голосов
/ 24 июня 2009

Я использую плагин ajaxform (), который до сих пор работает хорошо. Однако мои поля ввода имеют значения по умолчанию, и если пользователь просто отправляет нетронутую форму, мне нужно очистить их перед отправкой формы с помощью callback beforeSubmit:

В двух словах, я не знаю синтаксиса для проверки полей ввода форм и остановки отправки при необходимости. У меня есть идея, используя метод each () и this.defaultValue, и, возможно, возвращать false? но я не уверен в деталях.

Может ли кто-нибудь дать мне идею? Благодарю. Вот мой код, это функция checkValues ​​(), с которой я застрял.

$(document).ready(function(){


    //========= Functions =========


    function styleForm() {
        $('.quickcontact label').hide();
        $('input[type="text"],textarea').addClass("idleField");
        $('input[type="text"],textarea').focus(function() {
        $(this).removeClass("idleField").addClass("focusField");
            if (this.value == this.defaultValue){ 
                this.value = '';
            }
            if(this.value != this.defaultValue){
                this.select();
            }
        });
        $('input[type="text"],textarea').blur(function() {
            $(this).removeClass("focusField").addClass("idleField");
            if ($.trim(this.value) == ''){
                this.value = (this.defaultValue ? this.defaultValue : '');
            }
        });
    }


    //options for ajaxform() function   
    var options = { 
        target:        '.quickcontactDisplay',   // target element(s) to be updated with server response 
        beforeSubmit:  checkValues,  // pre-submit callback 
        success:       reBind  // post-submit callback 

        // other available options: 
        //url:       url         // override for form's 'action' attribute 
        //type:      type        // 'get' or 'post', override for form's 'method' attribute 
        //dataType:  null        // 'xml', 'script', or 'json' (expected server response type) 
        //clearForm: true        // clear all form fields after successful submit 
        //resetForm: true        // reset the form after successful submit 

        // $.ajax options can be used here too, for example: 
        //timeout:   3000 
    };          

    //rebinds the ajax functionality to updated form html
    function reBind() {
        // re-do the form, as it has just been replaced
        $('form.quickcontact').ajaxForm(options);
        styleForm();
    }

    //checks for default values of form on submit to prevent them being submitted   
    function checkValues(){

    } 

    // ==== logic =====

    $('form.quickcontact').ajaxForm(options);
    styleForm();        

});

И моя форма HTML:

<form action="/enquiries/add" method="post" id="EnquiryAddForm" class="quickcontact">

  <input type="hidden" value="POST" name="_method"/>
  <input type="hidden" id="EnquiryVisitorId" value="276" name="data[Enquiry][visitor_id]"/>
  <input type="text" id="EnquiryName" maxlength="200" value="Your name" name="data[Enquiry][name]"/>
  <input type="text" id="EnquiryEmailAddress" maxlength="200" value="Your Email" name="data[Enquiry][emailAddress]"/>
  <textarea id="EnquiryEnquiry" rows="6" cols="30" name="data[Enquiry][enquiry]">Your Email Address</textarea>
  <input type="submit" value="Ok, I'm done"/>
</form>

Ответы [ 4 ]

1 голос
/ 24 июня 2009

Вот идея, еще не проверила.

function checkValues(formData, jqForm, options)
{
   for( var i in formData)
      if ( formData[i].value == "")
          return false;
   return true;
} 
1 голос
/ 24 июня 2009

Вы злоупотребляете значением по умолчанию в качестве метки. Это вызывает у вас проблемы. Вместо того, чтобы попытаться обойти эти проблемы, я предлагаю вместо этого устранить причину.

При установке значений по умолчанию & mdash; установить значения по умолчанию . Не используйте значение по умолчанию в качестве псевдо-метки. Вместо этого используйте элемент <label>.

1 голос
/ 24 июня 2009

Разве вы не смотрели документацию ?

beforeSubmit: Функция обратного вызова, которая будет вызвана перед отправкой формы. обратный вызов beforeSubmit может быть предусмотрено как крючок для бега логику предварительной отправки или для проверки данные формы. Если 'beforeSubmit' обратный вызов возвращает ложь, то форма не будут представлены. обратный вызов beforeSubmit вызывается с тремя аргументами: данные формы в формат массива, объект jQuery для форма и объект параметров передается в ajaxForm / ajaxSubmit. массив данных формы принимает следующее форма:

[ { name: 'username', value: 'jresig' }, { name: 'password', value: 'secret' } ]

Default value: null 
0 голосов
/ 24 июня 2009

звучит так, как будто вам нужно:

  1. Пройдите через все входные / текстовые области в начале и возьмите значения по умолчанию, затем вставьте его в ассоциативный массив с идентификатором элемента в качестве ключа
  2. в пределах checkValues, повторите итерации входных данных еще раз и сравните значение предварительной отправки с вашим массивом - при нахождении соответствия вы можете установить значение "".
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...