Twitter Boostrap Dropdown

Yii 1.1 General Discussion
1

Hai Everyone,

I have displayed the login form in Dropdown at the navigation bar like Twitter website. by using the twitter bootstarp. i struggled with that for getting the form in dropdown. Now i got the form and the Ajax validations are working like charming. But when i click on submit it does nothing.

I have displayed the form in index page If so i have add the verification code in actionIndex()…???

Where i have to catch this submit and how to trigger the action.

and i have tested with some basic link in that same dropdown. When i mouse over it its shows the target link if i click on that link it nothing happens.

Whats wrong?

How can i do that?

Thanks,

paapi.

2

Please can you show a little bit of your code. It’s difficult to help you without an understanding what you did.

I think we will need a part of the view-code and the code of the action in your controller.

Without the code, we can’t help you.

3

Thanks for the response.

I found the ajax part being empty in my view file like this.




<li class="login">


    <div class="form drop">

	

	<?php $model = new LoginForm;?>

	

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

		'action'=>'site/signin',

		'id'=>'login-form',

		'enableClientValidation'=>true,

		'clientOptions'=>array(

			'validateOnSubmit'=>true,

		),

	)); ?>


	<div class="row">

		<?php echo $form->textField($model,'username',array('placeholder'=>'User Name')); ?>

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

	</div>


	<div class="row">

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

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

	</div>


	<div class="row rememberMe">

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

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

	</div>


	<div class="row buttons">

		<?php echo CHtml::submitButton('Login',array('class'=>'loginbut')); ?>

	</div>


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

</div><!-- form -->

<hr/>

<div id="social">


		<?php

			echo CHtml::link('

			<img src="http://localhost/pyt/images/facebook-login-button.png" 

				 alt="" />', 

				 'http://www.facebook.com'

			);

		?>


		<?php

			echo CHtml::link('

			<img src="http://localhost/pyt/images/twitter-login-button.png" 

				 alt="" />', 

				 array('site/sociallogin', 'provider'=>'twitter')

			);

		?>


		<?php

			echo CHtml::link('

			<img src="http://localhost/pyt/images/google-login-button.png" 

				 alt="" />', 

				 array('site/sociallogin', 'provider'=>'google')

			);

		?>


</div>

</li>

 

<?php

$cs = Yii::app()->clientScript;

$cs->registerScript('fixed_dropdown','

    jQuery("ul.fixed-panel.dropdown-menu").click(function(){

            return false;

    });

 

    jQuery("ul.dropdown-menu li.login input.loginbut").click(function(){

 

        //handler your form here

	alert("hi");

        jQuery("li.open").removeClass("open");

    });

',CClientScript::POS_READY);

?>

In that (//handlet your form) area i have to add my ajax code to validate my user details right???

then i have 3 image button in that same form for integrating with social networks.

For that also i have to use ajax code to trigger the action?

4

Take a look to the actions, you have chosen: site/signin

You told that you modified the code of the actionIndex(), but that can’t work.

In your SiteController, there has to be a function with the name actionSignin. In this function, you have to write the code of the actionIndex.

The same thing in the links of the div "social".

This link for example, use the function actionSociallogin in the SiteController. If the function doesn’t exist, you won’t get a feedback from the page.

Just a hint for the future, maybe you can use the plugin FireBug for Firefox. If an action doesn’t exist and you try to call it, firebug shows you an error.

5

Lets Go one by one

I have change the submit button into AjaxSubmitButton

and my button code is




<?php

			echo CHtml::ajaxSubmitButton('Login','index.php/site/signin',array(

			   'type'=>'POST',

			   'dataType'=>'json',

			   'data'=>'js:$("#login-form").serialize()',

			   'success'=>'js:function(data){

				   if(data.result==="success"){

					  alert("Success");

				   }else{

					 $("#message").html(data.msg);

				   }

			   }',

			));

		?>

and in my controller i have this action to handle this request

sitecontroller.php




public function actionSignin()

	{

	

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

            $model = new LoginForm;

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

            if ($model->validate() && $model->login())

                exit(json_encode(array('result' => 'success', 'msg' => 'Some Text Success')));

            else

		exit(json_encode(array('result' => 'error', 'msg' => 'Error')));

	}else {

	       exit(json_encode(array('result' => 'error', 'msg' => 'No input data has been passed.')));

		}

		//*/

	}

Still the ajax button does nothing

Whats wrong???

6

Please, insert the following code at the begin of your function actionSignin():




echo '<pre>';

echo print_r($_POST);

echo '</pre>';

Then, test the website and take a look, if there is a key ‘LoginForm’ in the $_POST-array. If not, you have the reason. Maybe you can insert this result here.

Another question: Why do you create a LoginForm-Model in the view? You could create it in the actionIndex, unset the Attributes and write it to the view with the render-function.