ThomasK
ThomasK

Reputation: 2220

jquery trigger all input elements with blur on load

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...

Upvotes: 2

Views: 24855

Answers (7)

Neel
Neel

Reputation: 9880

If you happened to add the same prefix to all IDs of the input and wish to only blur these inputs all at once, you can use the wildcard selection and do it like this:

$("[id^=inputbox] input").trigger("blur");

Upvotes: 0

user3361464
user3361464

Reputation: 24

You can use bellow code it will help you

 $('input:text').each(function(){
        $(this).trigger('blur');
    })

Upvotes: 0

Petros Mastrantonas
Petros Mastrantonas

Reputation: 1046

you could try to trigger them programmatically by firing up

$("selector").trigger("blur"); 

api.jquery.com/trigger is your friend :-)

Upvotes: 0

Razor
Razor

Reputation: 29628

$('input[type=text], textarea').blur();

Or (potentially faster if everything is bound with jQuery):

$('input[type=text], textarea').triggerHandler('blur');

Upvotes: 3

Jeff Watkins
Jeff Watkins

Reputation: 6359

How about, taking your copy input to summary code and putting it into a function. keep the blur as it is (except calling this function rather than inline code) and on $(document).ready() select all of your text boxes and copy them over if they contain anything. Simpler than trying to fudge events.

Upvotes: 0

Ihor Deyneka
Ihor Deyneka

Reputation: 1409

Have you tried .trigger() ?

http://api.jquery.com/trigger/

Upvotes: 0

Sergei Zahharenko
Sergei Zahharenko

Reputation: 1524

You can use trick :)

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

Upvotes: 12

Related Questions