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.

Sign up for GitHub

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

Jump to bottom

AJAX loader spinning circle is placed before the input field of a DF Customer reference #3973

Open
stefanhaerter opened this issue Dec 9, 2024 · 3 comments · May be fixed by #4019
Open

AJAX loader spinning circle is placed before the input field of a DF Customer reference #3973

stefanhaerter opened this issue Dec 9, 2024 · 3 comments · May be fixed by #4019
Assignees
@MichaelThumes
Labels
style Beautify please tidying Tidying of the code
Milestone
OTOBO 11.0.8

Comments

@stefanhaerter
Copy link
Contributor

Observed in AgentTicketCompose, Dynamic Fields of Object Type Article: For a DF Dropdown, the spinning AJAX loader circle is placed behind the input (that is, to the right of the dropdown), but for the DF Customer Reference (AutoComplete) the spinning circle is placed to the left, between the label and the input field.
@stefanhaerter stefanhaerter added tidying Tidying of the code style Beautify please labels Dec 9, 2024
@stefanhaerter stefanhaerter added this to the OTOBO 11.0.8 milestone Dec 9, 2024
@stefanhaerter
Copy link
Contributor Author

Additional Information: Affects CustomerUser dynamic fields of object type Ticket as well, observed in AgentTicketPhone. The spinner in question shows when choosing a suggested element from autocomplete.

@MichaelThumes
Copy link
Contributor

the function triggered to display the AJAX loader spinner is ToggleAjaxLoader in Core.AJAX.js line 108ff. The spinner gets inserted into DOM in line 149:

        // Show or hide the loader
        if (ActiveAJAXCalls[FieldID] > 0) {
            if (!$Loader.length) {
                $Element.after(LoaderHTML);         // <------------------
            }

$Element here is the original select input element, and the Spinner gets appended after the original select.

For Dynamic Fields of Reference Type (I tried with ticket), however, the original select element will be hidden, followed by a dynamic generated select for the autocomplete. Now with Ajax Spinner appended, the DOM looks like:

  • original select (hidden)
  • ajax spinner
  • dynamically generated select (visible)

So yes, in this case the Ajax Spinner is displayed before the (visible) input select.

Candidate: Maybe try append to parent, instead of using after, something like this:

        // Show or hide the loader
        if (ActiveAJAXCalls[FieldID] > 0) {
            if (!$Loader.length) {
                //$Element.after(LoaderHTML);
                $Element.parent().append(LoaderHTML);
            }

Expectation - DOM now looks like:

  • original select (hidden)
  • dynamically generated select (visible)
  • ajax spinner

And thus Spinner to be displayed after the select !?

@MichaelThumes MichaelThumes self-assigned this Jan 7, 2025
MichaelThumes added a commit that referenced this issue Jan 7, 2025
@MichaelThumes
Issue #3973: change the wax Ajax spinner is appended to DOM
a341d1c
@MichaelThumes
Copy link
Contributor

test suite run: https://git.otobo.org/rotheross/otobo-testsuite/-/jobs/6860

Test Summary Report
-------------------
scripts/test/Compile.t                                                                         (Wstat: 0 Tests: 1782 Failed: 0)
  TODO passed:   715, 845
scripts/test/GenericInterface/Invoker/Ticket/WebserviceTicketInvoker.t                         (Wstat: 1280 (exited 5) Tests: 5 Failed: 5)
  Failed tests:  1-5
  Non-zero exit status: 5
scripts/test/Selenium/Agent/AgentTicketActionCommon/AgentTicketOwner.t                         (Wstat: 512 (exited 2) Tests: 51 Failed: 2)
  Failed tests:  50-51
  Non-zero exit status: 2
scripts/test/Selenium/Agent/AgentTicketZoom.t                                                  (Wstat: 256 (exited 1) Tests: 70 Failed: 1)
  Failed test:  70
  Non-zero exit status: 1
scripts/test/Selenium/TestingMethods.t                                                         (Wstat: 0 Tests: 36 Failed: 0)
  TODO passed:   21, 24, 28
Files=974, Tests=81642, 5081 wallclock secs (19.45 usr  4.34 sys + 1411.09 cusr 351.73 csys = 1786.61 CPU)
Result: FAIL
ran tests for product OTOBO 11.0.x on host 755ec050f51a .
Running after_script 00:00
Running after script...
$ if [ -d "otodo-docker" ]; then echo "cleanup"; cd otobo-docker; docker compose down;  fi
$ if [ -d "var/tap" ] ; then echo "rm tap"; rm -rf var/tap; fi
$ echo "This was branch ${OTOBO_BRANCH} on otobo-docker:${OTOBO_BASE}. Over and out."
This was branch issue-#3873-ajax-spinner-placement on otobo-docker:rel-11_0. Over and out.

only known current failures, see #3931

@MichaelThumes MichaelThumes linked a pull request Jan 8, 2025 that will close this issue
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@MichaelThumes MichaelThumes

Labels
style Beautify please tidying Tidying of the code
Projects
None yet
Milestone
OTOBO 11.0.8
Development

Successfully merging a pull request may close this issue.

Issue #3973: change the way Ajax spinner is appended to DOM RotherOSS/otobo
2 participants
@MichaelThumes @stefanhaerter