Download mColorPicker archive from http://www.bertera.it/software/web2py/mColorPicker-w2p.tgz ad decompress in static/ folder of your application
Add the widget in db.py
import uuid
colorpicker_js = URL(r=request,c='static/mColorPicker', f='mColorPicker.min.js')
class ColorPickerWidget(object):
"""
Colorpicker widget based on http://code.google.com/p/mcolorpicker/
"""
def __init__ (self, js = colorpicker_js, button=True, style="", transparency=False):
uid = str(uuid.uuid4())[:8]
self._class = "_%s" % uid
self.style = style
if transparency == False:
self.transparency = 'false'
else:
self.transparency = 'true'
if button == True:
self.data = 'hidden'
if self.style == "":
self.style = "height:20px;width:20px;"
else:
self.data = 'display'
if not js in response.files:
response.files.append(js)
def widget(self, f, v):
wrapper = DIV()
inp = SQLFORM.widgets.string.widget(f,v, _value=v, _type='color',\
_data_text='hidden', _style=self.style, _hex='true', _class=self._class)
scr = SCRIPT("$.fn.mColorPicker.init.replace = false; \
$.fn.mColorPicker.init.allowTransparency=%s; \
$('input.%s').mColorPicker({'imageFolder': '/%s/static/mColorPicker/'});"\
% (self.transparency, self._class, request.application))
wrapper.components.append(inp)
wrapper.components.append(scr)
return wrapper
color_widget = ColorPickerWidget()
create a test table and set the widget to our new colorpicker widget
db.define_table('house', Field('color', widget = color_widget.widget))
create the form in your controller:
def index():
form = SQLFORM(db.house)
if form.accepts(request.vars, session):
response.flash = T('New house inserted')
return dict(form=form)
Comments (3)
0
piemaster21 13 years ago
0
tobias 10 years ago
Easy to set up, but doesn't store the value in the db - the field just remains empty. I tried setting a default value in the Field definition like piemaster suggested but that didn't help.
0
chris-guest-11449 9 years ago
Pietro, you've done good work wrapping mColorPicker.js as a web2py plugin. Thank for your efforts.
Unfortunately, mColorPicker.js is from 2010 and now seems to now be abandonware.
This plugin works, but I ran into strange behaviour when I had multiple color pickers on a form. This looks to me like a bug in mColorPicker.js . I have documented a simple reproducible case in this post:
http://stackoverflow.com/questions/30836202/colour-picker-widget-for-web2py-displays-multiple