You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@cocoon.apache.org by Andrew <an...@gmail.com> on 2006/07/21 23:15:53 UTC
Ajax - 'No handler found for element head' - 'No handler found for element body'
Hi,
I have an ajaxified form which has a number of required fields. If you
submit the form without filling in any of the required fields 2 alert are
displayed. The first says 'No handler found for element head. Show server
response?', and the second alert says 'No handler found for element body.
Show server response?'. If you click yes to both questions another window
opens up showing your form page minus any of the form fields! If all
required fields are entered correctly then the form submits as normal. What
could be the issue here? When the page firtst loads I get the following dojo
debug lines:
DEBUG: Loading URIresources/dojo/../forms/js/__package__.js
DEBUG: Loading URIresources/dojo/../forms/js/common.js
DEBUG: Loading URIresources/dojo/../forms/js/CFormsForm.js
DEBUG: Loading URIresources/dojo/../ajax/js/BUHandler.js
DEBUG: Loading URIresources/dojo/../ajax/js/insertion.js
DEBUG: Loading URIresources/dojo/../forms/js/CFormsRepeater.js
DEBUG: Loading URIresources/dojo/../forms/js/CFormsSuggest.js
DEBUG: Loading URIresources/dojo/src/widget/html/ComboBox.js
DEBUG: Loading URIresources/dojo/src/widget/ComboBox.js
DEBUG: Loading URIresources/dojo/src/widget/html/stabile.js
DEBUG: Loading URIresources/dojo/src/widget/InlineEditBox.js
My sitemap is as follows:
<map:match pattern="**viewform-*.xml">
<map:generate type="newjx" src="jx/{2}.jx"/>
<map:transform type="browser-update"/>
<map:transform type="cinclude"/>
<map:transform type="xslt-saxon" src="style/{2}.xsl"/>
<map:transform type="cinclude"/>
<map:transform type="i18n">
<map:parameter name="locale" value="en-US"/>
</map:transform>
<map:transform src="template-style/forms-samples-styling.xsl
"/>
<map:transform type="i18n">
<map:parameter name="locale" value="en-US"/>
</map:transform>
<map:select type="ajax-request">
<map:when test="true">
<map:serialize type="xml"/>
</map:when>
<map:otherwise>
<map:serialize type="html"/>
</map:otherwise>
</map:select>
</map:match>
and my JX form is as follows:
<jx:import uri="resource://org/apache/cocoon/forms/generation/jx-macros.xml
"/>
<tableR>
<ft:form-template action="saveNewAccount.kont" name="Form1"
method="POST" ajax="true">
<ft:continuation-id/>
<table width="294" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="images/tool.gif" width="5" height="16" /></td>
<td width="265"><img src="images/tool.gif" width="289"
height="16" /></td>
</tr>
<tr>
<td colspan="2"><img src="images/detailtitle.gif" width="294"
height="25" /></td>
</tr>
<tr>
<td colspan="2"><img src="images/tool.gif" width="1"
height="5" /></td>
</tr>
<tr>
<td width="5"> </td>
<td width="265" class="newstext">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="55" valign="bottom"><img
src="images/firstname.gif" width="89" height="16" /></td>
<td width="220" valign="top" align="left">
<fi:group>
<ft:widget id="fname">
<fi:styling type="text"
size="22" class="keyinbox"/>
</ft:widget>
</fi:group>
</td>
</tr>
</table></td>
</tr>
<tr>
<td width="5"><img src="images/tool.gif" width="5" height="10"
/></td>
<td width="265">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="55" valign="bottom"><img
src="images/lastname.gif" width="89" height="16" /></td>
<td width="220" valign="top">
<fi:group>
<ft:widget id="lname">
<fi:styling type="text" size="25"
class="keyinbox"/>
</ft:widget>
</fi:group>
</td>
</tr>
</table></td>
</tr>
<tr>
<td width="5"> </td>
<td width="265">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="55" valign="bottom"><img
src="images/address1.gif" width="89" height="16" /></td>
<td width="220" valign="top">
<fi:group>
<ft:widget id="address1">
<fi:styling size="30"
class="keyinbox" type="text" />
</ft:widget>
</fi:group>
</td>
</tr>
</table></td>
</tr>
<tr>
<td width="5"> </td>
<td width="265">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="55" valign="bottom"><img
src="images/address2.gif" width="89" height="16" /></td>
<td width="220" valign="top">
<fi:group>
<ft:widget id="address2">
<fi:styling size="25"
class="keyinbox"/>
</ft:widget>
</fi:group>
</td>
</tr>
</table></td>
</tr>
<tr>
<td width="5"> </td>
<td width="265">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="55" valign="bottom"><img
src="images/address3.gif" width="89" height="16" /></td>
<td width="220" valign="top">
<fi:group>
<ft:widget id="address3">
<fi:styling size="25"
class="keyinbox"/>
</ft:widget>
</fi:group>
</td>
</tr>
</table></td>
</tr>
<tr>
<td width="5"> </td>
<td width="265"><table width="100%" border="0" cellspacing="0"
cellpadding="0">
<tr>
<td width="55" valign="bottom"><img
src="images/postcode.gif" width="89" height="16" /></td>
<td width="220" valign="top">
<fi:group>
<ft:widget id="postcode">
<fi:styling size="15"
class="keyinbox"/>
</ft:widget>
</fi:group>
</td>
</tr>
</table></td>
</tr>
<tr>
<td width="5"> </td>
<td width="265"><table width="100%" border="0" cellspacing="0"
cellpadding="0">
<tr>
<td width="55" valign="bottom"><img
src="images/country.gif" width="72" height="16" /></td>
<td width="220" valign="top">
<fi:group>
<ft:widget id="country">
<fi:styling size="20"
class="keyinbox"/>
</ft:widget>
</fi:group>
</td>
</tr>
</table></td>
</tr>
<tr>
<td width="5"> </td>
<td width="265"><table width="100%" border="0" cellspacing="0"
cellpadding="0">
<tr>
<td width="55" valign="bottom"><img
src="images/email.gif" width="72" height="16" /></td>
<td width="220" valign="top">
<fi:group>
<ft:widget id="email">
<fi:styling size="25"
class="keyinbox"/>
</ft:widget>
</fi:group>
</td>
</tr>
</table></td>
</tr>
<tr>
<td> </td>
<td><table width="100%" border="0" cellspacing="0"
cellpadding="0">
<tr>
<td width="55" valign="bottom"><img
src="images/hometelephone.gif" width="128" height="16" /></td>
<td width="220" valign="top">
<fi:group>
<ft:widget id="hphone">
<fi:styling size="20"
class="keyinbox"/>
</ft:widget>
</fi:group>
</td>
</tr>
</table></td>
</tr>
<tr>
<td> </td>
<td><table width="100%" border="0" cellspacing="0"
cellpadding="0">
<tr>
<td width="55" valign="bottom"><img
src="images/mobile.gif" width="72" height="16" /></td>
<td width="220" valign="top">
<fi:group>
<ft:widget id="mphone">
<fi:styling size="20"
class="keyinbox"/>
</ft:widget>
</fi:group>
</td>
</tr>
</table></td>
</tr>
<tr>
<td> </td>
<td><table width="100%" border="0" cellspacing="0"
cellpadding="0">
<tr>
<td width="55" valign="bottom"><img
src="images/username.gif" width="89" height="16" /></td>
<td width="220" valign="top">
<fi:group>
<ft:widget id="user">
<fi:styling size="20"
class="keyinbox"/>
</ft:widget>
</fi:group>
</td>
</tr>
</table></td>
</tr>
<tr>
<td> </td>
<td><table width="100%" border="0" cellspacing="0"
cellpadding="0">
<tr>
<td width="55" valign="bottom"><img
src="images/password.gif" width="89" height="16" /></td>
<td width="220" valign="top">
<fi:group>
<ft:widget id="pass">
<fi:styling size="20"
class="keyinbox"/>
</ft:widget>
</fi:group>
</td>
</tr>
</table></td>
</tr>
<tr>
<td colspan="2"><img src="images/tool.gif" width="20"
height="5" /></td>
</tr>
<tr>
<td> </td>
<td><table width="100%" border="0" cellspacing="0"
cellpadding="0">
<tr>
<!--<td width="42"><a href="javascript:formSubmit(
document.Form1)" onmouseout="MM_swapImgRestore()"
onmouseover="MM_swapImage('sumit','','images/sumit-over.gif',1)"><img
src="images/sumit-none.gif" alt="sumit" name="sumit" width="42" height="15"
border="0" /></a></td>-->
<td width="42"><input type="submit" id="save"
value="Save" class="button"/></td>
<td width="4"><img src="images/tool.gif" width="4"
height="8" /></td>
<td width="42"><a href="javascript:formReset(
document.Form1)" onmouseout="MM_swapImgRestore()"
onmouseover="MM_swapImage('cancel','','images/cancel-over.gif',1)"><img
src="images/cancel-none.gif" alt="cancel" name="cancel" width="42"
height="15" border="0" /></a></td>
<td> </td>
</tr>
</table></td>
</tr>
<tr>
<td colspan="2"><img src="images/tool.gif" width="20"
height="5" /></td>
</tr>
<tr>
<td colspan="2"><span
class="indextext2"> ${msg}</span></td>
</tr>
<tr>
<td colspan="2"><img src="images/tool.gif" width="1"
height="11" /></td>
</tr>
</table>
</ft:form-template>
</tableR>
regards
Andrew
Re: Ajax - 'No handler found for element head' - 'No handler found
for element body'
Posted by Jason Johnston <co...@lojjic.net>.
Andrew wrote:
> Hi Jason,
> question? Why will the ajax process only be initiated with:
>
> <input type="submit" id="save" value="Submit" />
>
> and not:
>
> <a href="javascript:document.Form1.submit ()"></a> ?
>
> When the javascript methodology to submit a page is used, the whole page
> reload!
>
That's just how AJAX works. You don't actually submit the form, you use
JavaScript to trigger an XMLHttpRequest in the background.
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@cocoon.apache.org
For additional commands, e-mail: users-help@cocoon.apache.org
Re: Ajax - 'No handler found for element head' - 'No handler found for element body'
Posted by Andrew <an...@gmail.com>.
Hi Jason,
question? Why will the ajax process only be initiated with:
<input type="submit" id="save" value="Submit" />
and not:
<a href="javascript:document.Form1.submit()"></a> ?
When the javascript methodology to submit a page is used, the whole page
reload!
regards
Andrew
On 22/07/06, Andrew <an...@gmail.com> wrote:
>
> Jason,
> Eureka! At last I have ajax working with my forms!!!!
>
> Many thanks for pointing me in the right direction.
>
> regards
>
> Andrew
>
>
> On 22/07/06, Jason Johnston <co...@lojjic.net> wrote:
> >
> > Andrew wrote:
> > > Hi,
> > > I have an ajaxified form which has a number of required fields. If you
> > > submit the form without filling in any of the required fields 2 alert
> > > are displayed. The first says 'No handler found for element head. Show
> >
> > > server response?', and the second alert says 'No handler found for
> > > element body. Show server response?'. If you click yes to both
> > questions
> > > another window opens up showing your form page minus any of the form
> > > fields! If all required fields are entered correctly then the form
> > > submits as normal. What could be the issue here? When the page firtst
> > > loads I get the following dojo debug lines:
> > >
> > > DEBUG: Loading URIresources/dojo/../forms/js/__package__.js
> > > DEBUG: Loading URIresources/dojo/../forms/js/common.js
> > > DEBUG: Loading URIresources/dojo/../forms/js/CFormsForm.js
> > > DEBUG: Loading URIresources/dojo/../ajax/js/BUHandler.js
> > > DEBUG: Loading URIresources/dojo/../ajax/js/insertion.js
> > > DEBUG: Loading URIresources/dojo/../forms/js/CFormsRepeater.js
> > > DEBUG: Loading URIresources/dojo/../forms/js/CFormsSuggest.js
> > > DEBUG: Loading URIresources/dojo/src/widget/html/ComboBox.js
> > > DEBUG: Loading URIresources/dojo/src/widget/ComboBox.js
> > > DEBUG: Loading URIresources/dojo/src/widget/html/stabile.js
> > > DEBUG: Loading URIresources/dojo/src/widget/InlineEditBox.js
> > >
> > > My sitemap is as follows:
> > >
> > > <map:match pattern="**viewform-*.xml">
> > > <map:generate type="newjx" src="jx/{2}.jx"/>
> > > <map:transform type="browser-update"/>
> > > <map:transform type="cinclude"/>
> > > <map:transform type="xslt-saxon" src="style/{2}.xsl"/>
> > > <map:transform type="cinclude"/>
> > > <map:transform type="i18n">
> > > <map:parameter name="locale" value="en-US"/>
> > > </map:transform>
> > > <map:transform src="template-style/forms-
> > > samples-styling.xsl"/>
> > > <map:transform type="i18n">
> > > <map:parameter name="locale" value="en-US"/>
> > > </map:transform>
> > > <map:select type="ajax-request">
> > > <map:when test="true">
> > > <map:serialize type="xml"/>
> > > </map:when>
> > > <map:otherwise>
> > > <map:serialize type="html"/>
> > > </map:otherwise>
> > > </map:select>
> > > </map:match>
> >
> > Andrew--
> >
> > I think you need to understand how the AJAX publishing works, in
> > particular the browser-update transformer.
> >
> > When an AJAX request is received, the response to the browser should not
> > be the entire document (that's not very AJAX-ey!), but only the parts
> > that need to be updated in the DOM. This is the job of the
> > browser-update transformer; it filters out everything except elements in
> > the "bu:" namespace (produced by the CForms JX macros), which the
> > client-side JavaScript (Dojo) knows how to handle.
> >
> > In your pipeline it looks like the browser-update transformer is
> > executing, filtering out everything but the "bu:" elements which contain
> > the form fields that need to be updated. But then you pass it through
> > some other transformation stages which *add* content back in! All of a
> > sudden you've got a document with much more than the "bu:" elements
> > recognized by Dojo, so it pukes on those unrecognized elements.
> >
> > I believe you need to restructure your pipeline so the browser-update
> > transformer comes after the transforms that add content.
> >
> > Hope that helps
> > --Jason
> >
> >
> >
> >
> >
> > ---------------------------------------------------------------------
> > To unsubscribe, e-mail: users-unsubscribe@cocoon.apache.org
> > For additional commands, e-mail: users-help@cocoon.apache.org
> >
> >
>
Re: Ajax - 'No handler found for element head' - 'No handler found for element body'
Posted by Andrew <an...@gmail.com>.
Jason,
Eureka! At last I have ajax working with my forms!!!!
Many thanks for pointing me in the right direction.
regards
Andrew
On 22/07/06, Jason Johnston <co...@lojjic.net> wrote:
>
> Andrew wrote:
> > Hi,
> > I have an ajaxified form which has a number of required fields. If you
> > submit the form without filling in any of the required fields 2 alert
> > are displayed. The first says 'No handler found for element head. Show
> > server response?', and the second alert says 'No handler found for
> > element body. Show server response?'. If you click yes to both questions
> > another window opens up showing your form page minus any of the form
> > fields! If all required fields are entered correctly then the form
> > submits as normal. What could be the issue here? When the page firtst
> > loads I get the following dojo debug lines:
> >
> > DEBUG: Loading URIresources/dojo/../forms/js/__package__.js
> > DEBUG: Loading URIresources/dojo/../forms/js/common.js
> > DEBUG: Loading URIresources/dojo/../forms/js/CFormsForm.js
> > DEBUG: Loading URIresources/dojo/../ajax/js/BUHandler.js
> > DEBUG: Loading URIresources/dojo/../ajax/js/insertion.js
> > DEBUG: Loading URIresources/dojo/../forms/js/CFormsRepeater.js
> > DEBUG: Loading URIresources/dojo/../forms/js/CFormsSuggest.js
> > DEBUG: Loading URIresources/dojo/src/widget/html/ComboBox.js
> > DEBUG: Loading URIresources/dojo/src/widget/ComboBox.js
> > DEBUG: Loading URIresources/dojo/src/widget/html/stabile.js
> > DEBUG: Loading URIresources/dojo/src/widget/InlineEditBox.js
> >
> > My sitemap is as follows:
> >
> > <map:match pattern="**viewform-*.xml">
> > <map:generate type="newjx" src="jx/{2}.jx"/>
> > <map:transform type="browser-update"/>
> > <map:transform type="cinclude"/>
> > <map:transform type="xslt-saxon" src="style/{2}.xsl"/>
> > <map:transform type="cinclude"/>
> > <map:transform type="i18n">
> > <map:parameter name="locale" value="en-US"/>
> > </map:transform>
> > <map:transform src="template-style/forms-
> > samples-styling.xsl"/>
> > <map:transform type="i18n">
> > <map:parameter name="locale" value="en-US"/>
> > </map:transform>
> > <map:select type="ajax-request">
> > <map:when test="true">
> > <map:serialize type="xml"/>
> > </map:when>
> > <map:otherwise>
> > <map:serialize type="html"/>
> > </map:otherwise>
> > </map:select>
> > </map:match>
>
> Andrew--
>
> I think you need to understand how the AJAX publishing works, in
> particular the browser-update transformer.
>
> When an AJAX request is received, the response to the browser should not
> be the entire document (that's not very AJAX-ey!), but only the parts
> that need to be updated in the DOM. This is the job of the
> browser-update transformer; it filters out everything except elements in
> the "bu:" namespace (produced by the CForms JX macros), which the
> client-side JavaScript (Dojo) knows how to handle.
>
> In your pipeline it looks like the browser-update transformer is
> executing, filtering out everything but the "bu:" elements which contain
> the form fields that need to be updated. But then you pass it through
> some other transformation stages which *add* content back in! All of a
> sudden you've got a document with much more than the "bu:" elements
> recognized by Dojo, so it pukes on those unrecognized elements.
>
> I believe you need to restructure your pipeline so the browser-update
> transformer comes after the transforms that add content.
>
> Hope that helps
> --Jason
>
>
>
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@cocoon.apache.org
> For additional commands, e-mail: users-help@cocoon.apache.org
>
>
Re: Ajax - 'No handler found for element head' - 'No handler found
for element body'
Posted by Jason Johnston <co...@lojjic.net>.
Andrew wrote:
> Hi,
> I have an ajaxified form which has a number of required fields. If you
> submit the form without filling in any of the required fields 2 alert
> are displayed. The first says 'No handler found for element head. Show
> server response?', and the second alert says 'No handler found for
> element body. Show server response?'. If you click yes to both questions
> another window opens up showing your form page minus any of the form
> fields! If all required fields are entered correctly then the form
> submits as normal. What could be the issue here? When the page firtst
> loads I get the following dojo debug lines:
>
> DEBUG: Loading URIresources/dojo/../forms/js/__package__.js
> DEBUG: Loading URIresources/dojo/../forms/js/common.js
> DEBUG: Loading URIresources/dojo/../forms/js/CFormsForm.js
> DEBUG: Loading URIresources/dojo/../ajax/js/BUHandler.js
> DEBUG: Loading URIresources/dojo/../ajax/js/insertion.js
> DEBUG: Loading URIresources/dojo/../forms/js/CFormsRepeater.js
> DEBUG: Loading URIresources/dojo/../forms/js/CFormsSuggest.js
> DEBUG: Loading URIresources/dojo/src/widget/html/ComboBox.js
> DEBUG: Loading URIresources/dojo/src/widget/ComboBox.js
> DEBUG: Loading URIresources/dojo/src/widget/html/stabile.js
> DEBUG: Loading URIresources/dojo/src/widget/InlineEditBox.js
>
> My sitemap is as follows:
>
> <map:match pattern="**viewform-*.xml">
> <map:generate type="newjx" src="jx/{2}.jx"/>
> <map:transform type="browser-update"/>
> <map:transform type="cinclude"/>
> <map:transform type="xslt-saxon" src="style/{2}.xsl"/>
> <map:transform type="cinclude"/>
> <map:transform type="i18n">
> <map:parameter name="locale" value="en-US"/>
> </map:transform>
> <map:transform src="template-style/forms-
> samples-styling.xsl"/>
> <map:transform type="i18n">
> <map:parameter name="locale" value="en-US"/>
> </map:transform>
> <map:select type="ajax-request">
> <map:when test="true">
> <map:serialize type="xml"/>
> </map:when>
> <map:otherwise>
> <map:serialize type="html"/>
> </map:otherwise>
> </map:select>
> </map:match>
Andrew--
I think you need to understand how the AJAX publishing works, in
particular the browser-update transformer.
When an AJAX request is received, the response to the browser should not
be the entire document (that's not very AJAX-ey!), but only the parts
that need to be updated in the DOM. This is the job of the
browser-update transformer; it filters out everything except elements in
the "bu:" namespace (produced by the CForms JX macros), which the
client-side JavaScript (Dojo) knows how to handle.
In your pipeline it looks like the browser-update transformer is
executing, filtering out everything but the "bu:" elements which contain
the form fields that need to be updated. But then you pass it through
some other transformation stages which *add* content back in! All of a
sudden you've got a document with much more than the "bu:" elements
recognized by Dojo, so it pukes on those unrecognized elements.
I believe you need to restructure your pipeline so the browser-update
transformer comes after the transforms that add content.
Hope that helps
--Jason
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@cocoon.apache.org
For additional commands, e-mail: users-help@cocoon.apache.org