Note that there are some explanatory texts on larger screens.

plurals
  1. PODijit button show icon but not label programatically
    primarykey
    data
    text
    <p>I'm relatively new to Dojo and trying to get the hang of dijits. After consulting the docs for Dojo's dijit/form/Button widget here:</p> <p><a href="http://dojotoolkit.org/reference-guide/1.9/dijit/form/Button.html" rel="nofollow">http://dojotoolkit.org/reference-guide/1.9/dijit/form/Button.html</a></p> <p>I attempted to create a button showing only an icon (showLabel: false). That attempt can be seen in this fiddle:</p> <p><a href="http://jsfiddle.net/msweeney/23Mxh/" rel="nofollow">http://jsfiddle.net/msweeney/23Mxh/</a></p> <p>or assembled from the code:</p> <h2>HTML</h2> <pre><code>&lt;body&gt; &lt;button type="button" id="testButton"&gt;&lt;/button&gt; &lt;/body&gt; </code></pre> <h2>CSS</h2> <pre><code>.plusIcon { background-image: url("http://png-2.findicons.com/files/icons/2152/snowish/128/gtk_add.png"); background-position: center; background-repeat: no-repeat; height: 19px; width: 19px; } </code></pre> <h2>JS</h2> <pre><code>require(["dojo/parser", "dijit/form/Button", "dojo/domReady!"], function (parser, Button) { parser.parse(); var testButton = new Button({ label: "test button", showLabel: false, iconClass: "plusIcon", onClick: function () { alert("test button clicked") } }, "testButton"); testButton.startup(); }); </code></pre> <p>I can't seem to figure out what I'm doing wrong here. In particular:</p> <ol> <li>Why doesn't the icon show up?</li> <li>What is causing the black dot to appear?</li> <li>Why does the label still show up even when showLabel is set to false?</li> <li>Why isn't the label inside the button?</li> </ol> <p><em>Note:</em> I'd be glad to show pictures to illustrate what I'm getting and what I'd like to be getting, but I don't have enough reputation yet.</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload