JavaScript UI Libraries & Blazor Components Suite – Smart UI Forums DropDownList Issue with multiple checkbox dropdownlist

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #104362
    loickbrouard
    Participant
    Up
    0
    Down

    Hello,

    First of all, great job with this library, we were already using jqwidget and we are considering to implements some features of htmlelements now 🙂

    With the free trial version I encountered a funny issue using dropdownlist with checkbox, the checkbox clicked is clicked as many times as the number of <smart-dropdown-list></smart-dropdown-list> on the html page.

    • With one smart-dropdown-list, while selecting an item of one of the dropdown :
      • the checkbox is checked
      • the itemChange is triggered once
    • With two smart-dropdown-list, while selecting an item of one of the dropdown :
      • the checkbox is checked then unchecked
      • the itemChange is triggered twice
    • etc…

    The code used :

    And looking through the forum and the different code pen exemple I figured out that this code above :

    • Does not work with “smart.dropdownlist.js” module – Smart UI v15.0.0 (2023-Jan)
    • Does not work with “smart.dropdownlist.js” module – Smart UI v15.0.0 (2023-Jan)
    • Work with the “smart.elements.js” module – Smart UI v14.1.2 (2022-07-06)

    If you have any idea about what I did wrong or what changed between the two versions I would be glad to have your feedback !

    HTML

    <script type=”module” src=”~/Scripts/webcomponents/modules/smart.scheduler.js”></script>
    <script type=”module” src=”~/Scripts/webcomponents/modules/smart.dropdownlist.js”></script>

    <script type=”text/javascript” src=”~/Scripts/myScript.js”></script>

    <smart-drop-down-list id=”firstFilter”></smart-drop-down-list>
    <smart-drop-down-list grouped id=”secondFilter”></smart-drop-down-list>

    JAVASCRIPT (myScript.js)

    const setFirstFilter = () => {

    Smart(‘#firstFilter’, class {
    get properties() {
    return {
    placeholder: “Filter”,
    filterable: true,
    filterInputPlaceholder: “blah…”,
    selectionMode: “checkBox”,
    animation: “none”}}});

    document.querySelector(‘#firstFilter’).addEventListener(‘itemClick’, (event) => {
    console.log(“firstFilterselected”);});
    }

    const setSecondFilter = () => {

    Smart(‘#secondFilter’, class {
    get properties() {
    return {
    placeholder: “Filter”,
    filterable: true,
    filterInputPlaceholder: “blah…”,
    selectionMode: “checkBox”,
    animation: “none”}}});

    document.querySelector(‘#secondFilter’).addEventListener(‘itemClick’, (event) => {
    console.log(“secondFilterselected”);});
    }

    window.onload = () => {
    setFirstFilter ();
    setSecondFilter ();
    }

    Br,

    Loïck

    • This topic was modified 1 month, 2 weeks ago by loickbrouard.
    • This topic was modified 1 month, 2 weeks ago by loickbrouard.
    #104366
    Markov
    Keymaster
    Up
    0
    Down

    Hi Loick,

    Thank you for the bug report. We created a work item and will resolve this one with the next release which will be in March.

    Best regards,
    Markov

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

Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.