3

I have an scenario where pageblocks in visualforce are dynamically rendered based on the list size. In each page block i am performing some calculations OnKeyup using javascript and JQ and result is stored in one field.My code works fine for single block.But its not working as expected for dynamically generated pageblocks.

<apex:page standardController="Calender_Year_Revenue__c"  Extensions="calendaryear">
     <apex:includeScript value="{!$Resource.jqueryCollapse}"/>
      <apex:includeScript value="{!$Resource.jqueryCollapse1}"/>
      <apex:includeScript value="{!$Resource.jqueryCollapse2}"/>
      <apex:includeScript value="{!$Resource.jquerycollapse21}"/>
      <apex:form >
       <apex:pageBlock >
      <Apex:PageBlockSection columns="2" >
          <apex:repeat value="{!lc}" var="c" id="repeat">
              <apex:inputField label="{!c.Label__c}" value="{!cy.Revenue__c }" onchange="calculate(this);" styleClass="Rptcls" >

              </apex:inputField>
          </apex:repeat>
           <apex:inputField label="Terms" value="{!cy.Terms__c }" styleClass="Rptcls" />
          <apex:inputField id="Rep" label="Total" value="{!cy.TotalRevenue__c }" styleClass="Rptcls1" />
          <apex:commandButton value="Submit" action="{!action}"/>
              <apex:param name="action" value="{!cy.Revenue__c}"/>  
    </Apex:pageBlockSection>
    </apex:pageBlock>   
  </apex:form>
  <script>
         $(document).ready(function() {                          
         $(".Rptcls").on('keyup',function(){
             var sum= 0; 
              $(".Rptcls").each(function() {                        
                    if(!isNaN($(this).val()) && $(this).val().length!=0) {                                
                        sum += parseFloat($(this).val());
                         $(".Rptcls1").val(sum);
                    }                                                                    
             });                               
         });
      });      
  </script>

</apex:page>
Improve this question
4
  • If it's not a mistake while posting, check your var="c" because it has been used as c as well as cy. Also have you a JS function called calculate() ? any script errors? Commented Jul 14, 2014 at 6:06
  • cy is the inputfield variable which i am getting from controller.calculate() function i am not using it .pls ignore Commented Jul 14, 2014 at 6:15
  • Can you provide detail of what "not working as expected" means i.e. what is expected and what actually happens? And also explain what you are doing to have "dynamically generated pageblocks"? Commented Jul 14, 2014 at 8:42
  • I am displaying services and their products in a pageblock (both are custom objects) .From the controller i am querying for the services and its product in a list.In vf page i am populating this values in pageblock from the list .By using repeat tag....SO depending on the list size page blocks will be created.....OnKey up if i change a value on one page block ,its calculating all pageblocks value and populating in the output field.What i expect was onKeyup on particular page block only that blocks value should be changed it should no calculate otr blocks.Actually the fault is wt my script. Commented Jul 14, 2014 at 9:22

1 Answer 1

Reset to default
3

The problem you have here is that when you add the click handler through the following code:

$(".Rptcls").on('keyup',function(){
             var sum= 0; 
              $(".Rptcls").each(function() {                        
                    if(!isNaN($(this).val()) && $(this).val().length!=0) {                                
                        sum += parseFloat($(this).val());
                         $(".Rptcls1").val(sum);
                    }                                                                    
             });                               
         });

That will add it to all elements in the current DOM that match the selector, as documented at :

http://api.jquery.com/on/

The key piece of text is:

Event handlers are bound only to the currently selected elements; they must exist on the page at the time your code makes the call to .on(). To ensure the elements are present and can be selected, perform event binding inside a document ready handler for elements that are in the HTML markup on the page. If new HTML is being injected into the page, select the elements and attach event handlers after the new HTML is placed into the page.

Improve this answer
2
  • i know the fault is on my script.But i dont have any idea how to develop script for this functionality.Onkeyup on particular block only that block value must be affected ,it should not affect or calculate other blocks.Any idea from you will be helpful for me. Commented Jul 14, 2014 at 9:25
  • You'll need to iterate just the inputs contained in the pageblock - that's quite a lot of JavaScript through, and would make this too broad a question to be answered in this format. Commented Jul 14, 2014 at 10:05

You must log in to answer this question.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.