No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    [v1] QSelect Cant trap ENTER key

    Framework
    3
    8
    1839
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • labs20
      labs20 last edited by labs20

      Hi. I’m trying to catch the ENTER key when it is pressed by the user, but unable to do it.

      Other keys like ESC I can trap with no problem. Looking at the QSelect source, by the line 468, I found a stopAndPrevent(e) that looks to me to be the culprit.

      As seen here, some folks need it to be happy, so unless I’m missing something, I’d like to suggest wrapping it on some bool property so you can turn on or off ENTER bubble on QSelect.

      Is that the case? If so, can it be implemented? If not, help?!? 🙂

      Thanks!

      patryckx 1 Reply Last reply Reply Quote 0
      • patryckx
        patryckx @labs20 last edited by

        @labs20 https://vuejs.org/v2/guide/events.html#Key-Modifiers

        try the Vue keyboard modifiers.

        1 Reply Last reply Reply Quote 0
        • labs20
          labs20 last edited by

          Thanks, but that was not the case.

          Looks like the event is not bubbling up.

          1 Reply Last reply Reply Quote 0
          • metalsadman
            metalsadman last edited by metalsadman

            @labs20 use @keyup.enter.native https://quasar.dev/vue-components/select#Native-attributes-with-use-input. Added a sample for this on my sample sandbox https://0ybb3.sse.codesandbox.io/component-samples try the first select component. src https://codesandbox.io/s/0ybb3.

            1 Reply Last reply Reply Quote 1
            • labs20
              labs20 last edited by labs20

              @metalsadman Thanks. Tried but do not worked. I couldn’t find a q-select(@keypress.enter.native=“someTestOnEnterKey”) on your code thou. Probably I’m missing something, sorry.

              To make things clear, I want the q-select doing its regular things (and it is doing all right on my code), BUT I need further capture the ENTER key after the q-select uses it, for my own evil purposes I’ll code on someRandomOnEnterFunction.

              Thanks again.

              1 Reply Last reply Reply Quote 0
              • metalsadman
                metalsadman last edited by metalsadman

                @labs20 The extended QSelect is in src/components/BaseComponents/BaseSelect.vue and it is used at src/pages/ComponentSamples/SelectSample.vue, if you tested the select input you’ll know that I did exactly what you wanted, and that is to listen for enter key. I know it’s doing a different function (since I was recreating a v0.17 workaround that I did sometime ago to v1). Just look into the code to know it works @keyup.enter.native="$_setValue" this line you can pass your own handler according to what functionality you wanted. This component is a QSelect extension that I made as example to some previous questions from other peeps here or discord chat.

                1 Reply Last reply Reply Quote 0
                • labs20
                  labs20 last edited by

                  Yes, now I found it.

                  And it works indeed, but not for @keypress.enter.native.

                  For @keyup.enter.native it works just fine.

                  Thanks

                  metalsadman 1 Reply Last reply Reply Quote 0
                  • metalsadman
                    metalsadman @labs20 last edited by

                    @labs20 said in [v1] QSelect Cant trap ENTER key:

                    Yes, now I found it.

                    And it works indeed, but not for @keypress.enter.native.

                    For @keyup.enter.native it works just fine.

                    Thanks

                    yeah wrongly stated it in my first post sry, it’s @keyup in the actual code since onkeypress is actually deprecated.

                    1 Reply Last reply Reply Quote 0
                    • First post
                      Last post