function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
The FinnsterThe Finnster 

Add an additional onchange field to a visual force page

Hi,
I have a custom visual force page that we use to add products to the opportunity. There is a Total Value field on the page that gives the value of the product in USD based on the Start Date, End Date and Quantity and price of the product. I want to add another field to the page that does a similar job but give the total value in AED i,e the exisiting Total Value field * 3.675

 
The FinnsterThe Finnster
Here's half of the VF page 
<apex:page controller="AddProductCtrl" id="SrchPg" tabstyle="Opportunity" action="{!CheckPriceBookSelection}" sidebar="false" language="en_Us">
    
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous" />
    
    <apex:sectionHeader Title="{!SubTitle}" subtitle="{!objOpp.Name}" id="SHeader"/>
    <apex:stylesheet value="{!$Resource.LighBoxCSS}/popup/reveal.css"/>
    <apex:includeScript value="{!$Resource.LighBoxCSS}/popup/jquery.min.js"/>
    <apex:includeScript value="{!$Resource.LighBoxCSS}/popup/jquery.reveal.js"/>
    <script>
    $( document ).ready(function() {
        totalValueOfAllProducts();
    });
    </script>
    
    <style>
        .dateFormat{
        display:none;
        }
    </style>
    <style>
        /* This is for the full screen DIV */
        .popupBackground {
        /* Background color */
        background-color:black;
        opacity: 0.20;
        filter: alpha(opacity = 20);
        
        /* Dimensions */
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        z-index: 998;
        position: absolute;
        }
        /* This is for the message DIV */
        .PopupPanel {
        /* Background color */
        /*border: solid 2px #00205B;
        background-color: white;
        */
        /* Dimensions */
        left: 50%;
        width: 100px;
        margin-left: -100px;
        border-radius: 15px;
        top: 30% !important;
        height: 100px;
        margin-top: 75px;
        z-index: 999;
        position: fixed;
        }
        .reveal-modal{
        left:60%;
        }
        body .bPageBlock .pbBody .labelCol, body .bPageBlock .pbBody .dataCol, body .bPageBlock .pbBody .data2Col, body .print .topics-label, body .print .topics-list{
        width:100px !important;
        }
        #ModalDiv .pbTitle{
        display:none;
        }
    </style>
    <apex:actionStatus id="pleasewait" stopText="">
        <apex:facet name="start">
            <div>
                <div class="popupBackground"></div>
                <div class="PopupPanel">
                    <img src="{!$Resource.LoadingImage}"/>
                </div>
            </div>
        </apex:facet>
    </apex:actionStatus>
    <apex:form id="SrchFrm">
        <apex:actionfunction name="AddXLinesAF" action="{!Add_X_OLI}" rerender="OLIPanel" status="pleasewait">
            <apex:param name="XRowIndexNum" value="" assignTo="{!xLineRowIndex}"/>
        </apex:actionfunction>
        
        <apex:actionfunction name="copyDescription" action="{!copyDescription}" rerender="OLIPanel" status="pleasewait">
            <apex:param name="XRowIndexNum" value="" assignTo="{!rowIndex}"/>
            <apex:param name="Xcheck" value="" assignTo="{!blCopytoBlank}"/>
        </apex:actionfunction>
        
        <apex:actionfunction name="copyBilling" action="{!copyBilling}" rerender="OLIPanel" status="pleasewait">
            <apex:param name="XRowIndexNum" value="" assignTo="{!rowIndex}"/>
            <apex:param name="Xcheck" value="" assignTo="{!blCopytoBlank}"/>
        </apex:actionfunction>
        
        <apex:actionfunction name="copyQuantity" action="{!copyQuantity}" rerender="OLIPanel" status="pleasewait">
            <apex:param name="XRowIndexNum" value="" assignTo="{!rowIndex}"/>
            <apex:param name="Xcheck" value="" assignTo="{!blCopytoBlank}"/>
        </apex:actionfunction>
        
        <apex:actionfunction name="copyStartDate" action="{!copyStartDate}" rerender="OLIPanel" status="pleasewait">
            <apex:param name="XRowIndexNum" value="" assignTo="{!rowIndex}"/>
            <apex:param name="Xcheck" value="" assignTo="{!blCopytoBlank}"/>
        </apex:actionfunction>
        
        <apex:actionfunction name="copyEndDate" action="{!copyEndDate}" rerender="OLIPanel" status="pleasewait">
            <apex:param name="XRowIndexNum" value="" assignTo="{!rowIndex}"/>
            <apex:param name="Xcheck" value="" assignTo="{!blCopytoBlank}"/>
        </apex:actionfunction>
        
        <apex:actionfunction name="copyPrice" action="{!copyPrice}" rerender="OLIPanel" status="pleasewait">
            <apex:param name="XRowIndexNum" value="" assignTo="{!rowIndex}"/>
            <apex:param name="Xcheck" value="" assignTo="{!blCopytoBlank}"/>
        </apex:actionfunction>
        
        <apex:actionfunction name="copyDiscount" action="{!copyDiscount}" rerender="OLIPanel" status="pleasewait">
            <apex:param name="XRowIndexNum" value="" assignTo="{!rowIndex}"/>
            <apex:param name="Xcheck" value="" assignTo="{!blCopytoBlank}"/>
        </apex:actionfunction>
        
        <apex:actionfunction name="copyRFDiscount" action="{!copyRFDisc}" rerender="OLIPanel" status="pleasewait">
            <apex:param name="XRowIndexNum" value="" assignTo="{!rowIndex}"/>
            <apex:param name="Xcheck" value="" assignTo="{!blCopytoBlank}"/>
        </apex:actionfunction>
        
        <apex:outputpanel layout="block" id="SrchResultsPanel">
            <apex:pageBlock title="Available Products" id="SearchResultsPB" rendered="{!showResultsPanel}">
                <apex:pagemessages id="msg"/>
                <apex:pageblockTable id="PBT" value="{!lstAvailableProductsWrap}" var="a">
                    <apex:column id="HeaderCol" style="width:22px;">
                        <apex:facet name="header">
                            <apex:inputCheckbox id="HeaderCheck" onclick="selectAllCheckboxes(this,'SelCheck')"/>
                        </apex:facet>
                        <apex:inputcheckbox value="{!a.isSelected}" onclick="CheckEach(this);" id="SelCheck"/>
                    </apex:column>
                    <apex:column headerValue="{!$ObjectType.Product2.Fields.Name.Label}" value="{!a.PBE.Product2.Name}"/>
                    <apex:column headerValue="{!$ObjectType.PricebookEntry.Fields.UnitPrice.Label}" value="{!a.PBE.UnitPrice}"/>
                    <apex:column headerValue="{!$ObjectType.Product2.Fields.Description.Label}" value="{!a.PBE.Product2.Description}"/>
                    <apex:column headerValue="{!$ObjectType.Product2.Fields.Family.Label}" value="{!a.PBE.Product2.Family}"/>
                </apex:pageblockTable>
                <apex:pageBlockButtons location="bottom">
                    <apex:commandButton action="{!ChooseProducts}" style="float:right;" status="pleasewait" value="Select & Proceed" rerender="SrchResultsPanel,OLIPanel,SHeader"/>
                    <apex:commandButton action="{!CancelSelection}" style="float:right;" status="pleasewait" value="Cancel" immediate="true"/>
                </apex:pageBlockButtons>
            </apex:pageBlock>
        </apex:outputpanel>
        <apex:outputpanel layout="block" id="OLIPanel">
            <apex:pageBlock title="Product Configurator" tabStyle="OpportunityLineItem" id="SelectedProducts" rendered="{!!showResultsPanel}">
                
                
                <!--                <div style="text-align:center;">
<apex:commandButton styleclass="{!IF(ShowCampInfo,'btnDisabled','btn')}" status="pleasewait" value="Campaign Information" action="{!ShowCampaignInfo}" rerender="OLIPanel"/>
<apex:commandButton styleclass="{!IF(ShowCampInfo,'btn','btnDisabled')}" status="pleasewait" value="Pricing Detail" action="{!ShowPricingInfo}" rerender="OLIPanel"/>
</div>
-->        <div style="margin-top:10px;">
                <apex:pagemessages id="ErrMsg"/>
                <apex:pageblockTable value="{!lstSelectedOLIsWrap}" var="s" columns="12" rowClasses="olivalue"><!-- rendered="{!ShowCampInfo}" -->
                    <!--                            <apex:column >
<apex:selectRadio value="{!s.isSelected}" style="font-weight:bold;"/>
</apex:column>
-->                     <apex:column headerValue="{!$ObjectType.Product2.Fields.Name.Label}" style="width: 15% !important;word-break: break-all !important; word-wrap: true;">
                    <apex:outputtext value="{!s.SNo}) {!s.ProductName}" style="font-weight:bold;"/> <br/>
                    <span id="line-desc{!s.RowIndex}">{!s.OLI.Description__c}</span>
                    </apex:column>
                    <apex:column style="min-width:75px;">
                        <apex:commandbutton value="C" action="{!AddNewOLI}" style="width:23px;" status="pleasewait" rerender="OLIPanel" oncomplete="calculateValuesAfterClick()">
                            <apex:param name="AddRowIndex" value="{!s.RowIndex}" assignTo="{!OLIRowIndex}"/>
                        </apex:commandbutton>
                        <a data-reveal-id="ModalInput" data-animation="fade" onclick="OpenUserInput('{!s.RowIndex}');" style="cursor:pointer;text-decoration:none;" >
                            <apex:outputlabel id="btnCx" value="Cx" styleClass="btn" style="cursor:pointer;padding:4px 4px 4px 4px;" />
                        </a>
                        <apex:commandbutton value="Del" action="{!RemoveOLI}" status="pleasewait" rerender="OLIPanel,SelectedProducts" oncomplete="calculateValuesAfterClick()">
                            <apex:param name="DelRowIndex" value="{!s.RowIndex}" assignTo="{!OLIRowIndex}"/>
                        </apex:commandbutton>
                        
                        <apex:commandbutton value="Copy" action="{!setRowValuesByIndex}" status="pleasewait" rerender="OLIPanel" oncomplete="calculateValuesAfterClick()">
                            <apex:param name="XRowIndexNum" value="{!s.RowIndex}" assignTo="{!rowIndex}"/>
                        </apex:commandbutton>
                    </apex:column>
                    <apex:column headervalue="Line Description">
                        <apex:outputpanel layout="block" styleclass="requiredInput">
                            <apex:outputpanel layout="block" styleclass="requiredBlock"/>                
                            <apex:inputField value="{!s.OLI.Description__c}"  html-oninput="changeText(this.value,{!s.RowIndex})"/>
                        </apex:outputpanel>
                        <i class="fa fa-clipboard" aria-hidden="true" onClick="copyDescription({!s.RowIndex},false)" style="color:red"></i>
                        <i class="fa fa-clipboard" aria-hidden="true" onClick="copyDescription({!s.RowIndex},true)" style="color:green"></i>
                    </apex:column>
                    <apex:column headervalue="From (Date)" style="width:120px;">
                        
                        
                        <apex:outputpanel layout="block" styleclass="requiredInput">
                            <apex:outputpanel layout="block" styleclass="requiredBlock"/>
                            <apex:inputField value="{!s.OLI.Start_Date__c}" id="startDate" styleClass="startDtClass" onchange="totalValue('{!$Component.totalval}','{!$Component.terms}','{!$Component.productquantity}','{!$Component.salesPrice}','{!$Component.billingCategory}','{!$Component.startDate}','{!$Component.endDate}',false,{!s.ShowTerms})" style="width:70%;"/>
                            <i class="fa fa-clipboard" aria-hidden="true" onClick="copyStartDate({!s.RowIndex},false)" style="color:red"></i>
                            <i class="fa fa-clipboard" aria-hidden="true" onClick="copyStartDate({!s.RowIndex},true)" style="color:green"></i>
                                
                        </apex:outputpanel>
                    </apex:column>
                    <apex:column headervalue="Terms" style="width:70px;" >
                        <apex:outputpanel layout="block" styleclass="requiredInput">
                            <apex:outputpanel layout="block" styleclass="requiredBlock"/>
                            <p id="termsmessage"></p>
                            <apex:inputField value="{!s.OLI.Term__c}" id="terms" onchange="updateEndDate('{!$Component.startDate}','{!$Component.endDate}','{!$Component.terms}',{!s.ShowTerms} ) "  rendered="{!s.ShowTerms}"  style="width:70%;" />
                            
                        </apex:outputpanel>
                    </apex:column>
                    <apex:column headervalue="Until (Date)" style="width:120px;">
                        <apex:outputpanel layout="block" styleclass="requiredInput">
                            <apex:outputpanel layout="block" styleclass="requiredBlock"/>
                            <apex:inputField value="{!s.OLI.End_Date__c}" id="endDate" styleClass="endDtClass" onfocus="totalValue('{!$Component.totalval}','{!$Component.terms}','{!$Component.productquantity}','{!$Component.salesPrice}','{!$Component.billingCategory}','{!$Component.startDate}','{!$Component.endDate}',false,{!s.ShowTerms})" onchange="totalValue('{!$Component.totalval}','{!$Component.productquantity}','{!$Component.salesPrice}','{!$Component.billingCategory}','{!$Component.startDate}','{!$Component.endDate}',false,{!s.ShowTerms})" style="width:70%;" />
                            <i class="fa fa-clipboard" aria-hidden="true" onClick="copyEndDate({!s.RowIndex},false)" style="color:red"></i>
                            <i class="fa fa-clipboard" aria-hidden="true" onClick="copyEndDate({!s.RowIndex},true)" style="color:green"></i>
                        </apex:outputpanel>
                    </apex:column>
                    <!-- <apex:column headerValue="Months (Developer Products Only)" >
<apex:inputField value="{!s.OLI.Term__c}"/>
</apex:column>--> 
                    <!--                                <i class="fa fa-clipboard" aria-hidden="true" onClick="copyRFDiscount({!s.RowIndex},false)" style="color:red"></i>
<i class="fa fa-clipboard" aria-hidden="true" onClick="copyRFDiscount({!s.RowIndex},true)" style="color:green"></i>
</apex:column> --> 
                    
                    <!-- <apex:column rendered="{!s.showCampaignInfo}" headervalue="{!if(ShowCampInfo,'length (months)','Discount')}">
<apex:inputField value="{!s.OLI.added_value__c}"/>
</apex:column>
<apex:column rendered="{!s.showCampaignInfo}" headervalue="Extra Days">
<apex:inputField value="{!s.OLI.added_value__c}"/>
</apex:column>  -->
                    <apex:column headerValue="Billing Category" >
                        <apex:outputpanel layout="block" styleclass="requiredInput">
                           
                            <apex:outputpanel layout="block" styleclass="requiredBlock"/>
                            <apex:inputField value="{!s.OLI.Billing_Category__c}"  styleClass="billCatClass" id="billingCategory" onfocus="totalValue('{!$Component.totalval}','{!$Component.terms}','{!$Component.productquantity}','{!$Component.salesPrice}','{!$Component.billingCategory}','{!$Component.startDate}','{!$Component.endDate}',false,{!s.ShowTerms})" onchange="totalValue('{!$Component.totalval}','{!$Component.productquantity}','{!$Component.salesPrice}','{!$Component.billingCategory}','{!$Component.startDate}','{!$Component.endDate}',false,{!s.ShowTerms} )"/>
                            <!--                                    <i class="fa fa-clipboard" aria-hidden="true" onClick="copyBilling({!s.RowIndex},false)" style="color:red"></i>
                            <i class="fa fa-clipboard" aria-hidden="true" onClick="copyBilling({!s.RowIndex},true)" style="color:green"></i>
-->                         </apex:outputpanel>
                    </apex:column>
                    
                    <!--                        </apex:pageblockTable>
</apex:pageBlock>                   
<apex:pageBlock title = "Pricing Detail">
<apex:pageblockTable value="{!lstSelectedOLIsWrap}" var="s" ><!-- rendered="{!!ShowCampInfo}" 

<apex:column headerValue="{!$ObjectType.Product2.Fields.Name.Label}">
<apex:outputtext value="{!s.SNo}) {!s.ProductName}" style="font-weight:bold;"/><br/>
<span id="line-desc{!s.RowIndex}">{!s.OLI.Description__c}</span>
</apex:column>
<!--                            <apex:column style="min-width:75px;">
<apex:commandbutton value="C" action="{!AddNewOLI}" style="width:23px;" status="pleasewait" rerender="OLIPanel">
<apex:param name="AddRowIndex" value="{!s.RowIndex}" assignTo="{!OLIRowIndex}"/>
</apex:commandbutton>
<a data-reveal-id="ModalInput" data-animation="fade" onclick="OpenUserInput('{!s.RowIndex}');" style="cursor:pointer;text-decoration:none;">
<apex:outputlabel id="btnCx" value="Cx" styleClass="btn" style="cursor:pointer;padding:4px 4px 4px 4px;"/>
</a>
<apex:commandbutton value="Del" action="{!RemoveOLI}" status="pleasewait" rerender="OLIPanel">
<apex:param name="DelRowIndex" value="{!s.RowIndex}" assignTo="{!OLIRowIndex}"/>
</apex:commandbutton>

<apex:commandbutton value="Copy" action="{!setRowValuesByIndex}" status="pleasewait" rerender="OLIPanel">
<apex:param name="XRowIndexNum" value="{!s.RowIndex}" assignTo="{!rowIndex}"/>
</apex:commandbutton>

</apex:column>

 
The FinnsterThe Finnster
VF page continuation
-->                         
                    
                    <apex:column headerValue="Quantity">
                        <apex:outputpanel layout="block" styleclass="requiredInput">
                            <apex:outputpanel layout="block" styleclass="requiredBlock"/>
                            <apex:inputField value="{!s.OLI.Quantity}" id="productquantity" styleClass="prodQuantClass" required="false" onfocus="totalValue('{!$Component.totalval}','{!$Component.terms}','{!$Component.productquantity}','{!$Component.salesPrice}','{!$Component.billingCategory}','{!$Component.startDate}','{!$Component.endDate}',true,{!s.ShowTerms} )" onchange="totalValue('{!$Component.totalval}','{!$Component.productquantity}','{!$Component.salesPrice}','{!$Component.billingCategory}','{!$Component.startDate}','{!$Component.endDate}',true,{!s.ShowTerms} )" style="width: 75px;"/>
                            <!--                                    <i class="fa fa-clipboard" aria-hidden="true" onClick="copyQuantity({!s.RowIndex},false)" style="color:red"></i>
<i class="fa fa-clipboard" aria-hidden="true" onClick="copyQuantity({!s.RowIndex},true)" style="color:green"></i>
-->                             </apex:outputpanel>
                    </apex:column>
                    <apex:column headerValue="List Price" >
                        <apex:outputtext value="USD {!s.ROListPrice}"/>
                        <!--<apex:outputField rendered="{!!s.showCampaignInfo}" value="{!s.OLI.ListPrice}"/>-->
                        
                    </apex:column>
                    <apex:column headerValue="Sales Price" >
                        <apex:outputpanel layout="block" styleclass="requiredInput">
                            <apex:outputpanel layout="block" styleclass="requiredBlock"/>
                            <apex:inputField value="{!s.OLI.UnitPrice}" id="salesPrice" styleClass="salesPrClass" required="false" onfocus="totalValue('{!$Component.totalval}','{!$Component.terms}','{!$Component.productquantity}','{!$Component.salesPrice}','{!$Component.billingCategory}','{!$Component.startDate}','{!$Component.endDate}',true,{!s.ShowTerms})" onchange="totalValue('{!$Component.totalval}','{!$Component.terms}','{!$Component.productquantity}','{!$Component.salesPrice}','{!$Component.billingCategory}','{!$Component.startDate}','{!$Component.endDate}',true,{!s.ShowTerms})" style="width: 75px;"/>
                            <!--                                    <i class="fa fa-clipboard" aria-hidden="true" onClick="copyPrice({!s.RowIndex},false)" style="color:red"></i>
<i class="fa fa-clipboard" aria-hidden="true" onClick="copyPrice({!s.RowIndex},true)" style="color:green"></i>
-->                             </apex:outputpanel>
                    </apex:column>
                    <!--<apex:column rendered="{!!s.showCampaignInfo}" headerValue="Discount" >
<apex:inputField value="{!s.OLI.Discount}" rendered="{!!s.showCampaignInfo}"/>
<i class="fa fa-clipboard" aria-hidden="true" onClick="copyDiscount({!s.RowIndex},false)" style="color:red"></i>
<i class="fa fa-clipboard" aria-hidden="true" onClick="copyDiscount({!s.RowIndex},true)" style="color:green"></i>
</apex:column>-->
                    <apex:column headerValue="Total Value" styleClass="olitotalval"> <!-- rendered="{!showtotalvalue}"> -->
                        <apex:inputField value="{!s.OLI.Total_Value__c}" id="totalval" style="display: {!If(showtotalvalue,'block','none')}!important; width: 75px;"/>
                        <!--<i class="fa fa-clipboard" aria-hidden="true" onClick="copyDiscount({!s.RowIndex},false)" style="color:red"></i> 
<i class="fa fa-clipboard" aria-hidden="true" onClick="copyDiscount({!s.RowIndex},true)" style="color:green"></i>-->
                        
                    </apex:column>
                    <apex:column headerValue="Reason for Discount" >
                        <apex:inputField value="{!s.OLI.Reson_for_Discount__c}" />
                        <!--                                <i class="fa fa-clipboard" aria-hidden="true" onClick="copyRFDiscount({!s.RowIndex},false)" style="color:red"></i>
<i class="fa fa-clipboard" aria-hidden="true" onClick="copyRFDiscount({!s.RowIndex},true)" style="color:green"></i>
-->                     </apex:column>  
                    
                    
                </apex:pageblockTable>
                </div>
                <div style="margin-left:77.5%; font-weight:bold; font-size:12.4px">Total Amount &nbsp; <apex:outputText id="totalValueAllProducts"></apex:outputText></div>
                <apex:pageBlockButtons location="both">
                    <apex:commandButton action="{!SaveProducts}" style="float:right;" status="pleasewait" value="Save"/>
                    <apex:commandButton action="{!CancelSelection}" style="float:right;" status="pleasewait" value="Cancel" immediate="true"/>
                </apex:pageBlockButtons>
            </apex:pageBlock>
            <div id="ModalInput" class="reveal-modal" style="display:block; height:110px;width:300px;">
                <a class="close-reveal-modal" id="closelink" onclick="ClearTextInputs();">&#215;</a>
                <div id="ModalDiv">
                    <apex:pageblock id="ModalPB">
                        <apex:pageblockbuttons location="bottom">
                            <apex:commandbutton value="Confirm" onclick="ExecuteAddXLines();" oncomplete="          calculateValuesAfterClick();"/>
                            <apex:commandbutton value="Cancel" onclick="CancelAddXLines();return false;"/>
                        </apex:pageblockbuttons>
                        <apex:pageblocksection columns="1" id="ModalPBS">
                            <apex:pageblocksectionitem id="ModalPBSI">
                                <apex:outputlabel value="No of Lines #"/>
                                <apex:outputpanel layout="block" styleclass="requiredInput">
                                    <apex:outputpanel layout="block" styleclass="requiredBlock"/>
                                    <apex:inputtext value="{!xLines}" id="LinesCount" onkeypress="return isNumber(event)"/>
                                    <div id="reqDiv" class="errorMsg" style="display:none;"><strong>Error:</strong><label id="ErrorMsg">You must enter a value</label></div>
                                </apex:outputpanel>
                            </apex:pageblocksectionitem>
                        </apex:pageblocksection>
                    </apex:pageblock>
                </div>
            </div>
        </apex:outputpanel>
    </apex:form>
    <script>


 
The FinnsterThe Finnster
vf page part 3
function calculateValuesAfterClick() {
        //(olival)
        var billCatClass = document.getElementsByClassName("billCatClass");
        /*          var salepriClass = document.getElementsByClassName("salesPrClass");
            var quantitClass = document.getElementsByClassName("prodQuantClass");
            var startDtClass = document.getElementsByClassName("startDtClass");
            var endDtClass   = document.getElementsByClassName("endDtClass");
            var termClass   = document.getElementsByClassName("termClass");
*/
        //          alert('length '+billCatClass.length);
        for(i=0; i<billCatClass.length;i++) {
            for(j=i;j<billCatClass.length;j++) {
                billCatClass[j].onchange();
            }
        }
    }
    function totalValue(totalVal,term, quantity, salesPrice,billingCategory, startDate, endDate, isRender,showterm) {
        var billCat = document.getElementById(billingCategory).value;
        var saleprice = document.getElementById(salesPrice).value;
        var quant =  document.getElementById(quantity).value;
        var trm;
        if(term && document.getElementById(term)){
            trm=  document.getElementById(term).value;
             updateEndDate(startDate, endDate,term,showterm);
        }
        else{
            trm =1;
        }
        
        console.log('terms--',trm);
        quant = quant.replace(',','');
        saleprice = saleprice.replace(',','');
        if(billCat=='CPD') {
            var startDt = document.getElementById(startDate).value;
            var endDt = document.getElementById(endDate).value;
            var startDat = new Date(startDt);
            var endDat = new Date(endDt);
            var timeDiff = Math.abs(endDat.getTime() - startDat.getTime());
            var diffDays = (Math.ceil(timeDiff / (1000 * 3600 * 24)))+1; 
            if(diffDays>0) {
                document.getElementById(quantity).value = diffDays;
                document.getElementById(quantity).disabled = true;
                isRender = true;
                quant =  diffDays;
            }
        }
        else {
            document.getElementById(quantity).disabled = false;
        }
        if(billCat=='CPM') {
            if(quant!=null && quant!='' && quant>0) {
                quant = quant/1000;
            }
        }
        if(isRender && (saleprice==null || saleprice=='' || quant==null || quant==''))
            document.getElementById(totalVal).innerHTML = 'USD ';
        else{
            var totalValue ;
            console.log('show term--',showterm);
            if(showterm==true){
                 var month = 'Monthly';
                 document.getElementById(billingCategory).value = month;
                  totalValue = saleprice*quant*trm;
                  totalValueAED = saleprice*quant*trm*3.675;
                console.log('in tems log',totalValue);
            }
            else {
                totalValue = saleprice*quant;
            }
The FinnsterThe Finnster
            console.log('totalValue= log==',totalValue);
            var parts = totalValue.toString().split('.');
            var totalValueFinal;
            if(parts[1] != null && parts[1].length > 0 && parts[1].length < 5)
                totalValueFinal = 'USD '+ totalValue.toFixed(parts[1].length);
            else if(parts[1] != null && parts[1].length > 4)
                totalValueFinal = 'USD '+ totalValue.toFixed(4);
                else 
                    totalValueFinal = 'USD '+ totalValue;
            if(isRender)
                document.getElementById(totalVal).innerHTML = totalValueFinal;
        }
        if(isRender && (totalValueFinal==null || isNaN(totalValue))) {
            document.getElementById(totalVal).innerHTML = 'USD ';
        }
        totalValueOfAllProducts();
        testQuantityCPD();
      
    }
The FinnsterThe Finnster
function testQuantityCPD () {
        var totalclass = document.getElementsByClassName("prodQuantClass");
        
        for(i=0; i<totalclass.length;i++) {
            var val = totalclass[i].innerHTML;
            console.log('myval'+val);
        }
    }
    function totalValueOfAllProducts() {
        var totalclass = document.getElementsByClassName("olitotalval");
        //          var totalclass = document.getElementsByClassName("myTest");
        var tot = 0;
        for(i=0; i<totalclass.length;i++) {
            var val = totalclass[i].childNodes[0].innerHTML;
            val = val.replace(',','');
            var fieldVal = parseFloat(val.split("USD ")[1]);
            if(fieldVal==null || isNaN(fieldVal))
                fieldVal = 0;
            tot = tot + fieldVal;
        }
        tot = parseFloat(tot);
        /*          console.log('document.getElementById("SrchPg:SrchFrm:SelectedProducts:totalValueAllProducts") ' + document.getElementById("SrchPg:SrchFrm:SelectedProducts:totalValueAllProducts"));*/
        //if(tot==null || isNaN(tot))
        //  document.getElementById("SrchPg:SrchFrm:SelectedProducts:totalValueAllProducts").innerHTML = '';
        //else
        if (document.getElementById("SrchPg:SrchFrm:SelectedProducts:totalValueAllProducts") != null && !isNaN(tot))
            document.getElementById("SrchPg:SrchFrm:SelectedProducts:totalValueAllProducts").innerHTML = 'USD '+tot;
    }