JavaScript UI Libraries & Blazor Components Suite – Smart UI › Forums › Buttons › smart checkbox on click doesn't fire on firefox

Tagged: 

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • May 31, 2021 at 1:25 pm #101862
    tullio0106
    Member

    I’ve a chechbox in my application.
    When I click it the onclick event should fire.
    On Chrome it works in both cases.
    In Firefox it works only when I check the checkbox but when I uncheck it, it doesn’ fire.
    How can I solve it ?
    Tks

    May 31, 2021 at 1:29 pm #101864
    tullio0106
    Member

    The test case

    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>CheckBox Overview</title>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
    <link rel="stylesheet" type="text/css" href="../../../source/styles/smart.default.css" />
    <link rel="stylesheet" type="text/css" href="../../../styles/demos.css" />
    <link rel="stylesheet" type="text/css" href="styles.css" />
    </head>
    <body class="viewport">
    <smart-check-box id="checkBox" onclick="alert('Done');">Check Box</smart-check-box>
    <!-- scripts -->
    <script type="module" src="../../../source/modules/smart.checkbox.js"></script>
    <script type="module" src="index.js"></script>
    </body>
    </html>

    May 31, 2021 at 1:36 pm #101865
    yavordashew
    Member

    Hi tullio0106,
    In order for you to achieve the functionality you want you will have to bind for the onchange event.
    I have a code snippet using your code example:
    <smart-check-box id="checkBox" onchange="alert('Done');">Check Box</smart-check-box>
    Also you can take a look at the following demo:
    https://www.htmlelements.com/demos/checkbox/events/
    Please, do not hesitate to contact us if you have any additional questions.
    Best regards,
    Yavor Dashev
    Smart UI Team
    https://www.htmlelements.com/

    May 31, 2021 at 1:51 pm #101866
    tullio0106
    Member

    Tks it seems to work but in that case I don’t get back the value of the check box in my form.
    Tks

    May 31, 2021 at 2:12 pm #101868
    yavordashew
    Member

    Hi tullio0106,
    If you want to get the value of the smart-checkbox I have a code snippet made with the demo I send you in my previous reply:

    
 let checkBox = document.getElementById('checkBox');
 checkBox.addEventListener('change', (event) => {
        console.log(event.detail.value)
    })

    Please, do not hesitate to contact us if you have any additional questions.
    Best regards,
    Yavor Dashev
    Smart UI Team
    https://www.htmlelements.com/

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