Tapestry
  1. Tapestry
  2. TAPESTRY-2070

EventListener on checkbox components within a @For loop - Issues

    Details

    • Type: Bug Bug
    • Status: Resolved
    • Priority: Critical Critical
    • Resolution: Fixed
    • Affects Version/s: 4.1.3
    • Fix Version/s: 4.1.5
    • Component/s: Annotations
    • Labels:
      None
    • Environment:
      Tapestry 4.1.3

      Description

      I want to enable / disable a button on clicking a checkbox in the screen. i am trying the below code Snippet

      HTML template code snippet

      <tr jwcid="@For" source="ognl:lists" index="ognl:listIndex" value="ognl:listData">
      <td align="left">
      <form jwcid="@Form" style="margin:0px;padding:0px;">
      <span jwcid="checkbox@Checkbox" id="ognl:listIndex" value="ognl:checkedList[listIndex]" />
      </form>
      </td>
      </tr>

      Java code snippet

      @EventListener(events = "onclick", targets =

      {"checkbox"}

      )
      public void updateComponents(IRequestCycle cycle, BrowserEvent event)

      { cycle.getResponseBuilder().updateComponent("button1"); }

      Issue 1: Eventlistener is not called for last checkbox and so button is not enabled / disabled as expected.

      Issue 2: on clicking 2nd or subsequent checkboxes in the UI screen, Button is enabled/disabled as expected. However AJAX requests sent is equivalent to the no of checkboxes(or rows) in the screen, which cause performance issues.

      Note : On clicking 1st checkbox, buttons are enabled/disabled as expected with just 1 Ajax request.

      please help me to resolve these issues.

      Thanks,
      Kanthi.

      Additional Information - Added on 24th January 2008

      Problem is with DOJO java scripts generated by tapestry 4.1.3. I have pasted the dojo code snippet generated. For the 4th checkbox, forms of checkbox 1- 4 are submittted asynchronously. Please let me know how this could be resolved

      <script type="text/javascript"><!--
      dojo.addOnLoad(function(e) {
      dojo.require("tapestry.form");
      tapestry.form.registerForm("Form");
      tapestry.form.registerForm("Form_0");

      tapestry.cleanConnect(dojo.byId("checkbox0"),
      "onclick", "formEvent2009464232");
      tapestry.formEvent2009464232=function(e){
      var content=

      {beventname:"onclick", bcomponentid:"checkbox"}

      ;
      tapestry.event.buildEventProperties(e, content, arguments);
      if (!content["beventtarget.id"])

      { content["beventtarget.id"]="checkbox0"; }

      var validateState=tapestry.form.forms["Form_0"].validateForm;
      var validateForm=false;
      tapestry.form.setFormValidating("Form_0", validateForm);

      tapestry.form.submitAsync("Form_0", content);

      tapestry.form.setFormValidating("Form_0", validateState);

      };
      dojo.event.connect(dojo.byId("checkbox0"), "onclick",
      tapestry, "formEvent2009464232");
      tapestry.form.registerForm("Form_0_0");
      tapestry.cleanConnect(dojo.byId("checkbox1"),
      "onclick", "formEvent1811198999");
      tapestry.formEvent1811198999=function(e){
      var content=

      {beventname:"onclick", bcomponentid:"checkbox"}

      ;
      tapestry.event.buildEventProperties(e, content, arguments);
      if (!content["beventtarget.id"])

      { content["beventtarget.id"]="checkbox1"; }

      var validateState=tapestry.form.forms["Form_0"].validateForm;
      var validateForm=false;
      tapestry.form.setFormValidating("Form_0", validateForm);

      tapestry.form.submitAsync("Form_0", content);

      tapestry.form.setFormValidating("Form_0", validateState);

      };
      dojo.event.connect(dojo.byId("checkbox1"), "onclick",
      tapestry, "formEvent1811198999");
      tapestry.form.registerForm("Form_0_1");
      tapestry.cleanConnect(dojo.byId("checkbox2"),
      "onclick", "formEvent1811198999");
      tapestry.formEvent1811198999=function(e){
      var content=

      {beventname:"onclick", bcomponentid:"checkbox"}

      ;
      tapestry.event.buildEventProperties(e, content, arguments);
      if (!content["beventtarget.id"])

      { content["beventtarget.id"]="checkbox2"; }

      var validateState=tapestry.form.forms["Form_0"].validateForm;
      var validateForm=false;
      tapestry.form.setFormValidating("Form_0", validateForm);

      tapestry.form.submitAsync("Form_0", content);

      tapestry.form.setFormValidating("Form_0", validateState);

      var validateState=tapestry.form.forms["Form_0_0"].validateForm;
      var validateForm=false;
      tapestry.form.setFormValidating("Form_0_0", validateForm);

      tapestry.form.submitAsync("Form_0_0", content);

      tapestry.form.setFormValidating("Form_0_0", validateState);

      };
      dojo.event.connect(dojo.byId("checkbox2"), "onclick",
      tapestry, "formEvent1811198999");
      tapestry.form.registerForm("Form_0_2");
      tapestry.cleanConnect(dojo.byId("checkbox3"),
      "onclick", "formEvent1811198999");
      tapestry.formEvent1811198999=function(e){
      var content=

      {beventname:"onclick", bcomponentid:"checkbox"}

      ;
      tapestry.event.buildEventProperties(e, content, arguments);
      if (!content["beventtarget.id"])

      { content["beventtarget.id"]="checkbox3"; }

      var validateState=tapestry.form.forms["Form_0"].validateForm;
      var validateForm=false;
      tapestry.form.setFormValidating("Form_0", validateForm);

      tapestry.form.submitAsync("Form_0", content);

      tapestry.form.setFormValidating("Form_0", validateState);

      var validateState=tapestry.form.forms["Form_0_0"].validateForm;
      var validateForm=false;
      tapestry.form.setFormValidating("Form_0_0", validateForm);

      tapestry.form.submitAsync("Form_0_0", content);

      tapestry.form.setFormValidating("Form_0_0", validateState);

      var validateState=tapestry.form.forms["Form_0_1"].validateForm;
      var validateForm=false;
      tapestry.form.setFormValidating("Form_0_1", validateForm);

      tapestry.form.submitAsync("Form_0_1", content);

      tapestry.form.setFormValidating("Form_0_1", validateState);

      };
      dojo.event.connect(dojo.byId("checkbox3"), "onclick",
      tapestry, "formEvent1811198999");
      tapestry.form.focusField('checkbox0');});
      // --></script></body>

      <script>

        Issue Links

          Activity

          Hide
          Jesse Kuhnert added a comment -

          Fixed by fix for TAPESTRY-2092.

          Show
          Jesse Kuhnert added a comment - Fixed by fix for TAPESTRY-2092 .
          Hide
          kanthimathinathan added a comment -

          Updated the description with additional information.

          Show
          kanthimathinathan added a comment - Updated the description with additional information.

            People

            • Assignee:
              Jesse Kuhnert
              Reporter:
              kanthimathinathan
            • Votes:
              0 Vote for this issue
              Watchers:
              0 Start watching this issue

              Dates

              • Created:
                Updated:
                Resolved:

                Development