I'm developing custom widgets for WAB (Develper Edtion) 2.17, Launchpad Theme, on 3D Scenes (ArcGIS API for javascript 4.17).
I need to switch programatically by javascript between the various items of a dijit radio button.
Widget.js has next code:
define([ ... 'jimu/dijit/RadioBtn', 'dijit/form/RadioButton' ...
Widget.html has next lines as in attached screenshot
I'll appreciate help.
Solved! Go to Solution.
Although this is not in a WAB app, I set the radio button to checked using this syntax
<input id="radHigh" type="radio" data-dojo-type="dijit/form/RadioButton" name="resolution" value="high" />
var radioHigh = registry.byId("radHigh");
radioHigh.set("checked", true);
This is the way I do it in my widgets.
HTML
<input type="radio" data-dojo-attach-point="valueRadio" checked="true" disabled title="${nls.valueTooltip}" />
<label data-dojo-attach-point="valueLabel" title="${nls.valueTooltip}">${nls.value}</label>
JS
this.valueRadio.checked = false;
Dear Robert,
Thank you for answering. I tried it, but it does not work. I need to programatically flip the on/off status of the 2 radio buttons, and I can't. I even saw that the ".checked" property is undefined.
What am I missing?
Michael,
That is exactly how I do it in my code and html and it works fine.
Maybe it's because mine is dojo radio button? (I just copied the way esri do in other wodgets)
Is there some relevant code in WAB widgets for modifying radio buttons status programatically?
Can I programatically immitate as if the user clicked?
Thanks
All I can tell you is that what I provided works.
Dear Robert, thank you for the info.
I checked, and indeed if in the html (it is shown in the attached screenshot) I remove the data-dojo-type="dijit/form/RadioButton"
(since you do not have it at all in your code) from the radio buttons,
then the screen reflects the new state of the radio buttons,
though I don't enter the "radio button "onClick" callback" and I have to call it manually from the program.
But I want the "look" of dojo radio buttons... ESRI use it in their code examples,
e.g. IntegratedMeshLayer modification
and I really need to be able to control the dojo radio buttons from within javascript.
Can you please instruct me how to achieve the same effect when I remain with dojo radio buttons?
Had this be done in some esri code so that I can see code example, or can you please point me to the relevant info how to do this for dojo radio buttons?
I will be thankful.
Dear Robert,
I tried to re-learn thoroghly what I googled about it, and at last I fully succeeded in setting dojo radio buttons programatically, by the first answer in stackOverflow -
Dojo Radiobutton - check one of them programatically
with this fiddle
In order to implement this idea, I replaced in the html the <fieldset> by <form data-dojo-type="dijit/form/Form" id="widgetFilterFormValueBy">
Thanks for telling me that this should be possible.
Note: This works, but finally I commented it and I'm using Ken Buja's way' which is simpler and shorter.
Although this is not in a WAB app, I set the radio button to checked using this syntax
<input id="radHigh" type="radio" data-dojo-type="dijit/form/RadioButton" name="resolution" value="high" />
var radioHigh = registry.byId("radHigh");
radioHigh.set("checked", true);
Dear Ken Buja,
I have a "group" of 2 dojo Radio Buttons that I need to be able to control them manually.
Using the link I mentioned I used the id of the group and it worked well.
You suggested simpler way with less text, by using the id to of the specific button I want to check.
I tested it and it also works well!
Thank you very much!
Indeed I commented what I did before since yours is a simpler and shorter way.