I am using Floatbox to render an inline div that is hidden from view and I have unfortunately discovered that it does not appear to be possible to submit a form within the Floatbox using an inline div as the content source. Is there something special I must do or is it simply not possible?
Here is an example of what I am doing: http://www.nathantaylor.info/
Thank you!
Posting a form in an inline DIV
Page: 1
| Author | Post |
|---|---|
|
Lakario
|
#1 Thu Apr 23, 2009 11:44 pm
|
| Guest | |
|
#2 Fri Apr 24, 2009 12:07 am
|
|
|
Administrator
Registered: Aug 2008
Posts: 3382
|
Yes, it's quite possible to submit a form that is loaded in floatbox from a hidden div. The problem on your page is that your form tags encompass the whole page - the anchors, the hidden div, everything. And the only thing in your hidden div is the submit button. So what happens when floatbox loads is the inner contents of the hidden div (the submit button) is copied out of that div and into floatbox. Now your submit button is no longer inside your form, so does not submit the form.
What you're ending up with is: <body> <form> ... </form> <div id="fbBox"> ... <input type="submit" name="btnSubmit" value="Submit" id="btnSubmit" /> ... </div> </body> The solution is to place your entire form inside the hidden div so that the entire form gets loaded into floatbox. Then it can function as a unit as intended. I also notice you have some styles set directly on the hidden div. Be forewarned that these styles won't get applied to the content that is copied into floatbox. It is the inner contents of the div that get moved into floatbox, and the styles on that hidden div tag will remain behind and apply to the (now empty) div back on the main page. Put your styles on a second div inside the hidden one and those styles will get moved into the box. Cheers... |
|
Lakario
|
#3 Fri Apr 24, 2009 12:23 am
|
| Guest |
Thank you for the detailed response. I very much appreciate it. Unfortunately, due to how ASP.NET works, I am only allowed one form tag per page so nesting additional ones wouldn't work in my case. For shame.
 |
|
#4 Fri Apr 24, 2009 12:32 am
|
|
|
Administrator
Registered: Aug 2008
Posts: 3382
|
No, no. Don't nest multiple forms. Just have the one form and put it inside your hidden div.
|
|
Lakario
|
#5 Fri Apr 24, 2009 12:53 am
|
| Guest |
On my actual implementation page the floatbox that is pulled up contains a Flash object that is getting clipped (covered) by pieces of the page behind the floatbox. This happens in Firefox but not in IE- I haven't tested it anywhere else...
The upper image is the page loading the floatbox, the lower image shows the floatbox open:  And the HTML that is being rendered behind the floatbox and clipped through: http://www.nathantaylor.name/fbbugs/content.html The Floatbox itself contains just a normal flash object (along with additional HTML) « Last edit by Unknown on Fri Apr 24, 2009 12:56 am. » |
|
Lakario
|
#6 Fri Apr 24, 2009 12:57 am
|
| Guest |
ASP.NET doesn't work that way really- the whole page must be wrapped in a single form tag (everything inside the <body>). |
|
#7 Fri Apr 24, 2009 2:43 am
|
|
|
Administrator
Registered: Aug 2008
Posts: 3382
|
That's one of the stupidest restrictions I've heard. Which century was it that .net was created in? A more practical response might be to point out that you could make your button just a plain button instead of a submit button and give it an onclick action to submit the form. <button type="button" onclick="document.form1.submit();">Submit</button> Or you could bring your form into floatbox via ajax or as an iframe (which I think you're already doing in your other sample). |
|
#8 Fri Apr 24, 2009 2:49 am
|
|
|
Administrator
Registered: Aug 2008
Posts: 3382
|
And on to your flash bleed-through...
I'm not sure what that page you linked to is supposed to show me. Can you link to the page that has the problem and I can see it happening? From the description though, it sounds like it would be worth changing the wmode that the flash object is being displayed under. Can you set the flash object's wmode to "window" and try it, and try it again with wmode=opaque? Odds are good one of those will get it rendering correctly. |
Page: 1