I've encountered a similar problem with something I'm doing. Current project
is using asp.net 2 webforms which is a pain but that's the boundaries of
this project. 

Context: I have a Gridview which is databound with some html buttons and
then these buttons are wired up in jquery so that when clicked, they use
thickBox to display a div with various inputs and block the rest of the UI.
When that form is submitted I am using the Validation plug-in to validate
the inputs in the thickBox div. However the validation doesn't work. Digging
into this further - it doesnt validate the inputs in the thickBox at all.
Using firebug and visual event - i noticed that when thickBox(also tried
this with blockUI plug-in) displays the form - it clones the dom element (in
this case a div) and appends it outside of the form tags in the page and
into the thickBox divs. Because the div has been cloned and removed  and
placed somewhere outside of the pages form tag - the inputs aren't seen by
the validation plug-in. Hence calling isValid() on the validator object
returns true but the inputs are not validated as they aren't considered part
of the form. 

I'm working/looking for a solution now but if anyone has any suggestions
please fire back. Of course in asp.net 2 - you can only have one form
control.  

Is this similar to your problem?    

Matt



Phill Pafford wrote:
> 
> Did you ever find a solution? I'm facing the same problem.
> 
> Thanks,
> --Phill
> 
> 
> 
> bookme wrote:
>> 
>> 
>> Hi,
>> 
>> Sorry to bother you but I am not able to solve this problem so posting
>> in forum
>> 
>> I am using two jquery plugin
>> 1 Thickbox
>> 2 Jquery validation
>> 
>> Without thickbox validation is working fine but validation is not
>> working in thickbox.
>> 
>> There is two files ajaxLogin.htm and second is index.html
>> 
>> ajaxLogin.htm :
>> 
>> <script src="/thickbox/js/jquery.js" type="text/javascript"></script>
>> <script src="/thickbox/js/jquery.validate.js" type="text/
>> javascript"></
>> script>
>> <script>
>> $(document).ready(function() {
>>         // validate signup form on keyup and submit
>>         var validator = $("#signupform").validate({
>>                 rules: {
>>                         password: {
>>                                 required: true,
>>                                 minlength: 5
>>                         },
>>                         password_confirm: {
>>                                 required: true,
>>                                 minlength: 5,
>>                                 equalTo: "#password"
>>                         }
>>                 },
>>                 messages: {
>>                         password: {
>>                                 required: "Provide a password",
>>                                 rangelength: jQuery.format("Enter at
>> least {0} characters")
>>                         },
>>                         password_confirm: {
>>                                 required: "Repeat your password",
>>                                 minlength: jQuery.format("Enter at
>> least {0} characters"),
>>                                 equalTo: "Enter the same password as
>> above"
>>                         }
>>                 },
>>                 // the errorPlacement has to take the table layout
>> into account
>>                 errorPlacement: function(error, element) {
>>  
>> error.appendTo( element.parent().next() );
>>                 }
>> 
>>         });
>> });
>> 
>> </script>
>> <div id="signupwrap">
>> <form id="signupform" method="POST" action="http://localhost/thickbox/
>> index.html">
>> <table>
>> <tr>
>> <td class="label"><label id="lpassword" for="password">Password</
>> label></td>
>> <td class="field"><input id="password" name="password" type="password"
>> maxlength="50" value="" /></td>
>> <td class="status"></td>
>> </tr>
>> <tr>
>> <td class="label"><label id="lpassword_confirm"
>> for="password_confirm">Confirm Password</label></td>
>> <td class="field"><input id="password_confirm" name="password_confirm"
>> type="password" maxlength="50" value="" /></td>
>> <td class="status"></td>
>> </tr>
>>  </table>
>>     <input id="signupsubmit" name="signup" type="submit"
>> value="Signup" />
>> </form>
>> </div>
>> 
>> -------------------------------------------------------------------
>> 
>> index.html :
>> 
>> <head>
>> <style type="text/css" media="all">
>> @import "css/global.css";
>> </style>
>> <script src="/thickbox/js/jquery.js" type="text/javascript"></script>
>> <script src="/thickbox/js/thickbox_plus.js" type="text/javascript"></
>> script>
>> </head>
>> <body>
>> <li> ajaxLogin.htm?height=500&amp;width=550 ThickBox login 
>> </body>
>> </html>
>> 
>> Please tell me how can I get validation in thickbox?
>> 
>> Thanks
>> 
>> 
> 
> 

-- 
View this message in context: 
http://www.nabble.com/jquery-validation-using-thickbox-tp19996094s27240p25958217.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.

Reply via email to