For some reason my image src stops working when placed inside a conditional region like this.
<div id="cond_first_section_how_many_images" is="dmx-if" dmx-bind:condition="(sc_retrieve_page_contents.data.query_first_section_images.count() > 1)">
<img class="img-fluid" dmx-bind:src="sc_retrieve_page_contents.data.query_first_section_images[0].il_url">
</div>
We have used this before. And can be sure CR should not be the cause of SRC breaking.
Can you just simply “print” the src value to test. Something like:
<div id="cond_first_section_how_many_images" is="dmx-if" dmx-bind:condition="(sc_retrieve_page_contents.data.query_first_section_images.count() > 1)">
<img class="img-fluid" dmx-bind:src="sc_retrieve_page_contents.data.query_first_section_images[0].il_url">
{{sc_retrieve_page_contents.data.query_first_section_images[0].il_url}}
</div>
{{sc_retrieve_page_contents.data.query_first_section_images[0].il_url}}
Hi @sid, it is something I have used many times before too, but for some reason it is just not working. I added your code but also just added some static text so I would know where the values were coming from, like this.
<div id="cond_first_section_how_many_images" is="dmx-if" dmx-bind:condition="(sc_retrieve_page_contents.data.query_first_section_images.count() > 1)">
<img class="img-fluid" dmx-bind:src="sc_retrieve_page_contents.data.query_first_section_images[0].il_url">
Inside Condition: {{sc_retrieve_page_contents.data.query_first_section_images[0].il_url}}
</div>
Outside Condition: {{sc_retrieve_page_contents.data.query_first_section_images[0].il_url}}
In the browser, the image is missing and the binding inside the condition is empty, however the binding outside the condition is there as it should be.
This is my inspector output
It is strange because I know I have used this type of thing on other projects and it has worked flawlessly, I wonder if something is missing in the head section, like if the dmxFormatter.js is missing and using a formatter like .uppercase() just stops the output completely, although the console is not returning any errors so I do not think so.
Can you remove the img tag and see if the inside condition text renders? It seems something else is wrong here since even if the binding is not working for src, the regular text inside condition should have rendered in HTML.
Or maybe move it above the img tag to see if it renders.
I looked at the same thing, it is very strange, if I do this
<div id="cond_first_section_how_many_images" is="dmx-if" dmx-bind:condition="(sc_retrieve_page_contents.data.query_first_section_images.count() > 1)">
Inside Condition1: {{sc_retrieve_page_contents.data.query_first_section_images[0].il_url}}
<img class="img-fluid" dmx-bind:src="sc_retrieve_page_contents.data.query_first_section_images[0].il_url">
Inside Condition2: {{sc_retrieve_page_contents.data.query_first_section_images[0].il_url}}
</div>
Outside Condition: {{sc_retrieve_page_contents.data.query_first_section_images[0].il_url}}
It outputs this
As you say, even the regular text is missing, then I try this
<div id="cond_first_section_how_many_images" is="dmx-if" dmx-bind:condition="(sc_retrieve_page_contents.data.query_first_section_images.count() > 1)">
Inside Condition1:
<img class="img-fluid" dmx-bind:src="sc_retrieve_page_contents.data.query_first_section_images[0].il_url">
Inside Condition2: {{sc_retrieve_page_contents.data.query_first_section_images[0].il_url}}
</div>
Outside Condition: {{sc_retrieve_page_contents.data.query_first_section_images[0].il_url}}
And the output returns the regular text in the condition
All I did was remove the binding next to the regular text, and the regular text then displays.
Interesting.
And what about removing the img tag itself? Comment it out or remove.
Same result sadly, even with just
<div id="cond_first_section_how_many_images" is="dmx-if" dmx-bind:condition="(sc_retrieve_page_contents.data.query_first_section_images.count() > 1)">
Inside Condition: {{sc_retrieve_page_contents.data.query_first_section_images[0].il_url}}
</div>
My inspector just shows an empty conditional almost like it would show if the condition were not true, which I know it is.
Would you mind testing on your side sid even with php or whatever you are using just to see if it works, and also to see if when adding the condition if some added component gets added to the head maybe.
Sure. Give me a few minutes.
I added a CR and a variable to manipulate the CR.
Interestingly, the condition > 1 does not work! It works only when value is > 2.
https://wapplertests.slashash.dev/PHPMySQL/index.php
Dev tools console shows what is correct, but the CR’s condition says otherwise:
This is the code.
<dmx-value id="varCR" dmx-bind:value="0"></dmx-value>
<button class="btn btn-primary" dmx-on:click="varCR.setValue(varCR.value + 1)">CR Count: {{varCR.value}}</button>
<div id="crTest" is="dmx-if" dmx-bind:condition="varCR.value > 1">
Hi there. CR Value is now {{varCR.value}}.
</div>
I did not see any thing being added to the head. There was no CR before on this page. So no dependencies other than app connect I think.
Could it be that the condition is failing, CR is OFF, and the IMG tag just get out anyways for some weird reason?
Very strange, also tested a simpler version like this and it works
<dmx-value id="varCR2" dmx-bind:value="5"></dmx-value>
<div id="crTest2" is="dmx-if" dmx-bind:condition="varCR2.value > 1">
Hi there. CR Value2 is now {{varCR2.value}}.
</div>
Output
Wonder if it is something to do with getting the count of the array back from the database query or something although it seems unlikely.
Are you also seeing that CR does not work when varCR2's value is set to 2?
For a value of 3 and above, and condition > 1 it works fine for me too.
I don't think that is the issue. Since using dmx.parse returns correct value. Its the CR that has some issue.
I just tried dmx-show and that is working as expected.
For CR, I have discovered another thing. On my page, when the condition becomes true, but the focus is still on the button, the CR does not show. As soon as I click outside, it shows up.
Notice the blue focus border.
Well I managed to cheat it, I am unsure why but if I adjust my code and put the count of the database array into a variable first, and then evaluate if the variable value is greater than 1, it all works as it should have without first adding the variable.
Makes no sense, but it’s working now at least, so thank you for doing yours different so I could test a different way about it.
Here is my broken code
<div id="cond_first_section_how_many_images" is="dmx-if" dmx-bind:condition="sc_retrieve_page_contents.data.query_first_section_images.count() > 1">
<img class="img-fluid" dmx-bind:src="sc_retrieve_page_contents.data.query_first_section_images[0].il_url">
</div>
Here is my working code
<dmx-value id="varImageCountFirstSection" dmx-bind:value="sc_retrieve_page_contents.data.query_first_section_images.count()"></dmx-value>
<div id="cond_first_section_how_many_images" is="dmx-if" dmx-bind:condition="varImageCountFirstSection.value > 1">
<img class="img-fluid" dmx-bind:src="sc_retrieve_page_contents.data.query_first_section_images[0].il_url">
</div>
Looks like a case of dmx update issue.
Can you try this. Revert to your old code. After server action has completed, run this in console manually:
dmx.requestUpdate() and see if the image gets rendered.
I tested this too and concur the show is working perfectly.
The focus issue is very weird, just tested it and got the same too.
Yup, if I do that then all works as expected.
I would like to make a wild guess this has something to do with the new show/hide events of CR. 
But only @patrick would be the guy to tell us what’s actually going on here.
Agreed, and thanks so much for all the help sid, I just tried something and it worked too, but in my mind it shouldn’t, so this code does not work
<div id="cond_first_section_how_many_images" is="dmx-if" dmx-bind:condition="sc_retrieve_page_contents.data.query_first_section_images.count() > 1">
<img class="img-fluid" dmx-bind:src="sc_retrieve_page_contents.data.query_first_section_images[0].il_url">
</div>
But if I add a variable that I am not even using at all just above the exact same code, well then it does, so now I am even more confused.
<dmx-value id="varNotUsed" dmx-bind:value="sc_retrieve_page_contents"></dmx-value>
<div id="cond_first_section_how_many_images" is="dmx-if" dmx-bind:condition="sc_retrieve_page_contents.data.query_first_section_images.count() > 1">
<img class="img-fluid" dmx-bind:src="sc_retrieve_page_contents.data.query_first_section_images[0].il_url">
</div>
As you say this needs to be Patrick’ed
Here’s what I think could be happening…
The value of the variable is using the same server connect as the CR condition. So that is triggering dmxupdate correctly. Hence CR is working.
Maybe set the variable value to some other dynamic component or just static value and see if CR still works?
Quite right, setting it to 1 does not work, but setting it to any other dynamic value then forces the update. I think you may have found the exact bug.