[EXTENSION] Color picker (jQuery based)

Yii 1.1 Extensions
1

Feel free to improve it, and to discuss the current implementation here.

http://www.yiiframew…on/colorpicker/

2

Please update the color picker widget, since a bug has been fixed. Read the extension page for more information.

3

colorpicker is not working

i find out the problem is the variable $value in EColorPicker.php.

  /**

    * The default color. String for hex color

    *

    * @var <type>

    */

  private $value = ‘000000’;

i think that maybe there is a conflict when you use $value, if i change it to $value_test  it working fine. please check out .

4

I noticed the same thing. I changed the variable name but this widget still dont show up (just a text field visible). I also noticed that placing a color picker on the same page as date picker affects the latter (just a text field).

/Tommy

5

Quote

colorpicker is not working

i find out the problem is the variable $value in EColorPicker.php.

  private $value = ‘000000’;

  i think that maybe there is a conflict when you use $value, if i change it to $value_test  it working fine. please check out .

Please change the property to [tt]public $value[/tt], or download 1.4, which has the code I should have been uploaded in the first time. I mistakenly uploaded the wrong code, sorry  :-[

6

Quote

I noticed the same thing. I changed the variable name but this widget still dont show up (just a text field visible). I also noticed that placing a color picker on the same page as date picker affects the latter (just a text field).

Hi Tommy, maybe your using both examples without changing the [tt]name[/tt] property. This causes that both input fields have the same name. This should work fine:

<?php


$this->widget('application.extensions.juidatepicker.EDatePicker',


              array(


                    'name'=>'dp',


                    'language'=>'pt_BR',


                    'mode'=>'imagebutton',


                    'dateFormat'=>'m-d-yy',


                    'fontSize'=>'0.8em',


                    'htmlOptions'=>array('size'=>10)


                   )


             );


             


$this->widget('application.extensions.colorpicker.EColorPicker',


              array(


                    'name'=>'cp',


                    'mode'=>'textfield',


                    'fade' => false,


                    'slide' => false,


                    'curtain' => true,


                   )


             );

Notice that name is both the [tt]id[/tt] and the [tt]name[/tt] of the [tt]input[/tt] tag, which you'll use to get the values inside your controller. This is if your're not using a model. If you're using a model then the [tt]name[/tt] and [tt]id[/tt] will be the model's attribute name.

7

Thanks MetaYii,

I already had different names. I upgraded to 1.4 but still no luck. Then I tried Firefox 3 and it seems to work as expected. I verified IE6/IE7 both have the same problem.

/Tommy

8

I enabled the client script debugger and got an error message pointing me to line 133. Thus by removing a comma in EColorPicker.php line 395 the problem seems to be fixed. Works in IE6, IE7 and Firefox. The listing below ends in line 400.



            $js =<<<EOP


$('#{$this->htmlOptions['id']}').ColorPicker({


   {$js_effects}


	onsubmit: function(hsb, hex, rgb) {


		$('#{$this->htmlOptions['id']}').val(hex);


	},


	onBeforeShow: function() {


		$(this).ColorPickerSetColor(this.value);


	},


   onchange: function(hsb, hex, rgb) {


      $('#{$this->htmlOptions['id']}').val(hex);


   }


})


.bind('keyup', function(){


	$(this).ColorPickerSetColor(this.value);


});


EOP;
9

Wow… thanks a lot for finding and reporting this. I should get a Windows box, javascript is a mess on MSIE :cry:

Fixed on 1.5

10

first let me say nice job, i like the control.

one thing…  even though i set the 'value' option on creation (and/or subsequently), the hex gets set, but the RGB is always 255,0,0.

i've noticed  that if i flip between windows a few times (or tabs, or whatever might cause the screen to redraw i suppose) it eventually gets set correctly.

any thoughts?  thanks

11

Hello I’ve couple of problems with color picker:

  1. I use it in a form and it perfectly saves the value to the database, but when I want to update the record it doesn’t read the value from the database and prompts the default value (“000000”). This is the portion of code in the form:

[html] <div class="row">

	&lt;?php echo &#036;form-&gt;labelEx(&#036;model,'color'); ?&gt;


	&lt;?php &#036;this-&gt;widget('application.extensions.colorpicker.EColorPicker', 


                  array(


                        'name'=&gt;'MyModel[color]',


                        'mode'=&gt;'textfield',


                        'fade' =&gt; false,


                        'slide' =&gt; false,


                        'curtain' =&gt; true,


                       )


                 ); ?&gt;


	&lt;?php echo &#036;form-&gt;error(&#036;model,'color'); ?&gt;


&lt;/div&gt;[/html]

  1. As you can see I had to set the name to "ModelName[field]". Could you add this to documentation for future users?

  2. How can I represent the chosen color in the view/grid? I would normally use a square small <DIV> whose background is set to the chosen color, but I don’t know how to do it in Yii.