Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New Coder
    Join Date
    Jul 2006
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Ajax ie7 error. Works in firefox. Please Help.

    Hi,
    I am very new to javascript and ajax. I am trying to make a page where you can choose different options for a package and the price will be automatically updated, similar to the way you can customize a computer at apple's website here.

    I modified a script I got from a book and got it to work in Firefox but it gives me this error in ie7:
    Line: 10
    Char: 1
    Error: Object expected
    Code:0


    Here is the a link to it
    http://tophermorrison.com/form/

    Here is the html

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type"
     content="text/html; charset=iso-8859-1" />
    <title>Choice Test</title>
    <link href="style.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="ajax_javascript.js"></script>
    </head>
    <body onload="process('design', 50, 0);">
    <div id="container">
      <div> Price </div>
      <div id="price">750</div>
    </div>
    <br />
    <br />
    <span class="content_heading">Choice Box 1 </span>
    <div class="pick_box"> Choose an optinon below
      <div class="choice_box">
        <div id="design"></div>
      </div>
    </div>
    </body>
    </html>
    here is the javascript

    Code:
    // stores the reference to the XMLHttpRequest object
    var xmlHttp = createXmlHttpRequestObject(); 
    
    // retrieves the XMLHttpRequest object
    function createXmlHttpRequestObject() 
    {	
      // will store the reference to the XMLHttpRequest object
      var xmlHttp;
      // if running Internet Explorer
      if(window.ActiveXObject)
      {
        try
        {
          xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        catch (e) 
        {
          xmlHttp = false;
        }
      }
      // if running Mozilla or other browsers
      else
      {
        try 
        {
          xmlHttp = new XMLHttpRequest();
        }
        catch (e) 
        {
          xmlHttp = false;
        }
      }
      // return the created object or display an error message
      if (!xmlHttp)
     
        alert("Error creating the XMLHttpRequest object.");
      else 
        return xmlHttp;
    }
    
    // make asynchronous HTTP request using the XMLHttpRequest object 
    function process(category, sprice, math)
    {
    	price =document.getElementById("price").innerHTML;
    	price = parseInt(price);
    	
      // proceed only if the xmlHttp object isn't busy
      if (xmlHttp.readyState == 4 || xmlHttp.readyState == 0)
      {
        // execute the quickstart.php page from the server
        xmlHttp.open("GET", "ajax_php.php?math=" + math + "&price=" + price + "&sprice=" + sprice + "&category=" + category, true);  
        // define the method to handle server responses
        xmlHttp.onreadystatechange = handleServerResponse;
        // make the server request
        xmlHttp.send(null);
      }
      else
        // if the connection is busy, try again after one second  
        setTimeout('process()', 1000);
    }
    
    // executed automatically when a message is received from the server
    function handleServerResponse() 
    {
      // move forward only if the transaction has completed
      if (xmlHttp.readyState == 4) 
      {
        // status of 200 indicates the transaction completed successfully
        if (xmlHttp.status == 200) 
        {
          // extract the XML retrieved from the server
          xmlResponse = xmlHttp.responseXML;
          // obtain the document element (the root element) of the XML structure
          xmlDocumentElement = xmlResponse.documentElement;										
    											
    var html = '';
    	count = xmlDocumentElement.childNodes[2].firstChild.data;
    	category = xmlDocumentElement.childNodes[1].firstChild.data;
    	price = xmlDocumentElement.childNodes[0].firstChild.data;
    	count = parseInt(count) + 3;
    	i = 3;
    	e = 3;
    	html = 'default';
    while( i < count){
    count = count - 1;
    	class = xmlDocumentElement.childNodes[e].getAttribute("class");
    	iname = xmlDocumentElement.childNodes[e].getAttribute("iname");
    	iprice = xmlDocumentElement.childNodes[e].getAttribute("iprice");
    	math = xmlDocumentElement.childNodes[e].getAttribute("math");
    	checked = xmlDocumentElement.childNodes[e].firstChild.data;
    	message = xmlDocumentElement.childNodes[e].getAttribute("message");
    	e = e + 1;
    if(html == 'default'){
    html = '<div class="' + class + '" onclick="process(' + "'" + iname + "'" + ',' + iprice + ',' + math + ');"><input class="radio" name="' + iname + '" type="radio" value="' + iprice + '" ' + checked + '/>' + message + '</div>';
    }else{
    html = html + '<div class="' + class + '" onclick="process(' + "'" + iname + "' " + ', ' + iprice + ', ' + math + ');"><input class="radio" name="' + iname + '" type="radio" value="' + iprice + '" ' + checked + '/>' + message + '</div>';
    }
    document.getElementById(category).innerHTML = html;
    }
    			
    		document.getElementById("price").innerHTML = price;	
        } 
        // a HTTP status different than 200 signals an error
        else 
        {
          alert("There was a problem accessing the server: " + xmlHttp.statusText);
        }
      }
    }
    and here is the php

    PHP Code:
    <?PHP
    //Generate XML output
    header('Content-Type: text/xml');
    //generate xml header
    echo '<?xml version="1.0" encoding="UTF-8" standalone="yes"?>';

    $category $_GET['category'];
    $selected_price $_GET['sprice'];
    $math $_GET['math'];
    $price $_GET['price'];
    $new_price $price $math ;

    $design = array(
        array(
            
    'name' => 'design',
            
    'message' => 'Select option 1',
            
    'price' => 50,
        ),
        
        array(
            
    'name' => 'design',
            
    'message' => 'Select option 2',
            
    'price' => 100,
        ),
        
        array(
            
    'name' => 'design',
            
    'message' => 'Select option 3',
            
    'price' => 150,
        ),
        array(
            
    'name' => 'design',
            
    'message' => 'Select option 4',
            
    'price' => 200,
        ),
        array(
            
    'name' => 'design',
            
    'message' => 'Select option 5',
            
    'price' => 250,
        ),
    );

    function 
    getdata($price$iname$iprice$desc){
        if(
    $price $iprice){
            
    $diff $price $iprice;
            
    $message $desc ' [Subtract $' $diff '.00]';
            
    $math '-' $diff;
            
    $class 'deselected';
            
    $checked 'alt=""';
        }else if(
    $price $iprice){
            
    $diff $iprice $price;
            
    $message $desc ' [Add $' $diff '.00]';
            
    $math $diff;
            
    $class 'deselected';
            
    $checked 'alt=""';
        }else{
            
    $message $desc ' [Included in price]';
            
    $math 0;
            
    $class 'selected';
            
    $checked 'checked="checked"';
        }

            echo 
    '<option iname="'$iname'" math="'$math'" class="'$class'" message="'$message'" iprice="'$iprice'">'$checked'</option>' ;
    }

    if(
    $category == 'design'){
        
    $total count($design);

        echo 
    '<elements><price>'$new_price'</price><category>'$category'</category><count>'$total'</count>';

        for(
    $i=0$i<$total$i++) {
            
    $name_value $design[$i]['name'];
            
    $price_value $design[$i]['price'];
            
    $design_value $design[$i]['message'];
            
    getdata($selected_price$name_value$price_value$design_value);
    }
    echo 
    '</elements>';
    }
    ?>
    Can anyone help me?

  • #2
    New Coder
    Join Date
    Jul 2006
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I found one problem thanks to Netscape's javascript console

    I was using class as a variable so I changed var class to var item_class.

    Now it works in Netscape when it renders as Firefox but not when it renders as IE.

    Now I get this message from IE7

    Line: 45
    Char:2
    Error: Object doesn't support this property or method
    Code: 0
    URL: http://tophermorrison.com/form/


    This is driving me crazy!

  • #3
    New Coder
    Join Date
    Jul 2006
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I think I figured it out. It works now!!

    I didn't put var in front of my variables.

    I changed

    Code:
    price = document.getElementById("price").innerHTML;
    to

    Code:
    var price = document.getElementById("price").innerHTML;
    and did the same for the other variable and it works without errors.

    Any comments on how I can make it better would be great though.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •