$_POST empty when using CActiveForm - ajaxSubmitButton

Yii 1.1 General Discussion
1

I have a view, in this I have a div. Clicking a button, the div content is changed, via ajax, to a form. In the form I have an ajaxSubmitButton, set up properly to refresh the div. The problem is that clicking the submit button, does not post the form data, $_POST is empty. In the documentation, http://www.yiiframework.com/doc/api/1.1/CHtml#ajaxSubmitButton, says "Generates a push button that can submit the current form in POST method."

What’s wrong with the form or button?

How can I post the form data to receive it when refreshing the div via ajax?

2

Can you please post your code here.so that i can figure out what is going wrong with it…since when you use a ajaxButton then surely you will get a posted data in $_POST…but might you are forgetting something that is why you are facing a problem…and please also try at once with $_GET … ;)

3

I have figured out than there is no POST at all…

Here is the code. I deleted lines that are not important.

AccountController.php




	public function actionIndex() {

		$this->render('index');

	}


	public function actionEditPersonal($userid) {

		$record=tbl_users::model()->findByPk($userid);

		if($record !== null) { 

			$model=new EditPersonalInfoForm;

			if(isset($_POST['EditPersonalInfoForm'])) {

				$model->attributes=$_POST['EditPersonalInfoForm'];

				if($model->validate()) {

					$record->first_name =	$model->firstname;

					$record->last_name =	$model->lastname;

					$record->save(false,array('first_name', 'last_name'));

					Yii::app()->user->setFlash('account-success','Your personal information has been updated.');

					$this->redirect('/account/index');

				}

			}

			else { //we set up the model with the current user's data

				$model->firstname =		$record->first_name;

				$model->lastname =		$record->last_name;

			}

			$this->renderPartial('_editpersonalinfo',array('model'=>$model));

		}

	}

index.php




<div class="simplebox">

	<p class="title">Personal information</p>

	<div id="personal_info">

		<table width="100%">

			<tr><td width="150">Name:</td><td><?php echo $this->userData->first_name.' '.$this->userData->last_name; ?></td></tr>

		</table>

		<hr>

		<?php echo CHtml::ajaxLink('Change',array('editpersonal?userid='.$this->userData->id),array('update'=>'#personal_info'), array('class'=>'bluebutton')); ?>

	</div>

</div>

_editpersonalinfo.php




<div class="form">

	<?php $form=$this->beginWidget('CActiveForm', array('clientOptions'=>array('validateOnSubmit'=>true))); ?>

	<p class="note">Fields with <span class="required">*</span> are required.</p>

	<hr>

	<table>

		<tr>

			<td><?php echo $form->labelEx($model,'firstname'); ?></td>

			<td><?php echo $form->textField($model,'firstname'); ?></td>

		</tr>

		<tr>

			<td></td>

			<td><?php echo $form->error($model,'firstname'); ?></td>

		</tr>

		<tr>

			<td><?php echo $form->labelEx($model,'lastname'); ?></td>

			<td><?php echo $form->textField($model,'lastname'); ?></td>

		</tr>

		<tr>

			<td></td>

			<td><?php echo $form->error($model,'lastname'); ?></td>

		</tr>

	</table>

	<div class="row buttons"><?php echo CHtml::ajaxSubmitButton('Save',array('editpersonal?userid='.$this->userData->id),array('update'=>'#personal_info')); ?></div>

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

</div>

As I said, there is no POST at all!

If I change the button to CHtml::submitButton, it works fine but if a validation fails, the user can’t see anything because the index.php is rendered again. I want to display _editpersonalinfo.php until the validation is ok.

4

First of all, how would you expect to have $_POST populated if you don’t send it, pretty weird huh ?

Try it like:




<?php $form=$this->beginWidget('CActiveForm', array(

   'id'=>'myFORM'

   'clientOptions'=>array('validateOnSubmit'=>true)

)); ?>

[...]INPUT FIELDS[...]




<div class="row buttons">

<?php echo CHtml::ajaxSubmitButton('Save',array('editpersonal?userid='.$this->userData->id),array('update'=>'#personal_info','data'=>'js:$("#myFORM").serialize()')); ?>

</div>


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

Thanks for the input! Sadly still doesn’t works, no post.

I expect POST because the form method="post", also button type="submit".

6

Just out of curiosity, if you take out the ‘clientOptions’=>array(‘validateOnSubmit’=>true) part, what’s happening ?

Do you have any developer tool to monitor the XHR requests in browser and see where the request goes and what data it sends ?

For FF you’ll need firebug, for Chrome/Safari/IE, just press F12 on page and go to network and select the XHR button then submit the form and watch the request.

L.E: even if you have method="post" when you submit the data via ajax, you need to send the form data with serialize() method.

7

Thank you guys I was having the same problem and I solved it just like that :)

In the form view




 <?php

        $form = $this->beginWidget('CActiveForm', array(

            'id' => 'invite-form',

            'enableAjaxValidation' => false,

            'enableClientValidation' => true,

            'clientOptions' => array('validateOnSubmit' => true),

                ));

        ?>


 SOME CODE HERE 

 <div class="row buttons">

            <?php

            echo CHtml::ajaxSubmitButton('Invite Selected', array('invite'),array('update' => '#group-wrapper','data'=>'js:$("#invite-form").serialize()','method'=>'post'));//CHtml::submitButton('Invite Selected');//CHtml::ajaxSubmitButton('Invite Selected', $this->createUrl('invitePeople', array('id' => $model->group_id)), array('update' => '#group-wrapper'));

            ?>


        </div>
8

Just as an addition to this topic:

When your $_POST is empty after an ajax Submit fired by a form that itself has been created by an earlier ajax call through renderPartial - make sure that your renderPartial call looks like this:




		$this->renderPartial('edit_address',array( 'model'=>$model ), false, [b]true[/b]);

(with emphasis on the fourth parameter)

renderPartial

Notice that example has processOutput=true

9

Side note to my addition:

If your forms -rendered by ajax calls!- contain ajaxLink or ajaxSubmits be aware of multiple and cascading requests! These multiple request can lead into strange and hard to interpretate behavior of your application.

You can easily check this i.e. with the network monitor of firefox’ firebug extension.

For further details read:

How to avoid multiple Ajax Request

What me helped best:

A different solution