Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

Submit button does not work in Safari or Camino; works fine in FF

Posted on 2011-02-28
25
Medium Priority
?
774 Views
Last Modified: 2013-11-19
http://www.missionpeoplesystems.com/Clients/English_Adventure_Test/program.php?pk_program=2

Click the "Register Online Now" button, and click through to get to the registration form.

I've tested this entire flow and it's working well in Firefox, but the Submit button just sits there and does not respond when you try to click it in Safari or Camino.

Could someone take a look at the page code and let me know what I'm screwing up?
0
Comment
Question by:kpisor
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 11
  • 9
  • 3
25 Comments
 
LVL 14

Expert Comment

by:R-Byter
ID: 34995918
I would but its hard to look at this language. Do you have English or any version with Latin characters?

Regards
0
 

Author Comment

by:kpisor
ID: 34996683
Sure. Just go to any of the regular pages, and click the English toggle at the upper left of the page. Then go into the registration page. The form will be in English.
0
 
LVL 14

Expert Comment

by:R-Byter
ID: 34996787
That submit button doesnt work in Firefox also.
If I click submit without entering any data it gives me info that I need to fill some required fields. So button is working in FF and Safari. However, if I fill all required data, button doesnt work in any browser.
I suspect that the problem is in your validation since you call it in formCamperRegistration,js file:

$('#RegSubmit').click(function(){
     $('#RegForm').validate();
}); 

Open in new window


Change it like this:

$('#RegSubmit').validate({
        submitHandler: function(form) {
   	     form.submit();
        }
});

Open in new window


Regards
0
The top UI technologies you need to be aware of

An important part of the job as a front-end developer is to stay up to date and in contact with new tools, trends and workflows. That’s why you cannot miss this upcoming webinar to explore the latest trends in UI technologies!

 

Author Comment

by:kpisor
ID: 35023888
R-Byter:
That took care of the submit function, but the validate() doesn't work now. The form is submitted despite the substantial validation checks in the form.
Any suggestions?
Karl
0
 

Author Comment

by:kpisor
ID: 35023905
Typically, the validate() plugin for JQuery requires the form's ID

#RegForm

as the selector argument. Just so you know.
0
 
LVL 14

Expert Comment

by:R-Byter
ID: 35025463
My mistake with the previous code (copy/paste - root of all errors :) )
This should work:

$('#RegForm').validate({
        submitHandler: function(form) {
             form.submit();
        }
});

Open in new window


Regards
0
 

Author Comment

by:kpisor
ID: 35032149
Okay, made this change, and the form submit button stops working in Safari. Same as the original problem.

If the form is blank, and there is no entry, then the validate() runs correctly in Safari. However, if you make ANY entry at all in Safari, and then click the Submit button, it doesn't submit the form.

Form functions perfectly in Firefox.
0
 

Author Comment

by:kpisor
ID: 35032157
Try it yourself in Safari at
http://www.missionpeoplesystems.com/Clients/English_Adventure_Test/program.php?pk_program=2

You might toggle the language selection if you see the page in Japanese.
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 35458291
Seems to work in Safari5 on Mac
0
 

Author Comment

by:kpisor
ID: 35458312
In Safari 5--
Yes, the initial validation works. That is, validate() displays error messages normally. But, when you try to re-submit the form, the Submit button doesn't do anything. You are stuck on the page.
Also, if you enter all correct entries in Safari 5, the Submit button will go inactive.

JavaScript code for the submit function:
// Main registration form
             $('#RegForm').validate({
              submitHandler: function(form) {
                          form.submit();
              }
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 35458339
Why would you submit the form in the handler?
Just validate and have the form submit because the validation works
I do not think you need to do any .submit()
0
 

Author Comment

by:kpisor
ID: 35458402
How would you change the code?

My production site is currently running with
$('#RegSubmit').click(function(){
                  $('#RegForm').validate();                                             
             });
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 35458425
Not on a pc now but that looks wrong. I expect to see a ready statement with a validate assignment only and no click needed
0
 

Author Comment

by:kpisor
ID: 35458470
Please keep in mind that my main problem is my Mac/iPad/iPhone users, on Safari: they are 18% of my users, so I can't just force the solution that works in Firefox on them.
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 35458723
I was not thinking of FX only. I'll look later how you need to do this
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 35460015
Just do this. Nothing else is needed (assuming you have included the jQuery libraries

$(document).ready(function() {
  $('form').validate();
});
0
 

Author Comment

by:kpisor
ID: 35495160
Yes, I tried this on my test server. Same behavior persists. If validate() returns an error, and you fix it in Safari, then try to click on the submit button again, nothing happens. Firefox works fine.

Please help, I'd really like to fix this in Safari!
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 35496074
Can you post the HTML and script ?
0
 

Author Comment

by:kpisor
ID: 35499493
HTML: view source, the JQuery is written above.
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 35499501
Interesting

It works perfectly (saf 5 mac) until I select a t-shirt !? then the submit stops taking me to the fields in error

Very peculiar
0
 
LVL 75

Accepted Solution

by:
Michel Plungjan earned 2000 total points
ID: 35499505
DOH

The form stops at the wrong first field in CAMPER TWO!!!

You have to disable validation on invisible campers!!!
0
 

Author Closing Comment

by:kpisor
ID: 35503866
You got it right on.

I totally overlooked this, as I develop and test in Firefox, and FF passed the submit right through without stopping.

Thanks for your help!
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 35504357
You are welcome. Weird error.

So Fx actually ignores validation on fields in hidden divs?
0

Featured Post

Moving data to the cloud? Find out if you’re ready

Before moving to the cloud, it is important to carefully define your db needs, plan for the migration & understand prod. environment. This wp explains how to define what you need from a cloud provider, plan for the migration & what putting a cloud solution into practice entails.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
When the s#!t hits the fan, you don’t have time to look up who’s on call, draft emails, call collaborators, or send text messages. An instant chat window is definitely the way to go, especially one like HipChat. HipChat is a true business app. An…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

715 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question