dijit.form.button с img src в программном

Question

Есть ли способ добавить тег img src в программный для dijit.form.button?

В декларативной, мы можем сделать что-то вроде этого:

<div dojoType="dijit.form.Button"><img src="images/img.png"/></div>

В этом случае кнопка Dijit полностью заменить изображения.

Если я пытаюсь что-то вроде этого, изображение кнопки заменить, но появляются в:

var button = new dijit.form.Button({ 
     showLabel : false, 
     label : "Validate", 
     iconClass : "alphaIcon validateIcon", 
    }) 

Ваша помощь будет очень высокую оценку.

Заранее спасибо

Answer 1

Я думаю, что ваш подход должен делать именно то, что вы сделали, и создать пользовательские CSS для изменения внешнего вида.

myIconButton.dijitButton .dijitButtonNode { 
    border: 0; 
    background-image: none; 
    background-color: transparent; 
    box-shadow: none; 
} 

var button = ... // same as above 
dojo.addClass(button.domNode, 'myIconButton'); 

Чтобы ответить на ваш вопрос, вы можете создать свой собственный виджет кнопки с помощью настраиваемого шаблона, в котором был только источник изображения.

dojo.declare("MyIconButton", [Button], { 
    templateString: '<div><img src="${imageSrc}"></img></div>' 
}); 

Примечание: Я не проверял этот подход и там могут быть и другие изменения, которые вам нужно будет в MyIconButton, поскольку базовый класс Button будет ждать других узлов в шаблоне.

Answer 2

Ниже будет делать то, что вы хотите

this.button1.attr('label','<img src="' + this.constants.packagePrefix + '/images/button1.gif"/>'); 

Я нашел его здесь: http://mail.dojotoolkit.org/pipermail/dojo-interest/2009-August/038353.html

Answer 3

Я использую класс с фона изображения для кнопок. Это действительно затрудняло динамическое установление изображения. Таким образом, я имел успех, используя это:

domStyle.set(myButton.iconNode, 'background-image', 'url(images/icon.png)'); 

Хитрость использует iconNode, а не DOMNode или containerNode.