Help with jQuery Edit in Place plugin integration into Yii app

2 questions:

  1. Does Yii come bundled with a Edit-in-place plugin. I didn’t see one.

  2. I am trying to integrate this 3rd-party in-line editable plugin, but I am not having any success seeing the UI element in the view. When I mouse over the element, I don’t see the in-place edit option. Any help please? :frowning:

In my main.php layout file, I have the following libraries loaded:

<?php Yii::app()->clientScript->registerCoreScript('jquery'); ?>

<?php Yii::app()->clientScript->registerCoreScript('jquery.ui'); ?>

<?php Yii::app()->clientScript->registerScriptFile(Yii::app()->baseUrl ."/js/jquery.editinplace.js", CClientScript::POS_HEAD); ?>


<span class="editable">Hello World!</span>

<script type="text/javascript">

$(function() {


    buttonText: 'Add',

    save: function(e, data) {

      return confirm('Change name to '+ data.value +'?');





I wanted to use the Highslide js (Thumbnail viewer) files with my application. I downloaded the code from and put it under protected/js folder (the downloaded files are in the protected/js/highslide folder.) Then I used the following code in the header section of view/layouts/main.php, and I was able to use the Highslide functionality in my Yii application. Here is my code. Notice that I have commented the original <link rel command generated by the Yii framework as it is defied in the new code.


        <link rel="stylesheet" type="text/css" href="<?php echo Yii::app()->request->baseUrl; ?>/css/form.css" />







 $cs->registerScriptFile(Yii::app()->request->baseUrl.'/js/highslide/highslide.js', CClientScript::POS_HEAD);

 $cs->registerScriptFile(Yii::app()->request->baseUrl.'/js/highslide/highslide_eh.js', CClientScript::POS_HEAD);

 $script = 'hs.graphicsDir = \''.Yii::app()->request->baseUrl.'/js/highslide/graphics/\';'."\n";

 $script .= 'hs.outlineType = \'rounded-white\';'."\n";

 $script .= 'hs.showCredits = false;';

 $cs->registerScript('hislide-par', $script, CClientScript::POS_BEGIN);

 $script = 'addHighSlideAttribute();';

 $cs->registerScript('hislide-att', $script, CClientScript::POS_END);


this test works for me:

<?php Yii::app()->clientScript->registerScriptFile(Yii::app()->baseUrl . "/js/jquery.editinplace.js", CClientScript::POS_HEAD); ?>

<span class="editable">Hello World!</span>

<?php Yii::app()->clientScript->registerScript('edit',"



            /*show_buttons: true,*/

            callback: function(e, data) {

                return data;





Thanks both - it works!

why I should add jquiery.ui and complete $(document).ready function on POS_HEAD?

any suggestion for better use are very welcome, thanks before, here is my complete code on a view page. i store my jquery.editinplace.js on assets/js.




	<th>Item Stock</th>

	<th>Stock Code</th>



	<th>Total harga</th>







foreach ($listItem as $data): 



	<td><?php echo $i++; ?></td>

	<td><?php echo $data->stockDetail->nama; ?></td>

	<td><?php echo $data->stockDetail->stockCode; ?></td>


		<span id="<?php echo 'itemN-'.$data->id; ?>" ><?php echo $data->n; ?></span>

		<?php $itemEditScript .= 



				callback: function(unused, enteredText) { return enteredText; },

				// url: './server.php',

				show_buttons: false




		<?php echo $data->satuan ?>


	<td><?php echo $data->hargaSatuan ?></td>

	<td><?php echo $data->totalHarga ?></td>

	<td><?php echo $data->priorityOrderByCustomer ?></td>

	<td><?php echo $data->ket ?></td>


<?php endforeach; ?>



Yii::app()->clientScript->registerScriptFile(Yii::app()->baseUrl . "/assets/js/jquery.editinplace.js", CClientScript::POS_HEAD); 


Yii::app()->clientScript->registerScript('editItem',"$(document).ready(function(){".$itemEditScript."});", CClientScript::POS_HEAD); 


would you please describe briefly how to update the data into database?

how to configure url parameter and receive the params in the controller/action?

thank you before,

i solve this out by adding this parameter


url: '".$this->createUrl('JqEditInLineUpdate',array('id'=>$data->id))."',

params: 'fldName=n',


here are some codes from my controller

public function actionJqEditInLineUpdate($id)





 	$model->totalHarga = $model->n * $model->hargaSatuan;


        $this->renderPartial('_JqEditInLineUpdate', array('value'=>$_POST['update_value']), false, true);


 	return false;


any better techniques?