Problem with cakePhp and nested ajax form in firefox 3.5

Question

Hi,

Is it possible to have a nested ajax form in cakephp and firefox ? i.e.

$ajax->form(form1...)
   table
     row
       $ajax->form(childForm_rowId)
       $form->end(childForm_rowId)
     endrow
   end table
$form->end

I found this works in IE7, but not in Firefox 3.5.1 Firefox will omit the childForm declaration, so the child forms (childForm_rowId) will use the first form(form1) action when it is submitted, which is not what we want.

Any idea how can I work around this?

Answer 1

You can't nest forms, as simple as that. Different browsers react differently when this role is broken. Depending on what you need to do you'll have to do some custom Javascripting, without nesting forms.

Answer 2

Nesting multiple FORM elements within each other is not valid HTML.

I will strongly advise you to re-consider your strategy.

• If you are only doing this for display purposes you can achieve a similar effect with CSS and positioning.
• If you want the inner form to 'extend' the outer form and use it's properties/inputs then you'll need a custom form-handling function in your javascript

Answer 3

Sadly I tried to do something similar and got the same result in FF 3.5.1. I didn't nest my forms, but merely had added a form to a page via AJAX and FF 3.5.1 still omitted the second form declaration. In every other browser tested including other versions of FF it looks like this:

<div><form><input /><input /></form></div>
<div><form><input /><input /></form></div>

But in FF 3.5.1 it came out like this:

<div><form><input /><input /></form></div>
<div><input /><input /></form></div>

I am still look for a solution to this, as 8% of my visitors are using 3.5.1 fortunately the action from the first form is not highly undesirable, but it takes a couple extra clicks to do the same thing.