yiiselect2

Yii Framework Extensions

Createnew extension

Popular Tags

yiiselect2 Wrapper Widget to use jQuery Plugin Select2 in Yii application. Recognized by Igor Vaynberg (Creator of Select2)

Requirements
Usage
Example:
Resources

Wrapper Widget to use jQuery Plugin Select2 in Yii application.

Recognized by Igor Vaynberg (Creator of Select2)

Select2 script: https://github.com/ivaynberg/select2

Requirements ¶

Yii 1.1.13 (Not tested in others)

Usage ¶

In your source code

Yii::import('ext.select2.Select2');

Or in config

...
    'import' => array(
        ...
        'ext.select2.Select2',
        ...
    ),
    ...

Example: ¶

...
    echo Select2::multiSelect("test", null, array('test1','test2'), array(
        'required' => 'required',
        'placeholder' => 'This is a placeholder',
        'select2Options' => array(
            'maximumSelectionSize' => 2,
        ),
    ));
    ...

Or this

...
    $this->widget('Select2', array(
       'name' => 'inputName',
       'value' => 2,
       'data' => array(
           1 => 'Option 1',
           2 => 'Option 2',
           3 => 'Option 3',
           4 => 'Option 4',
        ),
    ));
    ...

Resources ¶

3 1

8 followers

1 165 downloads

Yii Version: 1.1

License: MIT

Category: User Interface

Tags: autocomplete, dropdown, jquery, select, ui, widget

Developed by: Tonin De Rosso Bolzan

Created on: Apr 1, 2013

Last updated: 11 years ago

Downloads

show all

Related Extensions

User Contributed Notes 6

#12676

0 0

Add new option also clear options

Hi,

How to implement createsearchoptions using this? Also clear options? I used this without success ;(

<?php
                    echo Select2::activeDropDownList(
                            $newDetail, 'productFk', Product::model()->getProductOptions(), array(
                        'style' => 'width: 270px;',
                        'placeholder' => 'Barcode',
                        'select2Options' => array(
                            'allowClear' => true,
                            'createSearchOptions' => 'js:function(term){ return {id:term, text:term} }'
                        ),
                            )
                    );
                    ?>

Cheers,

Daniel

Daniel at Apr 5, 2013, 5:23:06 AM

#12687

0 0

See ivaynberg.github.com/select2

All options array "select2Options" are passed to the "CJavaScript::encode()" and sent directly to the "$settings" in select2

$('#id').select2({$settings});

Porting "allowClear" should work.
"createSearchOptions" does not exist try "createSearchChoice"

Tonin De Rosso Bolzan at Apr 5, 2013, 1:12:13 PM

#12690

0 0

still not working.....

I created like this

<?php
echo Select2::activeDropDownList(
            $newDetail, 'productFk', Product::model()->getProductOptions(), array(
                        'empty' => 'Cari produk...',
                        'class' => 'pull-left',
                        'style' => 'width: 100%',
                        'placeholder' => 'Barcode',
                        'select2Options' => array(
                            'allowClear' => true,
//                            'createSearchChoice' => 'js:function(term){ return {id:term, text:term} }'
                        ),
                    ));
                    ?>

allowClear cannot show the 'X' button next to the selected value.

createSearchChoice makes the Select2 not working, back to only dropdown.

Any help?

Daniel at Apr 5, 2013, 1:47:32 PM

#12691

0 0

Verify your generated code

Please verify the generated html script in source code.
And contact me in forum.

Tonin De Rosso Bolzan at Apr 5, 2013, 3:06:27 PM

#12694

0 0

generated code

Hi,

The generated code for select :

an style="margin-top: 10px;" class="span3">
                    <input type="hidden" value="130406030849" id="TransactionDetail_transactionFk" name="TransactionDetail[transactionFk]">                    <select name="TransactionDetail[productFk]" id="TransactionDetail_productFk" placeholder="Barcode" style="width: 100%" class="pull-left">
<option value="">Cari produk...</option>
<option value="2">PANCI [456456456456] </option>
<option value="1">Toples [123123123123] </option>
</select>                </span>

While the javascript generated is

<script type="text/javascript">
/*<![CDATA[*/
jQuery(function($) {
$('#TransactionDetail_productFk').select2({'placeholder':'Barcode','allowClear':true,'createSearchChoice':function(term){ return {id:term, text:term} }});
...

If I commented createSearchChoice line, the select2 seemed works since I can see the placeholder and the select is a select2 css. But when I uncomment the createSearchChoice, then select2 seemed not applied. Instead a normal select dropdown is applied.

commented/uncommented the allowclear does not give any different result. But both makes the select2 applied.

By meaning select2 is applied, css for dropdown is different in addition to that I can search from the options.

Thanks you for your prompt and continuous support. Anyway, this is a great extension.

Daniel at Apr 6, 2013, 1:16:51 AM

#15039

0 0

Multiple select does not work

Hi Everybody,

I can work with single select but unfortunately couldn't work with multi-select.

form:

<div class="row">
        <?php echo $form->labelEx($model,'item_list'); ?>
        <?php
        $data = CHtml::listData(Products::model()->findAll(),'id', 'name');
        echo Select2::multiSelect('item_list', $model->item_list, $data, array(
            'required' => 'required',
            'style' => 'width: 270px;',
            'placeholder' => 'Add Products',
            'select2Options' => array(),
        ));
        ?>
        <?php echo $form->error($model,'item_list'); ?>
    </div>

controller:

public function actionCreate()
	{
		$model=new Order;
        $model->setScenario('item_list');

		// Uncomment the following line if AJAX validation is needed
		// $this->performAjaxValidation($model);

		if(isset($_POST['Order']))
		{
			//echo $model->item_list;

            $model->attributes=$_POST['Order'];
            echo $model->registration_id;
            print_r($model->item_list);
            //print_r(item_list);
            //print_r($model->item_list);
			/*if($model->save())
				$this->redirect(array('view','id'=>$model->id));*/
		}

		$this->render('create',array(
			'model'=>$model,
		));
	}

I couldn't receive value in controller. Please help me anybody.

Thanks,

StreetCoder at Oct 1, 2013, 7:35:55 AM

Categories