Our powerful JS Calendar component
Hello,
I have two questions concerning the interaction between the Grid and the Calendar; any help you can provide would be appreciated!
- Is there a way to pin the title of the Grid to the top of the Grid after it collapses? On the Bryntum demo https://bryntum.com/products/calendar/examples/dragfromgrid/, the title is pinned to the top after collapse. But in the Bryntum Salesforce LWC demo example, I replaced the code in the createCalendar() method with the code from the demo https://bryntum.com/products/calendar/examples/dragfromgrid/ and added “collapsed: true” to the Grid, and the title of the Grid will shift to the bottom after expanding and collapsing it once (screenshot attached)
- Can I request functionality to add icons via an HTML string to the selected item in the Bryntum Combo using displayValueRenderer? I saw this feature request post viewtopic.php?f=51&t=21262&p=105214#p105214 and noticed that it got removed from the 5.2.x milestone.
Thanks again,
Connor
-
Attachments
-
- Screen Shot 2023-05-11 at 1.11.15 PM.png (1.21 MiB) Viewed 356 times
Hey Connor,
Regarding your first question, that would be some CSS that you can use to align the button and the title correctly, if you could share your project, we could assist you on this.
Regarding the second part, I added a note to the ticket, but if you want to speed up the development of that feature, you can sponsor it, please contact our services to get more information about that.
The grid header looks like a CSS issue. Check the DOM order and how the CSS is laying it out.
For a Combo, the displayValueRenderer
is what creates text to put back into the input field on selection of a record.
The listItemTpl
could be what you need for creating content inside the dropdown List
.
Or, you could just use the itemIconTpl
for more granularity. Like the ResourceCombo
does:
- Screenshot 2023-05-11 at 22.45.46.png (384.4 KiB) Viewed 347 times
It's not documented. I am hoping to move away from this ugly "Template" concept with huge and ugly strings of HTML to create an dadd up, and move to a DomConfig
object based way of customizing a List's content, so I don't really want to make the sub templates public now.
But if and when I make the change, the templates should continue to be supported.
Thanks for the responses! I just wanted to follow up on my first question again and provide some simplified code for you; the issue only seems reproducible in LWC. The title is properly placed initially, but after expanding the grid and then collapsing it again, the title now will appear towards the bottom of the container like in the picture.
I haven't figured out a great way to handle this with pure CSS but I could be missing something as well - any additional help would be appreciated.
Thanks,
Connor
-
Attachments
-
- calendar_component.zip
- (4.18 KiB) Downloaded 19 times
That sounds like a bug in LWC. It is an extremely hostile environment and has many broken, buggy, or just omitted APIs.
I have seen code to work around element.insertBefore(newNode, refNode)
not working and instead calling appendChild
When you examine the DOM before and after the bug hitting, is the element order different?
If so, what happens if you attempt to correct the order in the debugger using the DOM standard APIs?