-
1. Re: JavaScript Error The content of elements must consist of well-formed character data or markup.
danielc.roth Oct 18, 2008 11:43 PM (in response to valatharv)Need more info. Post code for xhtml, and bean. The error suggest some kind of
dirty
output. -
2. Re: JavaScript Error The content of elements must consist of well-formed character data or markup.
valatharv Oct 19, 2008 12:29 AM (in response to valatharv)Thanks for looking into it.. I am using hardcoded values.... no bean.
When I run the same code using simple JSP it works perfectly fine.
Scenario : I have 2 dropdowns, value in 2nd is dependent on 1st dropdown.
I am using .txt file to read the values
1st dropdown contains : ItemA, ItemB, ItemC
2nd dropdown displays 1,2,3 when user selects ItemA.
2nd dropdown displays 4,5,6,7 when user selects ItemB, similarly 8,9 for ItemC selection.
I got the example while searching...
ItemA.txt contains 1|2|3, ItemB.txt |4|5|6|7 and ItemC.txt |8|9.
This is the xhtml I am using in Seam, it gives error on line
"for (o=1; o < itemDetailsar.length; o++)", (The content of elements must consist of well-formed character data or markup)
Please suggest what is wrong....
Complete Test.xhtml
-------------------
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:s="http://jboss.com/products/seam/taglib"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:a="http://richfaces.org/a4j"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich"
template="layout/template.xhtml">
<head>
<script src="request.js"></script>
<script>
function handleOnChange(dd1)
{
var idx = dd1.selectedIndex;
var val = dd1[idx].text;
var par = document.forms["frmSelect"];
var parelmts = par.elements;
var itemDetailssel = parelmts["itemDetails"];
var item = val;
if (item != "Select item")
{
var directory = ""+document.location;
directory = directory.substr(0, directory.lastIndexOf('/'));
Http.get({
url: "./" + item + ".txt",
callback: fillitemDetails,
cache: Http.Cache.Get
}, [itemDetailssel]);
}
}
function fillitemDetails(xmlreply, itemDetailselmt)
{
if (xmlreply.status == Http.Status.OK)
{
var itemDetailsresponse = xmlreply.responseText;
var itemDetailsar = itemDetailsresponse.split("|");
itemDetailselmt.length = 1;
itemDetailselmt.length = itemDetailsar.length;
for (o=1; o < itemDetailsar.length; o++)
{
itemDetailselmt[o].text = itemDetailsar[o];
}
}
else
{
alert("Cannot handle the Ajax call.");
}
}
</script>
</head>
<ui:define name="body">
<h:messages globalOnly="true" styleClass="message" id="globalMessages"/>
<h:form id="listTest" styleClass="edit">
<select name="item" onChange="handleOnChange(this);">
<option>Select Item</option>
<option>ItemA</option>
<option>ItemB</option>
<option>ItemC</option>
</select>
<select name="itemDetails">
<option>Select Item details</option>
</select>
</h:form>
</ui:define>
</ui:composition> -
3. Re: JavaScript Error The content of elements must consist of well-formed character data or markup.
danielc.roth Oct 19, 2008 1:13 AM (in response to valatharv)I cannot really say why it doesn't work, but jsf
modifies
stuff quite a lot. I suggest you step through your javascript in firebug or equivalent.Is there a particular reason why you try to do this with javascript? I think it would be a lot easier (even trivial) to do this with ajax4jsf.
-
4. Re: JavaScript Error The content of elements must consist of well-formed character data or markup.
valatharv Oct 19, 2008 1:17 AM (in response to valatharv)Thanks for replying Daniel...
No there is no reason for using javascript, infact I would definitely prefer ajax4jsf, I tried searching for samples but couldn't found any....
I really don't want to use javascript or simple JSF, ajax would be best choice...
Please let me know if you can suggest any sample ajax4jsf, this is very urgent for us.
-
5. Re: JavaScript Error The content of elements must consist of well-formed character data or markup.
valatharv Oct 19, 2008 4:10 PM (in response to valatharv)I tried ajax4jsf, the code works fine if I create separate test.xhtml and use only these 2 dropdowns..
But, when I try to embed in our main xhtml (which have multiple panels), looks like <a:support event="onchange".. is not fired. Both files uses the same war...
StudyEdit.xhtml behavior:
I can see Master and details dropdown, 1st. dropdown displays List as "Item A, Item B, Item C", 2nd. dropdown displays only A,B,C.
If I change any 1st. dropdown, 2nd. dropdown does not change.
Same code works fine if I create separate test.xhtml and use only these 2 dropdowns..
Please suggest what is missing ...here are both xhtmls
Test.xhtml (this works fine)
----------
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
...
xmlns:a="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich"
template="layout/template.xhtml">
<ui:define name="body">
<h:messages globalOnly="true" styleClass="message" id="globalMessages"/>
<h:form id="listTest" styleClass="edit">
<rich:panel>
<a:outputPanel id="myPanel1">
<s:decorate id="masterItems" template="layout/edit.xhtml">
<ui:define name="label">Master Item List: </ui:define>
<h:selectOneMenu value="#{itemListTestBean.masterValue}" required="true">
<s:selectItems var="v_item" value="#{itemListTestBean.masterItems}" label="#{v_item}" noSelectionLabel="select master ..."/>
<a:support event="onchange" reRender="panel2"></a:support>
</h:selectOneMenu>
</s:decorate>
</a:outputPanel>
</rich:panel>
<rich:panel id="panel2">
<a:outputPanel rendered="#{!empty itemListTestBean.masterValue}">
<s:decorate id="detailItems" template="layout/edit.xhtml">
<ui:define name="label">Detail Item List : </ui:define>
<h:selectOneMenu value="#{itemListTestBean.detailValue}">
<s:selectItems var="v_item" value="#{itemListTestBean.detailItems}" label="#{v_item}" noSelectionLabel="select details ..."/>
<a:support event="onload" reRender="panel2"></a:support>
</h:selectOneMenu>
</s:decorate>
</a:outputPanel>
</rich:panel>
</h:form>
</ui:define>
</ui:composition>
Main StudyEdit.XHTML (Nothing happens when I change 1st. dropdown)
I can see Master and details dropdown, 1st. dropdown displays List as "Item A, Item B, Item C", 2nd. dropdown displays only A,B,C.
If I change any 1st. dropdown, 2nd. dropdown does not change.
---------------
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
...
xmlns:a="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich"
template="layout/template.xhtml">
<ui:define name="body">
<h:messages globalOnly="true" styleClass="message" id="globalMessages"/>
<h:form id="study" styleClass="edit">
<rich:panel>
<a:outputPanel id="myPanel1">
<s:decorate id="masterItems" template="layout/edit.xhtml">
<ui:define name="label">Master Item List: </ui:define>
<h:selectOneMenu value="#{itemListTestBean.masterValue}" required="true">
<s:selectItems var="v_item" value="#{itemListTestBean.masterItems}" label="#{v_item}" noSelectionLabel="select master ..."/>
<a:support event="onchange" reRender="panel2"></a:support>
</h:selectOneMenu>
</s:decorate>
</a:outputPanel>
</rich:panel>
<rich:panel id="panel2">
<a:outputPanel rendered="#{!empty itemListTestBean.masterValue}">
<s:decorate id="detailItems" template="layout/edit.xhtml">
<ui:define name="label">Detail Item List : </ui:define>
<h:selectOneMenu value="#{itemListTestBean.detailValue}">
<s:selectItems var="v_item" value="#{itemListTestBean.detailItems}" label="#{v_item}" noSelectionLabel="select details ..."/>
</h:selectOneMenu>
</s:decorate>
</a:outputPanel>
</rich:panel>
<rich:panel>
<s:decorate id="studyNameDecoration" template="layout/edit.xhtml">
<ui:define name="label">Study Name</ui:define>
<h:inputText id="studyName"
required="true"
value="#{studyHome.instance.studyName}"/>
</s:decorate>
</rich:panel>
<rich:panel>
<s:decorate id="entryPointDecoration" template="layout/edit.xhtml">
<ui:define name="label">Entry Point</ui:define>
<h:inputText id="entryPoint" required="true"
value="#{quantExperimentHome.instance.entryPoint}"/>
</s:decorate>
</rich:panel>
<rich:panel>
<table border="1" class="dr-table rich-table">
<thead class="dr-table-thead">
<tr class="dr-table-header rich-table-header">
<th class="dr-table-headercell rich-table-headercell"><h:outputText value="Action" /></th>
<th class="dr-table-headercell rich-table-headercell"><h:outputText value="PName" /></th>
</tr>
</thead>
<ui:repeat value="#{studyHome.reagent}" var="info">
<tbody onmouseover="this.style.backgroundColor='#F8F8F8'"
onmouseout="this.style.backgroundColor='#{a4jSkin.tableBackgroundColor}'">
<td align="center" class="dr-subtable-cell rich-subtable-cell" height="20%">
<s:link action="#{studyHome.removeReagent}" value="Remove This" id="reagent"/>
</td>
<td align="center" class="dr-subtable-cell rich-subtable-cell" height="20%">
<s:decorate template="layout/edit.xhtml">
<h:inputText id="pname1" required="true" value="#{info.pname}"/>
</s:decorate>
</td>
</tbody>
</ui:repeat>
</table>
<div style="clear:both">
<span class="required">*</span>
required fields (Note : At least one reagent is required to create a Study)
</div>
</rich:panel>
<div class="actionButtons" align="center">
<h:commandButton action="#{studyHome.addReagent}" value="Add More Reagents"/>
<h:commandButton action="#{studyHome.removeReagent}" value="Remove Reagent" />
</div>
<div class="actionButtons">
<h:commandButton id="save" value="Save" action="#{studyHome.persist}" ..../>
</div>
</h:form>
</ui:define>
</ui:composition> -
6. Re: JavaScript Error The content of elements must consist of well-formed character data or markup.
fdquinones Jan 19, 2011 10:21 AM (in response to valatharv)Talvez un poco tarde para la respuesta, pero en fin a muchos puede servir, me pasaba lo mismo pero la solucion es la siguiente:
<script type="text/javascript" language="javascript">
<![CDATA[
//]]>
</script>
De esa forma reconoce los caracteres directamen sin tenerlos que hacer un parser. -
7. Re: JavaScript Error The content of elements must consist of well-formed character data or markup.
rembrandt Feb 22, 2012 11:07 PM (in response to fdquinones)Muchas Gracias:
Me tomo estos momentos para agradecer esta sencilla nota que me saco de apuros. Me gustaria agregar esta nota:
<script type="text/javascript" language="javascript">
<![CDATA[
Código del Script...
//]]>
</script>
Saludos.
-
8. Re: JavaScript Error The content of elements must consist of well-formed character data or markup.
gaboo May 10, 2012 11:03 AM (in response to rembrandt)Thank you, that fixed it for me too.