/    Sign up×
Community /Pin to ProfileBookmark

Question from a JS illiterate (Sorry, can’t really be descriptive of the problem!)

I’m trying to create a <form> where users will pick a color to use on some HTML content that I’m programmatically generating using PHP. To have a nice color picker, I used some popular JS code called ColorPicker by Matt Kruser ([url]http://www.mattkruse.com/javascript/colorpicker/[/url]).

In his example on the page linked above, you see that after you pick the color, the hexadecimal code gets filled in the <input> area using the following code:

[CODE]<INPUT TYPE=”text” NAME=”color2″ SIZE=”20″ VALUE=””>
<A HREF=”#” onClick=”cp2.select(document.forms[0].color2,’pick2′);return false;” NAME=”pick2″ ID=”pick2″>Pick</A>
[/CODE]

I would like it to work differently, but I don’t know JS, so I don’t know how to modify it. Here’s how I’d like it to work instead:

When a user clicks on “Pick” and selects the color, I’d like to have some text next to the color picker that says “Current Color.” And that text should have the color that the user chose.

Some thing like the following (which will obviously not work, I’m just trying to illustrate):

[CODE]
<LABEL name=”color2″ style=”color: user_selected_color; font-weight: bold;”>Current Color</LABEL>
<A HREF=”#” onClick=”cp2.select(document.forms[0].color2,’pick2′);return false;” NAME=”pick2″ ID=”pick2″>Pick</A>
[/CODE]

Anyone know how to do that?

Thanks a lot,

to post a comment
JavaScript

0Be the first to comment 😎

×

Success!

Help @msafi spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 6.17,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...