Products

[svetoslav_borislavov]

Hi,

Your code did not work because when you assign a string to the template, the string is parsed to an element after the function.
In other words, you were trying to set the innerHTML of a string.

Best Regards,
Svetoslav Borislavov

Smart UI Team
https://www.htmlelements.com/

[svetoslav_borislavov]

Hi,

You are setting only a string. The string is internally parsed to an element. The correct way is as my previous reply.
You may see in this demo also: https://www.htmlelements.com/demos/grid/column-dynamic-template-with-components/

Best Regards,
Svetoslav Borislavov

Smart UI Team
https://www.htmlelements.com/

[svetoslav_borislavov]

Hi,

This is happening because you initially set the template to an empty div element.
You should have your conditionals initially also.
The correct code is this below:

const data = formatObject.row.data;
if (!formatObject.template) {
    if (data.attachment_count != null) {
        if (data.attachment_count < 1) {
            formatObject.template = ‘<div></div>’;
        }
        else if (data.attachment_count == 1) {
            formatObject.template = ‘<div><some fa icon A></div>’;
      }
        else if (data.attachment_count > 1) {
            formatObject.template = ‘<div><some fa icon B></div>’;
        }
    }
    else {
        formatObject.template = ‘<div></div>’;
    }
} else {
    if (data.attachment_count != null) {
        if (data.attachment_count < 1) {
            formatObject.template.innerHTML = ”;
        }
        else if (data.attachment_count == 1) {
            formatObject.template.innerHTML = ‘<some fa icon A>’;
        }
        else if (data.attachment_count > 1) {
            formatObject.template.innerHTML = ‘<some fa icon B>’;
        }
    }
    else {
        formatObject.template.innerHTML = ”;
    }
}

Best Regards,
Svetoslav Borislavov

Smart UI Team
https://www.htmlelements.com/

• This reply was modified 1 year, 8 months ago by svetoslav_borislavov.
• This reply was modified 1 year, 8 months ago by svetoslav_borislavov.

[svetoslav_borislavov]

Hi,

You may configure this with CSS.

In the example below the docking layout will fit inside the element and you can size this wrapper as you want
For example:
<div>
<div><div id=”dock-wrapper”></div>
<div>        <smart-docking-layout></smart-docking-layout></div>
<div></div></div>
<div></div>
</div>
<div>
<div>
<div>#dock-wrapper {</div>
<div>    height: 80%;</div>
<div>    overflow: hidden;</div>
<div>}</div>
<div>smart-docking-layout {</div>
<div>    width: 100%;</div>
<div>    height: 100%;</div>
<div>}</div>
</div>
</div>
Best Regards,
Svetoslav Borislavov

Smart UI Team
https://www.htmlelements.com/

[svetoslav_borislavov]

Hi,

What is your code for the template function?

Can you share it with us?

Best Regards,
Svetoslav Borislavov

Smart UI Team
https://www.htmlelements.com/

[svetoslav_borislavov]

Hi,

If you are setting the icon with the <i> tag. You shouldn’t change the textContent property, but the innerHTML.
The difference is that the textContent does not parse the HTML tags to elements.
With the textContent you are setting the text of the element, but with the innerHTML you are setting the HTML content.

Please see the demo below:

Here is the modified example: https://codepen.io/svetoslavjqwidgets/pen/MWqqpKR

Best Regards,
Svetoslav Borislavov

Smart UI Team
https://www.htmlelements.com/

[svetoslav_borislavov]

Hi,

Sure, if you face any further difficulties, do not hesitate to contact us!

Best Regards,
Svetoslav Borislavov

Smart UI Team
https://www.htmlelements.com/

• This reply was modified 1 year, 8 months ago by svetoslav_borislavov.

[svetoslav_borislavov]

Hi,

Every component has other components in it and they are dependencies.

For example, the grid component uses the button, pager, tree and many more files internally and they should be imported also.

In the modules folder, the smart-grid.js import all the required dependencies and exports the grid.

To avoid errors, import components from the modules folder.

Best Regards,
Svetoslav Borislavov

Smart UI Team
https://www.htmlelements.com/

[svetoslav_borislavov]

Hi,

As shown in my previous reply, the proper way of changing the scheduler event size is with the CSS variable.
If you want to change it, you may have a class that changes this variable and applies it when needed.

Best Regards,
Svetoslav Borislavov

Smart UI Team
https://www.htmlelements.com/

[svetoslav_borislavov]

Hi,

Can you please see the following example: https://codepen.io/svetoslavjqwidgets/pen/MWqqpKR

In it, if there isn’t a template, a new one is set.
If there is already a template, only the element is being modified.
May you do the same thing without render or refresh?

Best Regards,
Svetoslav Borislavov

Smart UI Team
https://www.htmlelements.com/

[svetoslav_borislavov]

Hi,

You may invoke the ‘render()’ method and the problem will be resolved
Here is an example: https://codepen.io/svetoslavjqwidgets/pen/MWqqpKR

Best Regards,
Svetoslav Borislavov

Smart UI Team
https://www.htmlelements.com/

[svetoslav_borislavov]

Hi,

The getEditCells method gets the editing cells when the grid is editing

Best Regards,
Svetoslav Borislavov

Smart UI Team
https://www.htmlelements.com/

[svetoslav_borislavov]

Hi,

The 3d Chart will be available in the jQWidgets package in Q2 2023.

Best Regards,
Svetoslav Borislavov

Smart UI Team
https://www.htmlelements.com/

[svetoslav_borislavov]

Hi,

The previously described behaviour is not a problematic one, rerendering the grid is a common thing.
You shouldn’t worry about it! I suggest you leave the template property from before.

Best Regards,
Svetoslav Borislavov

Smart UI Team
https://www.htmlelements.com/

[svetoslav_borislavov]

Hi,

We are happy to hear that. If you need any assistance, do not hesitate to contact us!

Best Regards,
Svetoslav Borislavov

Smart UI Team
https://www.htmlelements.com/

[Author]

Posts