CODEWITHSUNDEEP
if-statementextjs
LucasN
LucasN

Reputation: 243

Conditionally setting configs in ExtJS 6?

I have an Ext.Img that I would like to set the src config of based upon a condition. Is there a simple way to accomplish this? I am thinking something like

if(condition){ src: 'image1.png'} else { src: 'image2.png'}

but this obviously won't work. I've using some of the techniques mentioned in this thread, by adding a different image item based on the condition but all I get are errors or no items will be added to the parent panel.

Upvotes: 1

Views: 833

Answers (2)

MarthyM
MarthyM

Reputation: 1849

You can easily just have the configuration ready beforehand in a variable, for example:

// Set the default value (image 1)
var imageUrl = 'image1.png';
if (condition)
{
    // Condition for image 2 is met, set it
    imageUrl = 'image2.png';
}

var myConditionalImage = Ext.create('Ext.img', {
    ...
    // Use prepared variable with conditional image URL
    src: imageUrl
});

Upvotes: 0

Alexander
Alexander

Reputation: 20224

Javascript supports the so-called conditional (ternary) operator:

condition ? expr1 : expr2

which in your example would be

src: condition?'image1.png':'image2.png'

I use this regularly, e.g. to account for varying space requirements of the different themes:

width: Ext.is.Triton?200:180

However, you have to make sure that the variables used in the condition are correctly defined at the time they are evaluated (this may be earlier than you think).

If you need conditions that are re-evaluated whenever the variables change, you have to look into ExtJS bindings.

Upvotes: 1

Related Questions