Ajax update POST beforeSend

Hi,

I am struggling with an ajax request. The client selects a quantity of an item they want and press the button to add the item to their cart via ajax.

How do you update the quantity before your make the ajax request. You will have to read the value of the select and then concatenate the data: field. Is this possible with Yii/Ajax or should I revert to plain JQuery?

Your positive feedback will be appreciated.

a little more detail will be appreciated. screenshot or something?

Your doubt sounds to me a pretty simple javascript function on a HTML element event. Register your function with CClientScript or add it on your element’s HTML options…

Cheers

In most situations where I’ve wanted to do something similar to what you’re doing I’ve found that it’s enough to use http://www.yiiframework.com/doc/api/1.1/CHtml#ajax-detail in the ajax attribute of a form element using either the ‘update’ or some more specific jquery in the ‘success’ attribute. This ought to give you enough control, and you can just set up a text field to run your ajax action every time its value changes.

Why do you want to update the quantity BEFORE the ajax request? Shouldn’t you do your additions in your controller/model, save it, and then return the result via success?

Thank you for the replies but I’m still stuck, I’m probably overlooking something very simple but it’s driving me crayzeee and I have lost 2 days on it already , here is the code I’m using:

protected/views/site/products.php:


<?php

$this->pageTitle=Yii::app()->name . ' - Products';


$cat=isset($_REQUEST['cat']) ? $_REQUEST['cat']:'Consumables';

$sub =isset($_REQUEST['sub']) ? $_REQUEST['sub'] : '';

if(!$sub)

{

	$prod= Products::model()->findAll('prod_category=:cat and prod_status=1 order by prod_name',array(':cat'=>$cat));

}else{

	$prod= Products::model()->findAll('prod_category=:cat and prod_subcat=:sub and prod_status=1 order by prod_name',array(':cat'=>$cat, ':sub'=>$sub));

}


// Creating select

for($e=1; $e<20; $e++)

{

	$select .='<option value="'.$e.'">'.$e.'</option>';

}

?>

<script type="text/javascript">


function addToCart(i)

{

	var qty =$('#i'+i).val();

	alert(i);

	$.ajax({

		type:'POST',

		url:'/yii-getinked/index.php?r=site/addToCart',

		cache:false,

		data:'qty='+qty+'&id='+i,

		success:function(msg){

			$("#basketAction").html(msg);

		},

		error:function (xhr, ajaxOptions, thrownError){

            alert(xhr.statusText);

            alert(thrownError);

        }  

	});

	

}

</script>

<div id="basketAction"></div>

<table style="width:100%; height:620px;">

<tr><td width="200px" valign="top" style="vertical-align:text-top;"><?php include('menu.php');?></td>

	<td style="vertical-align:text-top;">

	<div style="">

	<?php 

	

	$r=0;	//set http://localhost/images/products/th/th_e8bab3213e169a7dcda49d8c3225899a.jpg

	foreach($prod as $item)

	{

		if($r==0)

		{

			//echo '<tr>';

		}

		$img = ($item['prod_image']=='z')? 'no_image.gif' : $item['prod_image'];

		@list($width, $height, $type, $attr) = getimagesize("images/products/th/th_".$item['prod_image']);

                // Crop

                if($width>$height)

                {

                    $imgcrop = 'width="100px"';

                }else{

                    $imgcrop = 'height="100px"';

                }

		?>

		<div style="float:left; width:182px"><fieldset style="height:170px" class="productlist rounded-corners"><?php echo $item['prod_name'];?><br/> 

			<a href="#" onclick="window.location,href='productdisplay.php?id=<?php echo $item['prod_id'];?>&cat=<?php echo $cat;?>'">

			<img src="images/products/th/th_<?php echo $img;?>" <?php echo $imgcrop;?>></a><br/>

			<div style="bottom:0px; position:absolute">R <?php echo $item['prod_special'];?> @ <?php  echo $item['prod_unit'];?><br/>

			<select id="i<?php echo $item['prod_id'];?>"><?php echo $select;?></select>

			<input type="button" class="submit rounded-corners" name="sub" value="Add to cart" onclick="addToCart('<?php echo $item['prod_id'];?>');"></div></fieldset></div>

		<?php 		

		$r++;

		if($r>3)

		{

			echo '<div style="clear:both; height:10px;"></div>';$r=0;

		}

	}

	?>

	

	</div>

	</td></tr>

</table>

products/controllers/ProductsController.php

… accessRules …




array('allow',

				'actions'=>array('addToCart'),

				'users'=>array('*'),

			),



… actionAddToCart …




public function actionAddToCart()

	{

		$qty = $_POST['qty'];

		$id = $_POST['id'];

		if($qty && $id)

		{

			$m = 'yes';			

		}else{

			$m = 'no';

		}

		return $m;

	}