Dojo tab is not loading external html
-
15-06-2021 - |
Pregunta
When I click the second tab I want the callrecords.html code to be loaded but it isn't loading anything and the pane stays blank. I'm somewhat of a noob and can't seem to figure out why this is happening.
Also a side question. Why do some code samples say dojoType and others use data-dojo-type.
<body class="tundra">
<div class="formContainer" dojoType="dijit.layout.TabContainer" >
<div dojoType="dijit.layout.ContentPane" title="Advanced Search">
<label for="first_name">First Name:</label>
<input type="text" name="first_name" id="first_name"
size="30" /><br/>
<label for="last_name">Last Name:</label>
<input type="text" name="last_name" id="last_name"
size="30" /><br/>
<label for="middle_initial">Middle Initial:</label>
<input type="text" name="middle_initial" id="middle_initial"
size="1" /><br/>
</div>
<div dojoType="dijit.layout.ContentPane" title="Call Records" data-dojo-props='href:"modules/content_panes/callrecords.html", refresnOnShow:true'></div>
<div dojoType="dijit.layout.ContentPane" title="Phones">
<label for="home_phone">Home Phone:</label>
<input type="text" name="home_phone" id="home_phone"
size="30" /><br/>
<label for="work_phone">Work Phone:</label>
<input type="text" name="work_phone" id="work_phone"
size="30" /><br/>
<label for="cell_phone">Cell Phone:</label>
<input type="text" name="cell_phone" id="cell_phone"
size="30" /><br/>
</div>
</div>
</body>
callrecords.html
<h1>Tab 2</h1>
<p>I am tab 2. I was loaded externally as well.</p>
Solución
Couple things.
1) You have a typo: refresnOnShow
. Should be refreshOnShow
.
2) data-dojo-props
only works for Dojo > 1.7. Are you using dojo 1.7 or greater? If not, that won't work.
My suggestion is to try programmatically setting the pane href:
dijit.byId('tab2').attr('href', 'modules/content_panes/callrecords.html')
And see if that works. The dojo 1.7 syntax is:
require(["dojo/dom-attr"], function(domAttr){
var t = dijit.byId('tab2');
domAttr.set(t,'href','http://localhost:8080/vewpon/')
})
If the programmatic setting works, then you know its just something in your markup.
Update: For future reference, the Dojo 1.6 way of setting the type is: dojo-type="dijit.layout.ContentPane"