Loading...

tapestry-dev@jakarta.apache.org

[Prev] Thread [Next]  |  [Prev] Date [Next]

[jira] Updated: (TAPESTRY-2070) EventListener on checkbox components within a @For loop - Issues kanthimathinathan (JIRA) Fri May 16 00:02:40 2008

     [ 
https://issues.apache.org/jira/browse/TAPESTRY-2070?page=com.atlassian.jira.plugin.system.issuetabpanels:all-tabpanel
 ]

kanthimathinathan updated TAPESTRY-2070:
----------------------------------------

    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="[EMAIL PROTECTED]" 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>




  was:
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="[EMAIL PROTECTED]" 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

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>





> EventListener on checkbox components within a @For loop - Issues
> ----------------------------------------------------------------
>
>                 Key: TAPESTRY-2070
>                 URL: https://issues.apache.org/jira/browse/TAPESTRY-2070
>             Project: Tapestry
>          Issue Type: Bug
>          Components: Annotations
>    Affects Versions: 4.1.3
>         Environment: OS : Windows XP. Softwares : Eclipse SDK 3.1.0, 
> MyEclipse 4.0.0, JDK 1.5, JBoss application server. HardWare : 80GB HDD, 2GB 
> RAM
>            Reporter: kanthimathinathan
>            Priority: Critical
>             Fix For: unspecified
>
>
> 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="[EMAIL PROTECTED]" 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>

-- 
This message is automatically generated by JIRA.
-
You can reply to this email to add a comment to the issue online.


---------------------------------------------------------------------
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]