Link to home
Start Free TrialLog in
Avatar of MartinCMS
MartinCMSFlag for United States of America

asked on

Memory overflow

Hello EE,

I have this Javascript, which work fine for along time up until now.  Memory overflow!  Basically, a SQL query run to get info for all active product within a selected Key.  Everything work great if there are less 200 product codes.  Now we have almost 500 product codes in that Key.  Javascript wouldn't that many product in the array I built.  Would someone take a look and if there is room for improvement or if there is a better for me to handle this situation.

1)  SQL query run to obtain product info
2)  JavaScript load those into an array
3)  User can pick the product from the array by using the drop down menu
---------------------

---SQL query using ColdFusion
<CFQUERY DATASOURCE="#client.datasource#" NAME="Keys">
SELECT Key_Code, Product_Code,
Product_Desc30, PStatus, PPrice, PHandling, KPrice, KHandling,
Product_Code+' - '+Product_Desc30 as New_Product
FROM KeyProduct_Select_View
WHERE (PStatus = 'Active') and (PBStatus <> 'POS') and (Key_Code='#cookie.Key_Code#')
and ((convert(char(10),Discontinue_Orders,102) >= convert(char(10),#now()#,102)) or (Discontinue_Orders is null))
and ((convert(char(10),Ship_Window_End,102) >= convert(char(10),#now()#,102)) or (Ship_Window_End is null))
Order by Product_Code
</CFQUERY>


<script language="javascript">
//-- Global Variables
<cfoutput>
var RowsInForm = '#cookie.Rows#';    //How many line items will be in the order form?
var ProductsInList = #Keys.RecordCount#     //How many products in your product list?
</cfoutput>
var SalesTaxRate = 0.05   //Set to sales tax rate in decimal. e.g. 0.0775 is 7.75%.
var TaxableState = "IA"     //Set to name of state you charge sales tax in.
var ProdSubscript = 0       //Identifies subscript of selected product in current row.

//-- Function to create a new empty array that starts at 1.
function MakeArray(n) {
   this.length = n
   for (var i=1;i<=n;i++) {this[i]=0}
   return this
}

//-- Function to create a new, empty array that starts at zero.
function BuildZeroArray(n) {
   this.length = n
   for (var i=0;i<=n;i++) {this[i]=0}
   return this
}

//-- Defines a custom object named prodobj (Product Object).
//-- An array of these objects will act as our product/price list.
function prodobj(name, product, unitprice, handling, desc) {
   this.name = name
   this.product = product
   this.unitprice = unitprice
   this.handling = handling
   this.desc = desc
}

//-- Defines a new custom object named ordobj (Order Object).
//-- Will house data displayed in order form line items.
function ordobj(prodsub, product, qty, unitprice, handling, extprice, desc) {
   this.prodsub = prodsub
   this.product = product
   this.qty = qty
   this.unitprice = unitprice
   this.extprice = extprice
   this.handling = handling
   this.desc = desc
}
//-- Updates current row in order array and form.
function selectchange(rownum){
   var exeLine='document.ordform.qty'+rownum+'.value=1'
   eval(exeLine)
   var exeLine='ProdSubscript=document.ordform.prodchosen'+rownum+'.selectedIndex'
   eval(exeLine)
   ordData[rownum].prodsub=ProdSubscript
   var exeLine='tempqty=document.ordform.qty'+rownum+'.value'
   eval(exeLine)
   ordData[rownum].qty=tempqty-0   //-- Gets unit price from the product price list.
   ordData[rownum].unitprice=prodlist[ProdSubscript].unitprice
   ordData[rownum].handling=(ordData[rownum].qty)*prodlist[ProdSubscript].handling  
   ordData[rownum].extprice=((ordData[rownum].qty)*ordData[rownum].unitprice)+ordData[rownum].handling
   ordData[rownum].desc=prodlist[ProdSubscript].desc  
   ordData[rownum].product=prodlist[ProdSubscript].product
   var exeLine='document.ordform.unitprice'+rownum+'.value=currency(ordData['+rownum+'].unitprice,7)'
   eval (exeLine)
   var exeLine='document.ordform.handling'+rownum+'.value=currency(ordData['+rownum+'].handling,7)'
   eval (exeLine)
   var exeLine='document.ordform.extprice'+rownum+'.value=currency(ordData['+rownum+'].extprice,10)'
   eval(exeLine)
   var exeLine='document.ordform.desc'+rownum+'.value=ordData['+rownum+'].desc'
   eval(exeLine)
   var exeLine='document.ordform.product'+rownum+'.value=ordData['+rownum+'].product'
   eval(exeLine)
   updateTotals()
   Check_Qty_Available(rownum)
 }


//-- Updates current row in order array and form.
function updateRow(rownum){
   var exeLine='ProdSubscript=document.ordform.prodchosen'+rownum+'.selectedIndex'
   eval(exeLine)
   ordData[rownum].prodsub=ProdSubscript
   var exeLine='tempqty=document.ordform.qty'+rownum+'.value'
   eval(exeLine)
   ordData[rownum].qty=tempqty-0   //-- Gets unit price from the product price list.
   ordData[rownum].unitprice=prodlist[ProdSubscript].unitprice
   ordData[rownum].handling=(ordData[rownum].qty)*prodlist[ProdSubscript].handling  
   ordData[rownum].extprice=((ordData[rownum].qty)*ordData[rownum].unitprice)+ordData[rownum].handling
   ordData[rownum].desc=prodlist[ProdSubscript].desc  
   ordData[rownum].product=prodlist[ProdSubscript].product
   var exeLine='document.ordform.unitprice'+rownum+'.value=currency(ordData['+rownum+'].unitprice,7)'
   eval (exeLine)
   var exeLine='document.ordform.handling'+rownum+'.value=currency(ordData['+rownum+'].handling,7)'
   eval (exeLine)
   var exeLine='document.ordform.extprice'+rownum+'.value=currency(ordData['+rownum+'].extprice,10)'
   eval(exeLine)
   var exeLine='document.ordform.desc'+rownum+'.value=ordData['+rownum+'].desc'
   eval(exeLine)
   var exeLine='document.ordform.product'+rownum+'.value=ordData['+rownum+'].product'
   eval(exeLine)
   updateTotals()
   Check_Qty_Available(rownum)
 }

//-- Updates the totals in the lower part of order details.
function updateTotals() {
   var subtotal = 0
   for (var i=1;i<=RowsInForm;i++) {
      subtotal=subtotal+ordData[i].extprice
   }
   document.ordform.subtotal.value = currency(subtotal,10)
   salestax=0
   if (document.ordform.Taxable.checked) {
      salestax = SalesTaxRate*subtotal
   }
   document.ordform.salestax.value = currency(salestax,10)
   document.ordform.grandtotal.value = currency(subtotal+salestax,10)
}

//-- Shows number in $$xxx,xxx.xx format and pads left side with blanks.
function currency(anynum,width) {
   anynum=eval(anynum)
   workNum=Math.abs((Math.round(anynum*100)/100));workStr=""+workNum
   if (workStr.indexOf(".")==-1){workStr+=".00"}
   dStr=workStr.substr(0,workStr.indexOf("."));dNum=dStr-0
   pStr=workStr.substr(workStr.indexOf("."))
   while (pStr.length<3){pStr+="0"}

   //--- Adds comma in thousands place.
  // if (dNum>=1000) {
  //   dLen=dStr.length
  //    dStr=parseInt(""+(dNum/1000))+","+dStr.substring(dLen-3,dLen)
  // }

   //-- Adds comma in millions place.
  // if (dNum>=1000000) {
  //    dLen=dStr.length
  //    dStr=parseInt(""+(dNum/1000000))+","+dStr.substring(dLen-7,dLen)
  // }
   retval=dStr+pStr
   if (anynum < 0) {
      retval=retval.substring(1,retval.length)
      retval="("+retval+")"        
   }
   retval = "$"+retval
   //--Pad with leading blanks to better align numbers.
   while (retval.length<width){retval=" "+retval}

   return retval
}
</script>
</head>

<body>

<script language="JavaScript">
//Create a new array named prodlist with six elements.
prodlist = new BuildZeroArray(ProductsInList)   //Create empty product list array.
//-- JavaScript programmers: The array below defines products and unit prices.
//-- The only comma allowed in each line is the one that separates the product
//-- name from its unit price.  Do not change first item (prodobj[0]).

prodlist[0] = new prodobj('-none-','',0,0,'')
<cfset cnt = 0>
<cfoutput query="Keys">
<cfset cnt = cnt + 1>
<cfif '#KPrice#' eq 0>
prodlist[#cnt#] = new prodobj('#Product_Code#','#Product_Code#',#PPrice#,#PHandling#,'#Product_Desc30#')
<cfelse>
prodlist[#cnt#] = new prodobj('#Product_Code#','#Product_Code#',#KPrice#,#KHandling#,'#Product_Desc30#')
</cfif>
</cfoutput>

//-- JavaScript programmers- The ProductsInList variable defined in the head of
//-- this page must match the highest-numbered item in this array. In this sample
//-- page you can see that the ProductsInList variable is initially set to 10, which
//-- matches the last subscript in the array above.

//-- Creates a new array named ordData, which will stores order form line items.
ordData = new MakeArray(RowsInForm)
for (var i=1; i<= RowsInForm; i++) {
   ordData[i] = new ordobj(0,0,0,0,0,0,0)
}
</script>
<TABLE align="left">
<form name="ordform" method="POST" action="OrderEntry_Products_Add.cfm">
  <table border="1" bgcolor="#CCCCCC">
    <tr>
      <th><b>Products</b></th>
        <th><b>Prod Code</b></th>
      <th><b>Product Desc.</b></th>
      <th align="center"><b>Qty</b></th>
      <th align="center"><b>Price</b></th>
      <th align="center"><b>Handling</b></th>
      <th align="center"><b>Ext Price</b></th>
      </tr>

    <!-- Tags for remaining table rows are generated by JavaScript code. -->
<script language="JavaScript">
for (var rownum=1;rownum<=RowsInForm;rownum++) {
   document.write('<tr><td>')
   document.write('<select name="prodchosen'+rownum+'" onChange="selectchange('+rownum+')">')
   for (i=0; i<=ProductsInList; i++) {
      document.write ('<option>'+prodlist[i].name)
   }
   document.write ('</select></td>')
   document.write ('<td align="Left">')
   document.write ('<input type="text" name="product'+rownum+'"')
   document.write ('size=10 onfocus = "this.blur()"></td>')  
   document.write ('<td align="Left">')
   document.write ('<input type="text" name="desc'+rownum+'"')
   document.write ('size=13 onfocus = "this.blur()"></td>')  
   document.write ('<td align="center"><input class="num" name="qty'+rownum+'" value=""')
   document.write ('size=3 onChange="updateRow('+rownum+')"></td>')
   document.write ('<td align="center">')
   document.write ('<input class="num" name="unitprice'+rownum+'" value="" ')
   document.write ('size=7 onfocus="this.blur()"></td>')
   document.write ('<td align="center">')
   document.write ('<input class="num" name="handling'+rownum+'" value="" ')
   document.write ('size=7 onfocus="this.blur()"></td>')
   document.write ('<td align="center">')
   document.write ('<input class="num" name="extprice'+rownum+'" value="" ')
   document.write ('size=10 onfocus = "this.blur()"></td>')
   document.write ('</tr>')
   document.write ('<input type="hidden" value="STOP" name="Status'+rownum+'">')
 }
       </script>
    <tr>
         <cfoutput><td colspan="5"><b><font size="+1">&nbsp;Key Code: #cookie.Key_Code#</font></b></TD></cfoutput>
      <td align="right"><B>Total:</B>&nbsp;</td>
      <td align="center"><input class="num" name="grandtotal" size="10" onfocus="this.blur()"></td>
    </tr>
</table>
  <input type="Hidden" name="AddRows" VALUE="No">
  <input type="Hidden" name="subtotal">
  <input type="Hidden" name="Taxable">
  <input type="Hidden" name="salestax" size="10">
  <!-- End of order form table -->
 <!---  <BR><br> --->
 
 <TABLE>
 <TR>
      <td><input type="Button" NAME="Operation" value="Submit" onclick="Check_Qty()"></td>
      <td><input type="Button" NAME="Operation" VALUE="Add Rows" onClick="Add_Rows()"></td>
      <td><input type="reset"></td>
</form>
      <form NAME="Product_Info" METHOD="POST" ACTION="OrderEntry_ProductInfo.cfm">
      <TD><select NAME="Product_Code"><CFOUTPUT QUERY="Keys2">
              <OPTION VALUE="#Product_Code#">#New_Product#</OPTION></CFOUTPUT>
              </select></TD>
      <td><input type="Submit" value="Product Info"></td>
      </form>
 </TR>
 </TABLE>
</table>
</cfif>
</body>














Avatar of mr_egyptian
mr_egyptian
Flag of United States of America image

Just a couple questions:

How large is the loaded (or partially loaded) page?
I don't know exactly what type of products you're dealing with, but can they be categorized/subcategorized in order to lighten the amount of data per page? This may be easier on the user as well. Extra clicks, but take out the need to wade through 500+ item dropdown.

I notice Iowa is taxable. I'm in eastern Iowa, along the river. You?
Avatar of MartinCMS

ASKER

we are right here in central des moines!

Our system is already categorized but subcategorized is not an option.
 
ASKER CERTIFIED SOLUTION
Avatar of mr_egyptian
mr_egyptian
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Hi @mr_egyptian -

I found a way to make it works!  Anyways, thanks for the troubles looking at the logic.  All the point are your.

Matin