Issue 9: Conditional modal on form validation
Status:  Fixed
Owner: ----
Closed:  Apr 2008
Reported by steveda...@gmail.com, Apr 23, 2008
Hello,
I am using a form submit to open an ajax nyromodal, which works fine if I 
just include something like this: $("#myForm").nyroModal({width: 420 })

However, I want to add validation to the form and only submit in the valid 
case. When I do something like this

$("#myForm").nyroModal({width: 420 })
$("#myForm").submit(function() {
        if (validation conidtions) {
            $("#myForm").submit();
        }
        else {
            alert("error");
            return false;
        }
});

the nyroModal opens regardless (the event is not canceled in the error 
case).

If I don't call nyroModal until validation passes, the modal doesn't open 
and a normal submit happens (full browser) in the valid case:

$("#myForm").submit(function() {
        if (validation conidtions) {
            $("#myForm").nyroModal({width: 420 }).submit();
        }
        else {
            alert("error");
            return false;
        }
});

Any thoughts?
Apr 24, 2008
#1 steveda...@gmail.com
I think I understand the underlying issue...2 Submit event registrations on the form 
that may lead to recursion. I will register my validation function on the submit 
button's click event. But I'm curious how this issue might be dealt with in general 
if I really had to capture the Submit event in addition to nyroModal's.
Apr 24, 2008
Project Member #2 nyro...@gmail.com
You can do it by using nyroModalManual like that:
$("#myForm").submit(function() {
        if (validation conidtions) {
            $("#myForm").nyroModalManual({width: 420 })
        }
        else {
            alert("error");
            return false;
        }
});

I didn't test, but it should work.
Let me know if everything is ok
Status: Fixed
Labels: -Type-Defect Type-Other
Apr 25, 2008
#3 steveda...@gmail.com
Thanks for thinking about this.

Unfortunately, this does not work. The submit event is trapped properly, but in the 
valid condition, the modal starts to draw, then the form posts as normal and takes 
over the entire browser. Take a look at http://38.99.15.19/test/nyro/demo.php where 
I have modified your first form to use this validation. I've tried variations, but 
whenever I seem to trap the form's submit event myself, things don't work quite 
right.
Apr 26, 2008
Project Member #4 nyro...@gmail.com
ah yes...
I forgot to return false or use the preventDefault() function.
Here is the code which should work anyway:
$("#myForm").submit(function(event) {
        if (validation conidtions) {
            $("#myForm").nyroModalManual({width: 420 })
        }
        else {
            alert("error");
        }
        // We want to stop the form submit anyway
        event.preventDefault();
        return false; // Not required as we already use the preventDefault function,
but I prefer do it to be sure
});
Apr 26, 2008
#5 steveda...@gmail.com
Thanks. Yes, I see how the preventDefault is needed. However, now take a look:

http://38.99.15.19/test/nyro/demo.php

The form's action is now getting wiped out.
Apr 27, 2008
Project Member #6 nyro...@gmail.com
That was a bug, fixed in the version 1.2.2 that I just released.
I also put your example in the project homepage and the demo.php include in the relase.

Thanks for your report.

Don't hesitate to send a link of the live site ;)