Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I've been strugling with the following issue for over a week now so please excuse the long description. I want it to be as accurate and clear as possible:

I'm using the "simplr registration form" plugin to register new users. I need to add to the form an "address" field for the users to fill, and when the submit button is clicked the address should be sent to google maps API and recieve back the latitude and longitude which should then be saved in wpdb together with the rest of the user's data. To achieve this I've added the following to the php function which builds the html form:
- address input field
- 2 hidden fields for the lat&long
- jquery function that responds to the submit button and is supposed to do its thing after the button's clicked but before the form is actually submitted and handled by the plugin's php function.

Since using Google Maps API is asynchronous to get the job done I need to do the following:

Write a function that responds to the submit click.
That function should prevent the form from being submitted and call another function which does the google maps stuff and after it's finished submits the form.
The problem lies with the second submit. It just doesn't happen.
I have tried different ways (with jquery):
- a submit function that calls itself with the use of a flag that tells the first iteration not to submit and the second one to submit. The code works fine until the second iteration submit which simply doesn't work.
- a submit function that calls "this.submit()". Again, "this.submit()" doesn't cause the form to submit.
- a click function that should respond to the submit being clicked, do the google stuff and then call the submit function. Here even the click function doesn't fire at all.

// This is the button's definition:
$form .=  apply_filters('simplr-reg-submit', '<input type="submit" name="submit-reg" id="submit-reg" value="Register" class="submit button">');

// This is the php code that starts handling the submitted form 
if(isset($_POST['submit-reg'])) {

Here's an example for one of my attempts:

function codeAddress(callback)
{
    // do the google stuff
    // when finished submit the form
    $('#simplr-reg').get(0).submit();

    // it's all being done except for the submit part
}

$('#simplr-reg').submit(function(event)
{
    codeAddress(function(success){}); //callback from googlemaps
    event.preventDefault();
}

// Here's a simplified example:
$('#simplr-reg').submit(function(event)
{
    this.submit(); //doesn't cause the form to submit
    event.preventDefault();
});

If I don't use event.preventDefault() and submit in the first iteration it submits fine.

I've tried solving this with the help of the guys on stackoverflow but no one could find what's wrong so I'm guessing it's got something to do with WordPress or the plugin.

share|improve this question
    
What browser are you using to test this? I remember a previous fault with google maps javascript API where the first request would be fine but when you hit for the second time it would JS error in IE. I cannot find where the bug report is on google. –  Brady May 17 '11 at 9:49
    
@Brady, the problem isn't with google maps. Take a look at my last piece of code (starts with // Here's a simplified example:). There's no google code there but the problem remains. –  Ash May 17 '11 at 10:25
    
have you tried replacing event.preventDefault(); with return false; ? –  Bainternet May 17 '11 at 11:00
    
@Bainternet, yes. –  Ash May 17 '11 at 11:13
add comment

2 Answers

up vote 2 down vote accepted

The php function which handles the submitted values in this plugin checks first if the button's value isset. When using the original submit it is. When using preventDefault() and then calling submit() it isn't and therefor the php doesn't handle the submitted form but rebuilds it. To fix this I just added to the isset() check a check if the lat/long values are true. That did the trick.

share|improve this answer
add comment

I feel this question doesn't belong here but never the less.

OK Ash try your logic like this:

<script>
var wasGoogleFetchSuccess = 0;

$('#simplr-reg').submit(function() {

    if(wasGoogleFetchSuccess == 1) {
        return true; // I can now submit form as normal
    } else {
        goDoGoogleMapAddressSearch();
        return false; // dont submit form this time round
    }

});

function goDoGoogleMapAddressSearch() {
    //Do google map search
    //On success or completion do the following:
    $("blah blah blah").success(function() { // Just an example
        wasGoogleFetchSuccess = 1;
        $('#simplr-reg').submit();
    });
}
</script>
share|improve this answer
    
thanks. About the question's location - I've asked a few questions on stackoverflow but no one found a solution there. So I figured the problem might be with the plugin or WP files. About your code - you can see it's pretty similar to the code I've posted, but I also tried code that looks almost exactly as yours and the problem is always with the inner call to submit (inside your goDoGoogle function). It doesn't cause the form to submit. I'll try your exact code anyway. –  Ash May 17 '11 at 11:22
    
By anychance your google function is never getting to the submit() ?? have you tried putting an alert() in the above sumbit to see it is being triggered? –  Brady May 17 '11 at 11:25
    
I've tried your code but I get the same results. The google function does its stuff fully and an alert before the submit fires but then the form doesn't submit. Instead of getting to the "you were registered successfully" screen the registration form simply reloads. –  Ash May 17 '11 at 20:06
    
code code test –  Ash May 18 '11 at 6:30
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.