CODEWITHSUNDEEP
javascriptjquery
NoWar
NoWar

Reputation: 37633

hide farbtastic color code

There is a great http://acko.net/blog/farbtastic-jquery-color-picker-plug-in/

I need to do 2 things:

a. Hide color code that we can see under 

<input readonly="readonly" type="text" id="color"  name="color" value="#123456" />

b. Keep this code to some other hidden field.

How it can be done?

Thank you!

Upvotes: 0

Views: 455

Answers (2)

The Alpha
The Alpha

Reputation: 146191

Try this

HTML

<form>
    <input type="text" id="color" name="color" />
    <input type="hidden" id="colorValue" name="colorValue" />
</form>
<div id="colorpicker"></div>​

JS

$(document).ready(function() {
    var picker = $.farbtastic('#colorpicker');
    picker.setColor("#fff");
    picker.linkTo(function onColorChange(color) {
        $('#color').css({'background-color':color});
        $('#colorValue').val(color);
    });
});

DEMO.

Upvotes: 4

Mihai Iorga
Mihai Iorga

Reputation: 39704

I cannot see the script you're referring, page won't load, but I'm pretty sure you just need to change the type into hidden, when it's hidden you can also remove the readonly attribute:

<input type="hidden" id="color" name="color" value="#123456" / >

I assume that script automatically updated the field you mentioned, if it's hidden it will still update it.

Upvotes: 1

Related Questions