updating form fields with ajax?

How do I update a form field with ajax?

I’m following the example at:

http://www.yiiframework.com/wiki/49/

In my form I have

vehicle/_form.php




<div id="data">

   <?php echo 'before ajax'; // $this->renderPartial('_ajaxContent', array('myValue'=>$myValue)); ?>

</div>


<?php echo CHtml::ajaxButton ("Update data",

                              CController::createUrl('vehicle/UpdateAjax'), 

                              array('update' => '#data'));

?>



The above works and updates the div data as expected. But if I use




                              array('update' => '#Vehicle_chassis_number'));



Nothing happens… Changing update to replace removes the input box and displays the text.




                              array('replace' => '#Vehicle_chassis_number'));



I just need to update the input value, is there an easier what to do this?

Actually, what I need to do is update several fields with values based on a car registration lookup using SOAP.

The other files are the same as the example

views/vehicle/_ajaxContent.php




<?php echo $mymodel ?>



controllers/VehicleController.php




    public function actionUpdateAjax()

    {

        $data = array();

        $data["myValue"] = "Content updated in AJAX";

 

        $this->renderPartial('_ajaxContent', $data, false, true);

    }



Woohoo!!!

Following this example

http://www.yiiframework.com/wiki/24/

Figured out I needed to use this code instead and don’t need the _ajaxContent.php file




    public function actionUpdateAjax()

    {

		

		echo CHtml::tag('input',		

		array('value'=>'Content updated in AJAX'));

    }



so… next question is… how do I update multiple fields?

Nope… that didn’t work, it was a replace so just replaced it with an input box rather than just updating the value.

Still stuck…

Follow this guide for ajax-driven form.

Thank you Zaccaria, that’s a very useful piece of code for creating new lookups.

But I’m still not sure how to update the other fields on my form?

Thanks, Russ

You can return the json as you need, and then update the field using the id.

For know what is the id of an input field, use CHtml::activeId($model, ‘attribute’).

Anyway I never use this approach, too much stuffs on wich to think. I prefer keep the form simple and submit the entire form via ajax.

oh I’d prefer a much simpler solution, do you have a model/view/controller example?

Finally got it to work based on the link you gave and using json

views/vehicle/_form.php




        ...

	<div class="row">

		<?php echo $form->labelEx($model,'registration_number'); ?>

		<?php echo $form->textField($model,'registration_number',array('size'=>8,'maxlength'=><img src='http://www.yiiframework.com/forum/public/style_emoticons/default/cool.gif' class='bbc_emoticon' alt='8)' />); ?>

		<?php echo $form->error($model,'registration_number'); ?>

	</div>

	

	<div class="row">

		<?php echo $form->labelEx($model,'chassis_number'); ?>

		<?php echo $form->textField($model,'chassis_number',array('size'=>17,'maxlength'=>17)); ?>

		<?php echo $form->error($model,'chassis_number'); ?>

	</div>	

	

	<?php echo CHtml::button('HPI Check', array( 'onclick'=>"{hpiCheck();}" ) ); ?>


	<div id='hpistatus'></div>

	<script type="text/javascript">

	function hpiCheck()

	{

		<?php echo CHtml::ajax(array(

				'url'=>CController::createUrl('vehicle/hpiCheck'),

				'data'=>array('registration_number'=>'js:$(\'#Vehicle_registration_number\').val()', 

								'chassis_number'=>'js:$(\'#Vehicle_chassis_number\').val()'),

				'type'=>'post',

				'dataType'=>'json',

				'success'=>"function(data)

				{

					$('#hpiStatus').html(data.status);

					$('#Vehicle_trim').val(data.trim);

					$('#Vehicle_chassis_number').val(data.chassis_number);

					$('#Vehicle_registration_number').val(data.registration_number);

                                        // .... list of fields to update

				} ",

				))?>;

		return false;  

	} 

	</script>

        ...



controllers/VehicleController.php (also add ‘hpicheck’ to access rules)




	public function actionHpiCheck()

	{

		if (Yii::app()->request->isAjaxRequest)

		{

			

			$chassis_number = Yii::app()->request->getParam( 'chassis_number' );

			$registration_number = Yii::app()->request->getParam( 'registration_number' );

			

			// Put SOAP logic here to get vehicle details from HPI check

			

			if (($chassis_number != '') || ($registration_number != ''))

			{

					echo CJSON::encode(array(

						'error'=>'false',

						'status'=>'HPI check complete', 

						'trim'=>$trim;

						'chassis_number'=>$chassis_number,

						));

					// exit;               

					Yii::app()->end();

				

			}

			else

			{

				echo CJSON::encode(array(

					'error'=>'true',

					'status'=>'HPI check failed, please enter a registration number or chassis number '

					));

				// exit;               

				Yii::app()->end();

			}

		}

	}



hey can you help me with an example that how to return with Json from controller and use it in view!!

Thanks in advanced…

Thanks @Russell England