Question

I’m using blur() to copy what the user writes in a form into a summary page at the end of a registration wizard. And this is working great.

But when I preset some field values and these are correct, nothing is copied since the user probably don’t gonna interacted with that particular filed. They’ll just gonna click continue.

Is there a way to trigger all text fields, textareas in order get those values copied aswell?

This is the function I’m using:

/**
 *  Author: Thomas Kile
 *  Desc:   Copy text from a form element into a given tag.
 **
 *  @param string $type type of form element
 *  @param string $from Id of form element to copy text/value from.
 *  @param string $to Id of element to copy text/value into.
 */
    function copyFormData(type,from,to)
    {   
        switch (type)
        {
            case 'text':  var copied_text = $(from).val();  break; //  get input text value
            case 'select': var copied_text = $(from+' option:selected').text();  break;
        }
        $(to).text(copied_text);   //  put inside this tag
    }

And this is how I’m using it:

$(firstName).blur(function(){   copyFormData('text',firstName,'strong#firstName');  });
$(lastName).blur(function(){    copyFormData('text',lastName,'strong#lastName');    });

Where should I put a trigger() event?
I used trigger() on a select>first option once the list was fetched with getJSON in order to populate next list automatically in a chained select thing.
But that was a bit different…

Answer 1

You can use trick 🙂

$('input').each(function(){
  $(this).trigger('blur');
  //each input event one by one... will be blured
})