»
S
I
D
E
B
A
R
«
jQuery update does not work with IE7/8
November 10th, 2009 by wood

With the help of members from this post, I converted from prototype to jQuery.

function jsUpdateCart(){
  var parameter_string = '';
  allNodes = document.getElementsByClassName("process");
  for(i = 0; i < allNodes.length; i++) {
    var tempid = allNodes[i].id;
    var temp = new Array;
    temp = tempid.split("_");
    var real_id = temp[2];
    var real_value = allNodes[i].value;
    parameter_string += real_id +':'+real_value+',';
  }

  var params = 'ids='+parameter_string;

   $.ajax({
   type: "POST",
   url: "http://127.0.0.1/codeigniter_shopping/index.php/welcome/ajax_cart",
   data: params,
   success: function( r ) {
    $('#ajax_msg').html( r );
    location.reload( true );
  }
 });

}



function jsRemoveProduct(id){
  var params = 'id='+id;
  $.ajax({
   type: "POST",
   url: "http://127.0.0.1/codeigniter_shopping/index.php/welcome/ajax_cart_remove",
   data: params,
   success: function( r ) {
    $('#ajax_msg').html( r );
    location.reload( true );
  }
 });
}

ajax_cart_remove works in both Firefox and IE, but update works with Firefox, but it doesn't with IE 7/8.

Could anyone give me some suggestions please.

You can see the original prototype code here.

ajax_cart and ajax_cart_remove in controllers are followings.

function ajax_cart(){
    $this->MOrders->updateCartAjax($this->input->post('ids'));  
  }

  function ajax_cart_remove(){
    $this->MOrders->removeLineItem($this->input->post('id'));
  }

And models for MOders are following.

function removeLineItem($id){
    $id = id_clean($id);
    $totalprice = 0;
    $cart = $_SESSION['cart'];
    if (isset($cart[$id])){
    	unset($cart[$id]);
    	foreach ($cart as $id => $product){
    		$totalprice += $product['price'] * $product['count'];
    	}		
    	$_SESSION['totalprice'] = $this->format_currency($totalprice);
    	$_SESSION['cart'] = $cart;

    	echo "Product removed.";
    }else{
    	echo "Product not in cart!";
    }
}

function updateCartAjax($idlist){
    $cart = $_SESSION['cart'];
    $records = explode(',',$idlist);
    $updated = 0;
    $totalprice = $_SESSION['totalprice'];

    if (count($records)){
    	foreach ($records as $record){
    		if (strlen($record)){
    			$fields = explode(":",$record);
    			$id = id_clean($fields[0]);
    			$ct = $fields[1];

    			if ($ct > 0 && $ct != $cart[$id]['count']){
    				$cart[$id]['count'] = $ct;
    				$updated++;
    			}elseif ($ct == 0){
    				unset($cart[$id]);
    				$updated++;
    			}
    		}	
    	}

    	if ($updated){
    		$totalprice=0;
    		foreach ($cart as $id => $product){
    			$totalprice += $product['price'] * $product['count'];
    		}		

    		$_SESSION['totalprice'] = $this->format_currency($totalprice);
    		$_SESSION['cart'] = $cart;

    		switch ($updated){
    			case 0:
    			$string = "No records";
    			break;

    			case 1:
    			$string = "$updated record";
    			break;

    			default:
    			$string = "$updated records";
    			break;
    		}
    		echo "$string updated";

    	}else{
    		echo "No changes detected";

    	}
    }else{
    	echo "Nothing to update";

    }
}

The following is the html output of form

<form action="http://127.0.0.1/codeigniter_shopping_copy2/index.php/welcome/checkout" method="post"><table border='1' cellspacing='0' cellpadding='5'>
<tr valign='top'>
<td><input type="text" name="li_id[10]" value="1" id="li_id_10" class="process" size="5"  /></td>
<td id='li_name_10'>Dress 1</td>
<td id='li_price_10'>33.95</td>
<td id='li_total_10'>33.95</td>
<td><input type='button' name='delete' value='delete' onclick='jsRemoveProduct(10)'></td>
</tr>
<tr valign='top'>

<td><input type="text" name="li_id[6]" value="2" id="li_id_6" class="process" size="5"  /></td>
<td id='li_name_6'>Shoes 1</td>
<td id='li_price_6'>23.95</td>
<td id='li_total_6'>47.90</td>
<td><input type='button' name='delete' value='delete' onclick='jsRemoveProduct(6)'></td>
</tr>
<tr valign='top'>
<td colspan='3'>&nbsp;</td>
<td colspan='2'>81.85 
<input type="hidden" name="name" value="total" />
<input type="hidden" name="id" value="total" />
<input type="hidden" name="value" value="81.85" />
</td>
</tr>

<tr valign='top'>
<td colspan='3'>&nbsp;</td>
<td colspan='2'><input type='button' name='update' value='update' onclick='jsUpdateCart()'/></td>
</tr>
<tr valign='top'>
<td colspan='3'>&nbsp;</td>
<td colspan='2'><input type="submit" name="submit" value="checkout"  /></td>
</tr>
</table>
</form>

Leave a Reply

»  Substance: PHP Frameworks   »  SiteMap