I have the following:
var test = dojo.byId("clientDivision");
test.style.display = 'block';
in a function that is getting called as part of an "onChange" of a select.
here is the div I am trying to display:
<tr id="divisionInputRow" name="divisionInputRow">
<div id="clientDivisionDiv" >
<td><label>Org:</label></td>
<td name="inputDivisionCell" id="inputDivisionCell" class="inputData">
<div dojoType="customdojo.stores.QueryReadStore" jsId="divisionStore"
queryTable="" url="/SkillsDB/autocomplete/buildClientDivisionList"
requestMethod="post"></div>
<select id="clientDivision" name="clientDivision.name" style ="display:none"
value="${project?.clientDivision?.encodeAsHTML()}"
dojoType="dijit.form.ComboBox" pageSize="15"
onChange="setCbHiddenId(this, 'clientDivision.id')"
required="true"
invalidMessage="Invalid Client Division"
promptMessage="Enter client division for this project">
</select>
<input type="hidden" id="clientDivision.id" name="clientDivision.id" value='${project?.clientDivision?.id}' />
</td>
</div>
</tr>
so as you can see, there is a select
<select id="clientDivision" name="clientDivision.name" style ="display:none"
where i am explicitly setting style to "display:none" so that it's hidden when page loads, I just want to unhide it after an event.
However, the code inmy function doesnt seem to do anything.
Thanks
When dojo parses your document, the <select>
is turned into several tags, looking something like this:
<div widgetid="clientDivision" style="display: none;" id="widget_clientDivision" role="combobox">
<div class="dijitReset dijitRight dijitButtonNode dijitArrowButton ...>
<input class="dijitReset dijitInputField dijitArrowButtonInner" ...>
</div>
...
<div class="dijitReset dijitInputField dijitInputContainer">
<input value="${project?.clientDivision?.encodeAsHTML()}" id="clientDivision"
name="clientDivision.name" type="text">
</div>
</div>
Notice that the DOM node with id "clientDivision" is now hidden deep inside the tag soup. That's why hiding/unhiding it doesn't make sense.
Your combobox is a widget at this point, so treating it like a DOM node (even though it's technically still made up of DOM nodes) doesn't work.
You can hide the widget's outermost DOM node like this:
dijit.byId("clientDivision").domNode.style.display = "none";
Notice that you have to use dijit.byId
(not dojo.byId, which is only for DOM nodes, not widgets), and that you have to use its domNode
member (which is a dijit's outermost DOM node).
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.