Yii Jui Tutorials

CGridview Auto Update With CJuiDialog

This tutorial will help you to update the cgridview with out page reload When you use the CJuiDialog Form to update the record. Some time We will do this type of concept. We have to show the listing and update action in cgridview widget page to avoid the new page for updating the record or some technical concept based on project. Here I used iframe concept with cjuidialog to update […]... Read More »

Date Picker In Yii

Date Picker In Yii. I added this articles for yii framework datepicker. It will help you to understand yii datepicker concept. It contains the inline datepicker, multiple months datepicker, date range, date format etcDownload | DemoYii CJuiDatePicker: DefaultYii CJuiDatePicker: InlineYii CJuiDatePicker: Show/Select Other Month DatesYii CJuiDatePicker: Display Button Bar(showButtonPanel)Yii CJuiDatePicker: Display Month & Year MenusYii CJuiDatePicker: Display Multiple MonthsYii CJuiDatePicker: Date FormatYii CJuiDatePicker: Date RangeYii CJuiDatePicker: Default <h1>Yii CJuiDatePicker: Default</h1> […]... Read More »

Yii CJuiDialog

CJuiDialog displays a dialog widget. This article will give the information about “how to handle cjuidialog” in yii framework. I added the sourcecode below.Download | DemoYii CJuiDialog : DefaultYii CJuiDialog : AnimationYii CJuiDialog : Auto OpenYii CJuiDialog : Default <h1>Yii CJuiDialog : Default</h1> <?php /** Start Widget **/ $this->beginWidget('zii.widgets.jui.CJuiDialog',array( 'id'=>'mydialog', 'options'=>array( 'title'=>'Dialog box', 'autoOpen'=>false, ), )); echo 'dialog content here'; $this->endWidget('zii.widgets.jui.CJuiDialog'); /** End Widget **/ echo CHtml::link('Open Dialog', '#', array( […]... Read More »

Yii CJuiSlider Input

CJuiSlider displays a slider. This article will give the information and demo for cjuislider widget in yii. I used ajax concept in this tutorial and demo.Download | DemoCJuiSlider Input : BasicCJuiSlider Input : AnimateCJuiSlider Input : Fixed MaximumCJuiSlider Input : VerticalCJuiSlider Input : Vertical & Step ValueCJuiSlider Input : RangerCJuiSlider Input : Ajax Reques On ChangeCJuiSlider Input : Basic <h1>CJuiSlider Input : Basic</h1> <label for="amt">Volume:</label> <input type="text" id="amount_basic" style="border:0; color:#f6931f; […]... Read More »

CJuiDialog Close Automatically With IFrame In Yii

Cjuidialog ControllerCjuiDialog ViewCjuiDialog Ajax View With Auto CloseCjuidialog Controller [CjuidialogController.php]I added the controller for cjuidialog action. <?php class CjuidialogController extends Controller { public function actionCJuidialog() { $this->render("cjuidialog"); } public function actionAjax() { $this->render("ajax"); } } ?> CjuiDialog View [cjuidialog.php]Using this code I added content into iframe via ajax request. I called “cjuidialog/ajax” action to get the content and i load that content into iframe. <?php Yii::app()->clientScript->registerScript("iframe-cjuidialog"," $('#opencjuidialog').live('click',function() { $('#iframe').attr('src','".Yii::app()->createAbsoluteUrl("cjuidialog/ajax")."'); $('#cjui-dialog').dialog('open'); […]... Read More »

Yii Accordion

Download Yii Accordion | Demo Yii AccordionI added code here for “Yii Accordion” from my experience. The topics areYii Default AccordionYii Accordion Auto Height True/FalseYii Accordion IconDynamic Yii Accordion Menu With ColorYii Default AccordionThis is the default jquery accordion using yii.&l;t?php $this->widget('zii.widgets.jui.CJuiAccordion',array( 'panels'=>array( 'panel 1'=>'content for panel 1', 'panel 2'=>'content for panel 2', // panel 3 contains the content rendered by a partial view 'panel 3'=>$this->renderPartial('_renderpage',null,true), ), // additional javascript […]... Read More »

Yii CJuiAutoComplete

Yii CJuiAutoComplete Source.This tutorial will help you to understand yii cjuiautocomplete with ajax. Here I wrote the code for CJuiAutoComplete. You can download the source code for yii cjuiautocomplete.Download Yii CJui AutoComplete | Demo Yii CJui AutoCompleteCJuiAutoCompleteAjax CJuiAutoCompleteCJuiAutoComplete <?php $this->widget('zii.widgets.jui.CJuiAutoComplete',array( 'name'=>'normal', 'source'=>array('ac1','ac2','ac3'), 'options'=>array( 'minLength'=>'1', ), 'htmlOptions'=>array( 'style'=>'height:20px;', ), )); ?> Ajax CJuiAutoCompleteAuto Complete View <?php //In autocompleteview.php $this->widget('zii.widgets.jui.CJuiAutoComplete', array( 'name'=>'city1', 'source'=>$this->createUrl('site/autocomplete'), // additional javascript options for the autocomplete plugin 'options'=>array( […]... Read More »

How To Handle CJuiTabs in Yii

I have created this yii cjuitabs article from my experience.When you read this article you can understand the yii cuitabs to handle differenct way.When i work on project, I need to assign the color for each tabs. I did this using span.Download Yii CJuiTabs | Demo Yii CJuiTabsStatic CJuiTabsRender CJuiTabsDynamic CJuiTabsCJuiTabs With Class(Style)Dynamic Yii CJui Tabs Menu With ColorYii CJui Tabs Mouse Over EventDefault Selected CJuiTabsDefault Selected CJuiTabs Using SessionStatic […]... Read More »