Wicket
  1. Wicket
  2. WICKET-4769

Clicking on Label of Radio doesn't update component with Ajax update

    Details

    • Type: Bug Bug
    • Status: Resolved
    • Priority: Major Major
    • Resolution: Fixed
    • Affects Version/s: 6.0.0
    • Fix Version/s: 6.2.0
    • Component/s: wicket
    • Labels:
      None

      Description

      We just upgraded a application from wicket 1.4 to wicket 6.
      We discovered that when clicking on the label of a radio button that has a AjaxFormChoiceComponentUpdatingBehavior attached the radio is not selected.

      I'll attach 2 testcases (one for wicket 1.4 and one for wicket 6)

      1. radio-choice-bug-6.0.0.tar
        50 kB
        Aaron J. Garcia
      2. radio-label.html
        0.6 kB
        Thijs Vonk
      3. test.zip
        10 kB
        Thijs Vonk
      4. test14.zip
        10 kB
        Thijs Vonk

        Issue Links

          Activity

          Hide
          Thijs Vonk added a comment -

          test runs on port 8080
          test14 runs on port 8081

          Show
          Thijs Vonk added a comment - test runs on port 8080 test14 runs on port 8081
          Hide
          Aaron J. Garcia added a comment -

          I'm also having this issue, but I went from 1.5.8 -> 6.0.0. I have a Quick Start too, which I will attach. It seems that this only happens when the RadioChoice form component is inside of a form. When I had a RadioChoice component outside of the form, the issue wasn't occurring.

          Show
          Aaron J. Garcia added a comment - I'm also having this issue, but I went from 1.5.8 -> 6.0.0. I have a Quick Start too, which I will attach. It seems that this only happens when the RadioChoice form component is inside of a form. When I had a RadioChoice component outside of the form, the issue wasn't occurring.
          Hide
          Aaron J. Garcia added a comment -

          Another quick start that illustrates the issue.

          Show
          Aaron J. Garcia added a comment - Another quick start that illustrates the issue.
          Hide
          Aaron J. Garcia added a comment -

          Some more details (sorry for the multiple comments):

          Java Version: 1.7.0_04
          Tomcat Version: 7.0.27
          Firefox Version: 15.0
          Operating System: Open Suse 11.4

          Show
          Aaron J. Garcia added a comment - Some more details (sorry for the multiple comments): Java Version: 1.7.0_04 Tomcat Version: 7.0.27 Firefox Version: 15.0 Operating System: Open Suse 11.4
          Hide
          Thijs Vonk added a comment -

          In my example the radio is inside a radiogroup, not in a form.

          Show
          Thijs Vonk added a comment - In my example the radio is inside a radiogroup, not in a form.
          Hide
          Thijs Vonk added a comment -

          I build wicket from source, but the example provided in test.zip (and so also my application) still don't work. Can this be reopened?

          Show
          Thijs Vonk added a comment - I build wicket from source, but the example provided in test.zip (and so also my application) still don't work. Can this be reopened?
          Hide
          Martin Grigorov added a comment -

          When I debugged it I used radio-choice-bug-6.0.0.tar...
          Testing with test.zip I see that it fires the Ajax event twice - the second time it comes after repainting the group.
          By just commenting out the line:
          target.add(group);
          in TestPage it starts working.

          I have no idea why it fires 'click' event after the DOM replacements.

          Show
          Martin Grigorov added a comment - When I debugged it I used radio-choice-bug-6.0.0.tar... Testing with test.zip I see that it fires the Ajax event twice - the second time it comes after repainting the group. By just commenting out the line: target.add(group); in TestPage it starts working. I have no idea why it fires 'click' event after the DOM replacements.
          Hide
          Thijs Vonk added a comment -

          I wish I could comment out that line in my reallife application. There it's part of a larger repaint action.
          I'll start digging, to see if I can find out why it gets repainted a second time.

          Show
          Thijs Vonk added a comment - I wish I could comment out that line in my reallife application. There it's part of a larger repaint action. I'll start digging, to see if I can find out why it gets repainted a second time.
          Hide
          Thijs Vonk added a comment -

          When I comment out target.add(group); it still fires the ajax call twice.
          Only difference is that now the selection stay's

          Show
          Thijs Vonk added a comment - When I comment out target.add(group); it still fires the ajax call twice. Only difference is that now the selection stay's
          Hide
          Thijs Vonk added a comment - - edited

          The repainting of the dom doesn't trigger the second event.
          When you click on the label 2 click events are fired. If you click on the radio button there is only one event.
          See the attached html file demonstrating the issue.

          This causes the ajax request to happen twice, with all kinds of weird side effects.

          some extra info: http://bugs.jquery.com/ticket/10673

          Show
          Thijs Vonk added a comment - - edited The repainting of the dom doesn't trigger the second event. When you click on the label 2 click events are fired. If you click on the radio button there is only one event. See the attached html file demonstrating the issue. This causes the ajax request to happen twice, with all kinds of weird side effects. some extra info: http://bugs.jquery.com/ticket/10673
          Hide
          Martin Grigorov added a comment -

          It is not the same. In your code the <label> doesn't wrap the <input>.
          http://jsfiddle.net/HKGsT/14/ works as expected.

          Show
          Martin Grigorov added a comment - It is not the same. In your code the <label> doesn't wrap the <input>. http://jsfiddle.net/HKGsT/14/ works as expected.
          Hide
          Thijs Vonk added a comment -

          Ah yes. But as sone as you pull the click event to an wrapping div: http://jsfiddle.net/LmMuy/ (which is basically the same as my earlier example) it gives the same behavior of the double event.

          (May be I'm now stating the obvious, not sure I understood your comment completely)

          Show
          Thijs Vonk added a comment - Ah yes. But as sone as you pull the click event to an wrapping div: http://jsfiddle.net/LmMuy/ (which is basically the same as my earlier example) it gives the same behavior of the double event. (May be I'm now stating the obvious, not sure I understood your comment completely)
          Hide
          Martin Grigorov added a comment -

          I just committed a change [1] which I'll have to revert :-/
          It works only if the choice component is repainted with the Ajax response.

          1. https://git-wip-us.apache.org/repos/asf/wicket/repo?p=wicket.git;a=commitdiff;h=881d03ec84ead3386d37faf0eecf50d05fe30ac9

          Show
          Martin Grigorov added a comment - I just committed a change [1] which I'll have to revert :-/ It works only if the choice component is repainted with the Ajax response. 1. https://git-wip-us.apache.org/repos/asf/wicket/repo?p=wicket.git;a=commitdiff;h=881d03ec84ead3386d37faf0eecf50d05fe30ac9
          Hide
          Martin Grigorov added a comment -

          I think I solved it.
          Please try the latest code in master branch.

          Show
          Martin Grigorov added a comment - I think I solved it. Please try the latest code in master branch.
          Hide
          Sven Meier added a comment -

          I have a solution for WICKET-4797 ready that would solve this issue too. May I interrupt your check-ins for a moment?

          Show
          Sven Meier added a comment - I have a solution for WICKET-4797 ready that would solve this issue too. May I interrupt your check-ins for a moment?
          Hide
          Thijs Vonk added a comment -

          The test case (as in test.zip) works!!
          Tomorrow, when I'm actually working, i'll try the big app where I found the issue. Thanks so far

          Show
          Thijs Vonk added a comment - The test case (as in test.zip) works!! Tomorrow, when I'm actually working, i'll try the big app where I found the issue. Thanks so far
          Hide
          Sven Meier added a comment -

          I've checked a solution for WICKET-4797 which addresses this issue too. Now the input name is used for Ajax precondition and identification of checked inputs, which hopefully is much simpler to understand and maintain.

          I took the opportunity to impoved the Javascript similar Carl-Eric's AbstractCheckSelector.

          Show
          Sven Meier added a comment - I've checked a solution for WICKET-4797 which addresses this issue too. Now the input name is used for Ajax precondition and identification of checked inputs, which hopefully is much simpler to understand and maintain. I took the opportunity to impoved the Javascript similar Carl-Eric's AbstractCheckSelector.
          Hide
          Thijs Vonk added a comment -

          It works! Thanks Martin and Sven

          Show
          Thijs Vonk added a comment - It works! Thanks Martin and Sven

            People

            • Assignee:
              Martin Grigorov
              Reporter:
              Thijs Vonk
            • Votes:
              1 Vote for this issue
              Watchers:
              5 Start watching this issue

              Dates

              • Created:
                Updated:
                Resolved:

                Development