Forms in Bootstrap Modal with Ajax submit button

Yii 1.1 General Discussion
1

I copied the login form that comes with the Yii in a bootstrap Modal. Also used a ‘ajaxSubmitButton’ for the submit button. My goal is to log the user in using ajax. The problem I encountered is that no variable is posted to the controller (I checked with Firebug). Can anyone help me figure out what is going wrong?

Thanks!

Here is the code for the Modal in my view:





<div class="modal hide" id="login">

	<div class="modal-header">

		<button type="button" class="close" data-dismiss="modal">x</button>

		<h3>Log in</h3>

	</div>

	<div class="modal-body">


		<div class="form">

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

	'id'=>'login-form',

	'enableClientValidation'=>true,

	'clientOptions'=>array(

		'validateOnSubmit'=>true,

		),

		)); ?>


			<p class="note">

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

			</p>


			<div class="row">

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

			<?php echo $form->textField($model,'username',array ('name' => 'Mohamamd', 'id'=>'Mohamamd2', 'value'=>'value')); ?>

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

			</div>


			<div class="row">

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

			<?php echo $form->passwordField($model,'password'); ?>

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

			</div>


			<div class="row rememberMe">

			<?php echo $form->checkBox($model,'rememberMe'); ?>

			<?php echo $form->label($model,'rememberMe'); ?>

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

			</div>





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

		</div>

		<!-- form -->

	</div>

	<div class="modal-footer">

		<a href="#" class="btn" data-dismiss="modal">Close</a>

		<?php echo CHtml::ajaxSubmitButton('Login', array('index'), array('update'=>'#searchResults'),

		array("class"=>"btn btn-primary btn-large")

		);

		?>

	</div>

</div>
2

Shouldn’t your submit button be inside form?

3

I’m having the exact same problems!

Nothing works!

4 

<div class="modal hide" id="login">

        <div class="modal-header">

                <button type="button" class="close" data-dismiss="modal">x</button>

                <h3>Log in</h3>

        </div>

        <div class="modal-body">


                <div class="form">

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

        'id'=>'login-form',

        'enableClientValidation'=>true,

        'clientOptions'=>array(

                'validateOnSubmit'=>true,

                ),

                )); ?>


                        <p class="note">

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

                        </p>


                        <div class="row">

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

                        <?php echo $form->textField($model,'username',array ('name' => 'Mohamamd', 'id'=>'Mohamamd2', 'value'=>'value')); ?>

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

                        </div>


                        <div class="row">

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

                        <?php echo $form->passwordField($model,'password'); ?>

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

                        </div>


                        <div class="row rememberMe">

                        <?php echo $form->checkBox($model,'rememberMe'); ?>

                        <?php echo $form->label($model,'rememberMe'); ?>

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

                        </div>

                       

                       <div class="modal-footer">

                         <a href="#" class="btn" data-dismiss="modal">Close</a>

                 <?php echo CHtml::ajaxSubmitButton('Login', array('index'), array('update'=>'#searchResults'),

                array("class"=>"btn btn-primary btn-large")

                );

                ?>

        </div>




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

                </div>

                <!-- form -->

        </div>

        

</div>

This should work!

5

Ever get this to work? I’m also trying to accomplish a modal login.