SVG for checkedImage/uncheckedImage

[claudiobosticco]

SmartClient Version: v13.1p_2025-10-18/AllModules Development Only (built 2025-10-18)

Hi, while trying to use an SVG for checkedImage / uncheckedImage in a CheckBoxItem, I noticed that when the component loses focus (on blur), a request is made for an image using the SVG ID as its name - which obviously doesn’t exist.

please try this test case:

isc.DynamicForm.create({
    ID: "form1",
    width: 620,
    colWidths: [190, "*"],
    fields: [
        {name: "checkbox", title: "Checkbox", type: "checkbox", height: 25, checkedImage:"Edit", uncheckedImage:"Cancel", },
        {name:"text", title:"text", type:"text"}
    ]
});

You'll see requests like.

https://www-demos.smartclient.com/sm...pleImages/Edit
https://www-demos.smartclient.com/sm...eImages/Cancel

Also, I was wondering whether the icon should have its own style, like "icon", or not.

[Isomorphic]

hi Claudio, thanks for the report - you're using these recent features in some interesting ways!

We're actually making state-related changes specifically in this area right now in 15.0 (focused and error states for FormItem ValueIcons, specifically those used by CheckboxItems, as opposed to regular FormItemIcons), and we do see the issue you report from a quick test - we'll take a look at that while we're in there. Whatever fixes we make in 15.0 will be ported back.

On your question about cssClass - technically, if you want the regular "icon" class styles, you shouldn't need to do anything, because that ought to be the default. However, that's not holding true in 13.1, and there's also a bug in 13.1 which we'll look at; even if you manually set cssClass:icon, you'll get the Over style as expected, but then you'll get 404s similar to the other one you mentioned.

These issues are specific to FormItem valueIcons and we'll respond here with an update shortly.

[Isomorphic]

hi Claudio - the issue with the bad file-URLs has been addressed for tomorrow's builds dated October 25 and later.

We'll follow up later about cssClass - we're still working on it

[Isomorphic]

On the cssClass question - it turns out, you do need to assign one in the src-string if you want one, and it will work if it's stateful.

isc.DynamicForm.create({
    ID: "form1",
    width: 620,
    colWidths: [190, "*"],
    fields: [
        {name: "checkbox", title: "Checkbox", type: "checkbox", height: 25,
            checkedImage:"Edit:cssClass:icon",
            uncheckedImage:"Cancel:cssClass:button"
        },
        {name:"text", title:"text", type:"text"}
    ]
});

[claudiobosticco]

SmartClient Version: v13.1p_2025-10-26/AllModules Development Only (built 2025-10-26)

Hi, thanks a lot for the fix. So, can you confirm that for checkedImage / uncheckedImage I need to explicitly set the cssClass, or is that something you’re planning to change?

The whole Media/StockIcon system is really impressive. We use FontAwesome - I have a Maven build that creates a webjar, which I initially used only to automatically add fill="currentColor" to the SVG sprite files.
Now it also generates a JS file containing an array of the icon IDs extracted from the sprite files, so by using isc.Media I can map them with a prefix like fa_ (or fas_ for the solid version, etc.).
Truly SmartClient-awesome!