Question

I am developing a web page using Dojo mobile v1.5.1.

Below is the sample code.

<div dojotype="dojox.mobile.View" selected="true" id="view1">
  <div dojotype="dojox.mobile.Heading" label="dojox.mobile.Heading"></div>
  <div dojotype="dojox.mobile.EdgeToEdgeCategory" label=
  "dojox.mobile.EdgeToEdgeCategory"></div>
<div dojotype="dojox.mobile.EdgeToEdgeList">

  <!-- PROBLEM IS IN THIS DIV TAG -->
  <div dojotype="dojox.mobile.ListItem" moveto="view2" transition="slide"
  label="dojox.mobile.ListItem" onclick=
  "document.getElementById(&quot;cfText&quot;).innerText = &quot;Value set&quot;;"
  id="listItem1"></div>

</div>
</div>

<div dojotype="dojox.mobile.View" id="view2">
<div dojotype="dojox.mobile.Heading" label="dojox.mobile.Heading" back="Back" moveto=
"view1"></div>
<div dojotype="dojox.mobile.EdgeToEdgeList">
  <div dojotype="dojox.mobile.ListItem">
    <span id="cfText" class="xspTextComputedField">Value NOT set</span>
  </div>
</div>
</div>

What it does is, when the div tag with with id “listItem1” is clicked it shows div tag with id “view2”. But when I add the onClick event in it, it does NOT work. Without the onClick event it works fine.

Answer 1

GOT IT!

Add the following script:

<script type="text/javascript"> 
function setValue() {
    var cfText = dojo.byId("cfText");
    cfText.innerHTML = "Value Set";
}
dojo.addOnLoad(
    function() {
        dojo.connect(dijit.byId("listItem1"), "onClick", dojo.hitch(dijit.byId("listItem1"), setValue));
    }
);
</script> 

Also remove the “onClick” attribute value from div tag with id “listItem1”.

Thanks to this discussion for helping me out.