Hi All,

I have a small problem in my page. I am not finding the method to figure it out.

Problem:

I have a search field to display the products with its price

2. i can select the product using checkbox and give the number of quantity . the javascript will calculate the totalamount. (working)

3.  I have a button to add product to cart

4. in the cart i can see product name, quantity, unitprice but not totalprice.

If i change the outputtext to inputtext for totalprice then it is getting displayed in cart items but if i give as inputtext for totalcount then automatically the quantity * unitprice value is not updated.

I found it a bit wierd kind of situation.

My code:

Controller:

public class productassign

{

public productassign(apexpages.standardcontroller controller)

{

}

//used to get a hold of the account record selected for deletion

public string SelectedAccountId { get; set; }

public string searchkey{get;set;}

public list<product__c> prolist;

public list<productlist> prod{get;set;} {prod = new list<productlist>();}

public integer rownum;

public void delRow()

{

rowNum = Integer.valueOf(apexpages.currentpage().getparameters().get('index'));

cartlist.remove(rowNum);

}

public pageReference searchprod()

{

prolist = [select id,name,price__c from product__c where name like : '%'+searchkey+'%'];

prolist.sort();

for (product__c pr : prolist)

{

productlist p = new productlist();

p.prot = pr;

p.proname = pr.name;

p.proid = pr.id;

p.proprice = integer.valueof(pr.price__c);

prod.add(p);

}

return null;

}

  public boolean displayPopup {get; set;}    

    public pagereference closePopup() {       

        displayPopup = false;  

        return null;

    }    

    public pagereference showPopup() {   

        displayPopup = true; 

        system.debug('show ppup  ' + displayPopup );

        return null; 

    }

public class productlist

{

public product__c prot{get;set;}

public string proname;

public id proid;

public integer proprice;

public integer quantity{get;set;}

public boolean isselect {get;set;}

public integer total{get;set;}

}

public integer maxnum;

public pagereference addtocart()

{

list<aggregateResult> res = [select max(orderid__c) from cart__c];

for (aggregateresult r : res)

{

maxnum = integer.valueof(r.get('expr0'));

maxnum = maxnum + 1;

}

for (productlist crt : prod)

{

if (crt.isselect)

{

cart__c c = new cart__c();

c.name = crt.proname;

c.orderid__c = maxnum;

c.product__c = crt.proname;

c.Quantity__c = crt.quantity;

//system.debug(crt.proname);

insert(c);

}

}

pagereference prref = new pagereference('/apex/oderlist?orderkey='+maxnum);

prref.setredirect(false);

return prref;

}

public list<cartwrapper> cartlist{get;set;} { cartlist = new list<cartwrapper>();}

public class cartwrapper

{

public productlist proobj{get;set;}

}

/* public pagereference addtocart3()

{

for (productlist crt : prod)

{

if (crt.isselect)

{

cartwrapper c = new cartwrapper();

c.proobj = crt;

cartlist.add(c);

}

}

pagereference prref = new pagereference('/apex/cartpage');

prref.setredirect(false);

return prref;

}*/

public pagereference addtocart2()

{

for (productlist crt1 : prod)

{

if (crt1.isselect)

{

cartwrapper c1 = new cartwrapper();

c1.proobj = crt1;

cartlist.add(c1);

}

}

return null;

}

public boolean getRendered()

{

Boolean render = (cartlist == null || cartlist.size() == 0 ? false : true);

return render;

}

}

VF page:

<apex:page standardController="Product__c" extensions="productassign" >

<apex:stylesheet value="{!$Resource.histyle}"/>

<style>

.changecss

{

background-color:grey;

}

</style>

<script>

  function computeTotal(quantityId, unitPriceId, totalId){

    var quantity = document.getElementById(quantityId).value;   

    var cost = document.getElementById(unitPriceId).innerHTML; 

    var totalPrice = quantity * cost ;

          alert('quantity is ' + quantity + 'price is ' + cost );

    document.getElementById(totalId).innerHTML = totalPrice;

  }

</script>

  <apex:form id="kh">

  <h1>Product search and cart page</h1>

  <apex:commandbutton value="press" action="{!showpopup}" rerender="kh" />

  <apex:outputpanel rendered="{!displayPopup}"> 

  This is popup display

</apex:outputPanel>

</apex:form>

<apex:form id="myform" >

 <div id="loadingDiv">

<!-- The screen element that will cover the form. Javascript will change the height of this to drop it down. -->

   <apex:pageblock id="hardCosts" title="Line Items - Hard Cost Estimate"> <!-- The form element to screen. -->

      <script>

      function showLoadingDiv() {

 var blockToLoad = document.getElementById('{!$Component.hardCosts}');

 var loadWidth = window.getComputedStyle(blockToLoad,"").getPropertyValue("width");

 var loadHeight = window.getComputedStyle(blockToLoad,"").getPropertyValue("height");

 //Set the loadingDiv to screen the element at the correct size.

 var loadingDiv = document.getElementById('loadingDiv');

 loadingDiv.setAttribute('style','background-color:black; opacity:0.35; height:' + parseFloat(loadHeight) + 'px; width:' + loadWidth + ';');

      }

      function hideLoadingDiv() {

 var loadingDiv = document.getElementById('loadingDiv');

 var blockToLoad = document.getElementById('{!$Component.hardCosts}');

 var loadWidth = window.getComputedStyle(blockToLoad,"").getPropertyValue("width");

 loadingDiv.setAttribute('style','height:0px; width: ' + loadWidth + '; background-color:black; opacity:1;');

      }

      </script>

 Enter Search Value :

<apex:inputText value="{!searchkey}"/> 

<apex:commandButton value="Search" action="{!searchprod}" status="status" rerender="myform" />

<apex:actionStatus id="status" onstart="showLoadingDiv()" onstop="hideLoadingDiv()" >

  <apex:facet name="start" > 

<br/> 

 loading..<br/>        

<img src="{!$Resource.loading}" border="0" height="50" width="50"/>

<!--  <apex:image url="{!$Resource.loading}" title="loading..." height="50" width="50" />  -->

</apex:facet>

<apex:facet name="stop" >

</apex:facet> 

</apex:actionstatus> 

 <apex:pageblockTable value="{!prod}" var="a" style="width:800px" rowclasses="changecss">

  <apex:column headervalue="Name" style="width:200px"> {!a.prot.name}</apex:column> 

<apex:column headervalue="Price" id="Price" style="width:200px"> {!a.prot.price__c}</apex:column>  

<!-- <apex:column headerValue="Quantity" style="width:200px"> <apex:inputtext value="{!a.quantity}"/></apex:column>  -->

 <apex:column headerValue="Quantity">

 <apex:inputtext id="quantity" style="width:200px" value="{!a.quantity}" onblur="computeTotal('{!$Component.quantity}','{!$Component.Price}','{!$Component.total}');"/>

        </apex:column>

<apex:column ><apex:inputcheckbox value="{!a.isselect}" style="width:20px"/> </apex:column>

<apex:column headerValue="total" style="width:200px">

         <apex:outputtext id="total" style="width:200px" value="{!a.total}"/>

        </apex:column>

  </apex:pageblockTable>

<apex:commandButton value="Add to cart2" action="{!addtocart2}" reRender="cartshow"/>  </apex:pageBlock>

<h1>cart list </h1>

<apex:outputpanel id="cartshow">  

   <apex:pageBlock id="cartsho" mode="readonly" rendered="{!rendered}" >

<apex:pageBlockSection columns="2">    <apex:pageblockSectionItem dataStyle="width:50%"></apex:pageblockSectionItem> 

<apex:pageblockSectionItem dataStyle="width:50%">

     <apex:pageBlockTable value="{!cartlist}" var="c" >

<apex:column headerValue="Delete" headerClass="ct">

 <apex:variable var="rowNum" value="{!0}"/>

<apex:commandLink style="font-size:15px; font-weight:bold; text-align:center;color:red;" value="X" action="{!delrow}" reRender="cartshow" >

<apex:param value="{!rowNum}" name="index" />

</apex:commandLink>

<apex:variable var="rowNum" value="{!rowNum+1}"/>

</apex:column>

         <apex:column value="{!c.proobj.prot.name}" headerValue="Product Name"/>

           <apex:column headervalue="Price" style="width:200px"> {!c.proobj.prot.price__c}</apex:column>

          <apex:column headerValue="Quantity"  >

                {!c.proobj.quantity }

            </apex:column>

             <apex:column headerValue="Total"  >

                <apex:outputtext value="{!c.proobj.total}"/>

            </apex:column>                        

            </apex:pageBlockTable>

<apex:commandButton value="Order" action="{!addtocart}"/>           

</apex:pageblockSectionItem>            

</apex:pageBlockSection>           

        </apex:pageBlock>

   </apex:outputpanel>

</div>

</apex:form>

 </apex:page>

 Any suggestions to overcome this problem?