Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ConfirmPopup: page scrolls up when push the button #3432

Closed
Cersin opened this issue Dec 20, 2022 · 6 comments
Closed

ConfirmPopup: page scrolls up when push the button #3432

Cersin opened this issue Dec 20, 2022 · 6 comments
Assignees
Labels
Type: Bug Issue contains a bug related to a specific component. Something about the component is not working
Milestone

Comments

@Cersin
Copy link

Cersin commented Dec 20, 2022

Describe the bug

Hi,
I have a scrollable page with a confirmation button at the bottom. Unfortunately, after pressing the button, the page scrolls to the top by itself, which is annoying. How can I solve this problem?

When i downgrade to PrimeVue version 3.12.4 everything works fine.
You can switch in sandbox to version 3.12.4 to see it.

        <Button
          class="p-button-success w-full mt-3"
          :label="$t('ui.order.submit')"
          icon="pi pi-shopping-cart"
          :disabled="loading"
          @click="placeOrder($event)"
        ></Button>
    confirm.require({
      target: event.currentTarget,
      message: trans('ui.dialog.confirm.message'),
      acceptClass: 'p-button-danger',
      acceptLabel: trans('ui.actions.yes'),
      rejectLabel: trans('ui.actions.no'),
      icon: 'pi pi-exclamation-triangle',
      accept: async () => {

Reproducer

https://codesandbox.io/s/compassionate-lovelace-xr1deg?file=/src/App.vue

PrimeVue version

3.20.0

Vue version

3.x

Language

TypeScript

Build / Runtime

Vue CLI App

Browser(s)

No response

Steps to reproduce the behavior

No response

Expected behavior

The page should stay in the same place after pressing the button

@Cersin Cersin added the Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible label Dec 20, 2022
@tugcekucukoglu tugcekucukoglu added Resolution: Cannot Replicate Issue could not be replicated by Core Team and removed Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible labels Dec 21, 2022
@github-actions
Copy link

We're unable to replicate your issue, if you are able to create a reproducer or add details please edit this issue. This issue will be closed if no activities in 20 days.

@Cersin
Copy link
Author

Cersin commented Dec 21, 2022

@tugcekucukoglu i gave you a reproducer. https://codesandbox.io/s/compassionate-lovelace-xr1deg?file=/src/App.vue
Just scroll down, click on the button and it scrolls to top of the page... with 3.12.4 version of primevue it works fine.

@Cersin
Copy link
Author

Cersin commented Dec 21, 2022

Mozilla and Chrome, macos. On safari its working.

@Cersin
Copy link
Author

Cersin commented Dec 21, 2022

@tugcekucukoglu i added you a gif.
bug

@tugcekucukoglu tugcekucukoglu added Type: Bug Issue contains a bug related to a specific component. Something about the component is not working and removed Resolution: Cannot Replicate Issue could not be replicated by Core Team labels Dec 22, 2022
@tugcekucukoglu tugcekucukoglu self-assigned this Dec 22, 2022
@tugcekucukoglu tugcekucukoglu added this to the 3.22.0 milestone Dec 22, 2022
@tugcekucukoglu tugcekucukoglu changed the title ConfirmPopup: page scrolls up when you push te button ConfirmPopup: page scrolls up when push the button Jan 9, 2023
@Cersin
Copy link
Author

Cersin commented Jan 11, 2023

@tugcekucukoglu its working now but only with first click.
https://codesandbox.io/s/compassionate-lovelace-xr1deg
When you click no and try again it scrolls up again :P

@Cersin
Copy link
Author

Cersin commented Jan 23, 2023

@tugcekucukoglu @bahadirsofuoglu any news?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Type: Bug Issue contains a bug related to a specific component. Something about the component is not working
Projects
None yet
Development

No branches or pull requests

2 participants