Update Foreach Loop Items With Ajax

Hey All!

Just got a little thingy to solve here. I have a view (partial) which has a foreach loop in it:

<div class="row well" id="item_form">

	<div class="span3">

		<h4 class="specialhead">Create new Item</h4>

		<?php $form = $this->beginWidget('bootstrap.widgets.TbActiveForm', array(

			'layout' => TbHtml::FORM_LAYOUT_INLINE,

		)); ?>

		<?php $model = new EItem; ?>

		<div class="row">

			<?php echo $form->textFieldControlGroup($model, 'title'); ?>

			<?php echo CHtml::ajaxSubmitButton('Create new IO',CHtml::normalizeUrl(array('item/additem','render'=>true)),



                     'success'=>'function(data) { 





                        $.each(data, function(key, val) {




                     ),array('class'=>'btn btn-info')); 



		<?php $this->endWidget(); ?>



<div id="item_container">

	<?php foreach($items as $item): ?>

		<table class="bordered_table" id="item<?php echo $item->id; ?>">

			<tr class="odd">

				<td class="span4"><b>Title</b></td>

				<td class="span4">

					<?php $this->widget('yiiwheels.widgets.editable.WhEditableField', array(

					    'type' => 'text',

					    'model' => $item,

					    'attribute' => 'title',

					    'url' => $this->createUrl('item/update'),

				    ));	 ?>


				<td class="span4"></td>



	<? endforeach; ?>


and the ItemController:

public function actionAddIo()




			$item = new EItem;

			$item->attributes = $_POST['EItem'];


			$all_items = EItem::model()->findAll());

			// WHAT TO DO HERE??? I tried $this->renderPartial('_items', array('items'=>$all_items), false, true); but that does not work



basically I just want to get the foreach loop of tables updated and show the new item immediately, can someone tell me how to do that?

Thanks in advance for any help!


  1. Get HTML content from server (use renderPartial for this).

Insert it to table using jquery’s appendTo() or something.

  1. Get JSON from server. Use some javascript to create a new row (for example, by cloning existing row)

  2. Get JSON and use client-side rendering (like knockout.js, angularJS etc)

Use it as

return $this->renderPartial('_items', array('items'=>$all_items), false, true);

And in html where you have to display it do as