Logout confirmation

How do I insert the logout confirmation dialog? This is the code that I have before I tried Yii:


$(document).ready(function() {

	//--start logout dialog codes

	$('#logout').click(

		function(e){

		e.preventDefault();

		

		$('<div id="confirmLogout" title="Logout?">Are you sure you want to log out?</div>').dialog(

			{

			modal: true,

			height: 150, 

			width:250,

			show:"blind",

			hide:"explode",

			buttons:{

				"Yes":function() {

					$.ajax({ 

					

						complete: function() {

							$('#confirmLogout').html("Thank you!<br>Logging out...");

							$('.ui-dialog-buttonpane').css('display','none');

							var dlg = $("#confirmLogout").parents(".ui-dialog:first");

							dlg.animate({ width: 250},200);

							setTimeout(function(){$("#confirmLogout").dialog("close")},1300);

							setTimeout(function(){window.location="site/login";},1700);	

							} 

						});

					},

				"No":function() {

					$("#confirmLogout").dialog("close");

					}

			},

			close:function(){

				 $("#confirmLogout").remove();

			}

			});


		return false; 

	});

	//--end logout dialog codes

});

Can this be implemented with the framework?

Yes man… in a lot of ways, the simplest one would be:

NOT TESTED… be carefull with use of quotes





Yii::app()->getClientScript()->registerScript('whatevernameyouwanthere',"

        //--start logout dialog codes

        $('#logout').click(

                function(e){

                e.preventDefault();

                

                $('<div id="confirmLogout" title="Logout?">Are you sure you want to log out?</div>').dialog(

                        {

                        modal: true,

                        height: 150, 

                        width:250,

                        show:"blind",

                        hide:"explode",

                        buttons:{

                                "Yes":function() {

                                        $.ajax({ 

                                        

                                                complete: function() {

                                                        $('#confirmLogout').html("Thank you!<br>Logging out...");

                                                        $('.ui-dialog-buttonpane').css('display','none');

                                                        var dlg = $("#confirmLogout").parents(".ui-dialog:first");

                                                        dlg.animate({ width: 250},200);

                                                        setTimeout(function(){$("#confirmLogout").dialog("close")},1300);

                                                        setTimeout(function(){window.location="site/login";},1700);     

                                                        } 

                                                });

                                        },

                                "No":function() {

                                        $("#confirmLogout").dialog("close");

                                        }

                        },

                        close:function(){

                                 $("#confirmLogout").remove();

                        }

                        });


                return false; 

        });

        //--end logout dialog codes

",CClientScript::POS_READY);



You can also use a button and set its click even to call a registered function on your pages… lots of ways

Whoa! That easy?!?! You really are an advanced member! ;)

I’ll try this tomorrow, and I’ll give feedback if this works :)




Yii::app()->getClientScript()->registerScript('whatevernameyouwanthere','

        //--start logout dialog codes

        $("#logout").click(

                function(e){

                e.preventDefault();

                

                $(\'<div id="confirmLogout" title="Logout?">Are you sure you want to log out?</div>\').dialog(

                        {

                        modal: true,

                        height: 150, 

                        width:250,

                        show:"blind",

                        hide:"explode",

                        buttons:{

                                "Yes":function() {

                                        $.ajax({ 

                                        

                                                complete: function() {

                                                        $("#confirmLogout").html("Thank you!<br>Logging out...");

                                                        $(".ui-dialog-buttonpane").css("display","none");

                                                        var dlg = $("#confirmLogout").parents(".ui-dialog:first");

                                                        dlg.animate({ width: 250},200);

                                                        setTimeout(function(){$("#confirmLogout").dialog("close")},1300);

                                                        setTimeout(function(){window.location="site/login";},1700);     

                                                        } 

                                                });

                                        },

                                "No":function() {

                                        $("#confirmLogout").dialog("close");

                                        }

                        },

                        close:function(){

                                 $("#confirmLogout").remove();

                        }

                        });


                return false; 

        });

        //--end logout dialog codes

',CClientScript::POS_READY);




Use Igor’s, he made sure double quotes and single quotes conflicts are avoided.

cheers

When you have a big portion of javascript/jQuery code than you can leave it in a .js file and use registerScriptFile() - http://www.yiiframework.com/doc/api/1.1/CClientScript#registerScriptFile-detail

Thanks guys! Response time in this forum is awesome!