开发者

In an html form how can you have a color picker and how is it sent to a database

I'm creating an html form in dreamweaver and it requires the user to pick a color. Now I went on to there little widget browser thing and added the color picker jquery widget they had. My question, though is how can this information be sent to the sql database i have set up. Another form of the question would be what dat开发者_运维百科a type would the color be.

Thanks in advance!


Just have a varchar(6) field in your database, and a simple <input type="text" maxlength="6" size="6" /> field on your page.

In order to enable progressive enhancement/graceful degradation, you can then further build on this by having a jQuery plugin that enables the user to "pick a colour". That is, when the text field gets focus, a colour picker pops up, allowing a user to easily select a colour. Plug in depending, once the choice has been made, the field gets updated with a 6 digit hexadecimal colour value, such as 000000 for a black choice, or FFFFFF for white. You get the jist.

You can then just insert this into your database.

The added bonus of doing it in this way, is that it allows users who know a hex code just to type it in, or if they want to play with colours, to select one themself. Plus, non-Javascript enabled clients are not disadvantaged in this way and can still fill in the form, but would just need to make a manual entry by code.

Hope this helps.


You could send the information to the sql database as a hexadecimal color code, check out: http://blog.meta100.com/post/600571131/mcolorpicker

You could store it in the database as a normal varchar(6).

EDIT: It is better to store it in the database as a normal char(6).


You send the data to a server side script which adds it to your database. You could do this via ajax (http://api.jquery.com/jQuery.ajax/). Why not just store it as a string?


Thanks to HTML5, you can simply use the new "color" input field type:

<input type="color" name="my_color" />

Form submission sends it as the hex color value (e.g. white = #ffffff)

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜