how to set ng-src to conditionally search for IMG SRC? - html

I have a variable that contains the name of an image, so I set the source to be the path + variable + PNG. The thing is that at the beginning my var is null, so the SRC is not found and I get an error. How can I make the IMG to search for its source only when my variable is not null?
<img ng-src="images/{{server.purpose}}.png">
Where server.purpose contains the name of the picture according to a user selection. I get an error at the beginning because server.purpose is null. I want to use a condition that the img will look up for src only if server.purpose is not null. I tried with ng-if, but it just hide the img if not found, the error still occurs.

If you use the value null for ng-src the call to the server is prevented. Therefore remove the hardcoded bits from ng-src and set it in the scope variable. Once the image needs to be shown put the whole path in your variable.

Maybe something like this?
<div ng-if="variable">
<img ng-src="..."/>
</div>

Related

Is there a simple way in thymeleaf to check if an image with #{} exists?

So, I am trying to make a shop section and I cannot find a way to display an alt image in case my image doesn't exist.
Basically I use the Model to pass a List then with th:each I manage to make a card for each product. All images are called after the id of the product
Do you know what I am doing wrong?
<img th:if="(#{'static/products/' + ${product.id} + '.png') != null" th:src="#{'static/products/' + ${product.id} + '.png'}" class="card-img-top" alt="immagine_vinile">
doesn't seem to work being a #{} and not a ${}.
I apologize if my terms are not right but I am learning
In your controller, add a property on your product that indicates if there is an image or not. If you are currently directly exposing your Product entity, then create a ProductDto where you can add that extra property. When you have done that, use it like this:
<img th:if="${product.hasImage}"
th:src="#{'static/products/' + ${product.id} + '.png'}"
class="card-img-top" alt="immagine_vinile">
Since I understand that you wish to display a placeholder image in the case that the initial image cannot be found (is null)
<img th:with="url=${(product.imageUrl) ?: 'path/to/your/placeholder/image.png')}"
th:src="#{${url}}"
alt="image"
/>
Where the product entity would contain a parameter (imageUrl) that holds the image source directory. Since the code you used to generate this path isn't complex, adding it to your entity would be quite simple.
The th:with parameter creates a local variable "url", that get's defined based on the value of the imageUrl field in your Product entity.
The code above would check if the model entity's field "imageUrl" is null (you don't need to manually check by declaring th:if="${product.imageUrl == null}" as Thymeleaf does this for you). The first image will only be displayed if the imageUrl field isn't null, else, the placeholder image's URL will be used instead.

HTML-assigned 'id' Missing in DOM

Within the Moodle (v. 3.5.7) Atto editor (using both Chrome and Firefox) I've been trying to assign an ID to a particular row class, "span9". My ultimate objective is to assign this a unique ID and reference this element via jquery so as to append another element within it.
The ISSUE is that once I add an ID (id="checklist01") and click save, the ID simply does not appear in the DOM, and seems to not exist. When I re-enter the atto editor however, voila, there it is just sitting there. So it's NOT being removed completely... just not expressed somehow?
I have 2 screenshots linked below showing (1) the editor view, with the element and assigned ID highlighted, and (2) a screenshot of the DOM once the changes have been saved, with that same area highlighted, without the assigned ID.
Screenshots of ID Missing from DOM
Bootstrap ver. 4
So far I've tried switching the placement of the id in the atto editor (class coming first vs second after ); tried to add a "span" in front of the id (for some reason, I was desperate); and really just searched all over for someone who has encountered something similar.
I'm not sure how much help the html will provide, but here it is:
<div class="row-fluid colored">
<div class="iconbox span3">
h4>Your Completion Status (%)</h4>
</div>
<div id="checklist01" class="span9">
</div>
</div>
I found the reason for the removal of id attributes.
id attributes are removed because "Checklist" activity used safe HTML function of Moodle. If you want to access id attributes of description HTML follow below steps.
Go to mod\checklist\locallib.php file.
Then search formatted_intro() function (which is around line number 880).
In that function they used Moodle's format_text() function to return description text.
In that function, they have used 3 parameters.
string $text The text to be formatted.
int $format Identifier of the text format to be used
object/array $options text formatting options
Replace
$opts = array('trusted' => $CFG->enabletrusttext);
to
$opts = array('trusted' => $CFG->enabletrusttext,'allowid'=>true);
Then save your file and check. By following the above steps you can use id attributes.

Vue.js value bind with prefix and suffix

I tried binding a value to an input using a variable that has been declared in the data object, but I also need to add a prefix and a suffix
<input id="topnavback", v-bind:value="rgb({{themestopnavback}})", class="jscolor"/>
The value themetopnavback is the value defined in data and I want to put the rgb with bracktes around it.
But this always causes the whole page not to render the DOM which only occurs if you try to access a Vue variable which isn't existing in the data object. Is this just wrong or isn't it possible to bind a value with additional strings?
Thanks in advance
v-bind:value="'rgb(' + themestopnavback + ')'"

Use VBA to get "background-color" value from HTML <td> tag for use in Excel

I have spent many hours researching how to get the color value from a tag like the following:
image from HTML page
I have retrieved the tags as
Set tdItems = hTable.document.getElementsByTagName("td")
I have tried:
strStyle = tdItem.getAttribute("style") 'but that does not return the attribute values, simply the name of the attribute "background-color".
I tried:
strStyle = tdItem.Style("Background-Color") 'fails to compile
I have been unable to find the right command to return just the background-color value. I am not interested in the other style attributes. I am retrieving the tdItem.innertext values for the whole table successfully into a spreadsheet, but I'd like to grab the color coded into each HTML cell and use it in the spreadsheet.
Can anyone help?

MySQL Replace query

I have one table, and I need to remove a specific text from a specific field. This field contains a full URL of an image, I need to remove the URL and just keep the image filename.
So:
Current date: fieldname: www.example.com/photo.jpg
What I want to do is remove www.example.com/ from all of the entries for this field.
I know how to use the search and replace function, but I don't know how to leave part of the data intact.
This is what I've used but can't modify it to make it work the way I want:
UPDATE table SET oc_upload1 = REPLACE(oc_upload1,'newtext') WHERE oc_upload1 LIKE "oldtext"
Is this possible? If so, how? Thank you!
This should do:
UPDATE table
SET image = REPLACE(image, 'www.example.com/','')
but, it's possible that image contains 'www.example.com/' as part of image file name so to be extra safe and replace only the first occurence of www.example.com
UPDATE table
SET image = SUBSTRING(image, LENGTH('www.example.com/') + 1)
WHERE image LIKE 'www.example.com/%'
But if You really, really just want the file name and not path to the file You can also use:
UPDATE table
SET image = SUBSTRING_INDEX(image,'/',-1)
Note that above statement will change 'www.example.com/images/01/02/daisy.jpg' to 'daisy.jpg', not 'images/01/02/daisy.jpg'. It also wont change rows that does not contain '/' in image.