Apex Code Development You need to sign in to do that
Don't have an account?
Harini How can I update a outputText field from a JavaScript Function
Hi
I have a pageblock table which displays a list of product records. The list of products shows product name,family,description ,quantity,discount,standard price and salesprice.
When the user enters discount value in the input text onchange triggers a call to javascript where salesprice is calculated : standardprice- (standardprice*discount)/100;
Iam able to read the values in the javascript and calculate salesprice. I am unable to set the salesprice to the outputText column in the table .
Here is my vf page partial markup:
<apex:actionFunction name="salesPriceUpdate"
action="{!fieldUpdate}" rerender="prodSalesPrice,prodSalesPriceCol" />
<apex:column headervalue="Discount %" >
<apex:inputtext value="{!products1.discount}" id="discPcrnt" onchange="CalculateSP('{!$Component.discPcrnt}','{!$Component.stdPrice}'),'{!$Component.prodSalesPrice}';" />
</apex:column>
<apex:column headervalue="Sales Price" id="prodSalesPriceCol" >
<apex:outputtext id="prodSalesPrice" value="{!salesPriceCalc}"/>
</apex:column>
Here is the javascript function:
<script language="javascript">
function CalculateSP(disc,stndPrice,salesPrice){
var discPcrnt=document.getElementById(disc).value;
var stdPrice= document.getElementById(stndPrice).innerHTML;
var discPrice= stdPrice*discPcrnt/100 ;
var sellingPrice= stdPrice - discPrice ;
document.getElementById(salesPrice).innerHTML = sellingPrice;
document.getElementById(prodSalesPrice).innerHTML = sellingPrice;
salesPriceUpdate(sellingPrice);
}
Any help is greatly appreciated.
I wonder if it has some issues with identifying prodSalesPrice since it's on a repeating element. Can you try re-rendering the whole container for that table - either a page block or an output panel. See if it works. Then you can try to figure out a way to bring it down to the field level.
Ram
Hi
I am able to move a step further, I am able to capture discount entered and standard price and calculate the selling price and re-render the column selling price. But the problem here is if I enter a discount in one row the selling price is calculated and all the cells in the column selling price are populated with that value. Let's say there are three rows and in the first row column discount I have entered all the three rows under the column selling price are populated with the same value instead of a single cell.
Snippets of my page and javascript:
<apex:column headervalue="Discount %" >
<apex:inputtext value="{!products1.discount}" id="discPcrnt" onchange="CalculateSP('{!$Component.discPcrnt}','{!$Component.stdPrice}'),'{!$Component.prodSalesPrice}';" />
</apex:column>
<apex:column headervalue="Sales Price" id="prodSalesPriceCol" >
<apex:outputtext id="prodSalesPrice" value="{!salesPriceCalc}"/>
</apex:column>
<apex:actionFunction name="salesPriceUpdate" action="{!fieldUpdate}" rerender="prodSalesPrice" >
<apex:param name="sellPrice" assignTo="{!salesPriceCalc}" value="" />
</apex:actionFunction>
function CalculateSP(disc,stndPrice,salesPrice){
alert("In Calculate Sp");
// var discPcrnt= document.getElementById('{!$Component.theForm.ProductDetail.ProductDetails.table.discPcrnt}').value;
var discPcrnt=document.getElementById(disc).value;
var stdPrice= document.getElementById(stndPrice).innerHTML;
var discPrice= stdPrice*discPcrnt/100 ;
var sellingPrice= stdPrice - discPrice ;
salesPriceUpdate(sellingPrice); //call actionFunction
}
Any help is appreciated.
Hi Harini,
Do you have a repeating data set that is driving this table? Otherwise, it looks like all rows would use the same value for salesPriceCalc.
Ram
That's correct. It is the problem I am facing currently, that column in all rows is being populated with the same value. I am looking to update a particular cell i.e., the output text field in that row.
Iam trying to set the output field from Javascript , but I am unable to do so.
document.getElementById(salesPrice).innerHTML = sellingprice ; --- But it is not working :(
Please help me solve this.
Harini,
I will suggest another way to do this. I haven't looked at your controller code - if you don't have a wrapper class for your products, just build a simple wrapper class and create a collection of those for display and input etc. One of the fields in this wrapper would be the salesprice. When the price needs to be updated, you can run through your entire collection and update the salesprice for each item.
// method in controller to calculate discounts
public void calcDiscounts() {
for (ProductWrapper pw : ProductWrapperList) {
pw.calculatePrice();
}
}
// wrapper class
public class ProductWrapper {
public String name { get; set; }
public Integer price { get; set; }
public Integer discount { get; set; }
public Integer salesPrice { get; set; }
public ProductWrapper(String name, Integer price, Integer discount, Integer salesPrice) {
this.name = name;
// init other variables
}
public calculatePrice() {
salesPrice = price - discount;
}
}
You will have to create a list of ProductWrapper items from the database and use ProductWrapperList as your list for your table in the VF page.
You can call the calcDiscounts action method on some user action that makes sense. Let me know if that makes sense.
Best,
Ram