Colorpicker

[timepoint5]

Da ich verschiedene farben auf einer seite editieren will hab ich einen colorpicker:

<table border=0 cellspacing=0 cellpadding=4 width=100%>
 <tr>
 <td bgcolor="buttonface" width=50%></td>

  <td bgcolor="buttonface" valign=center><div style="background-color: #000000; padding: 1; height: 21px; width: 50px"><div id="ColorPreview" style="height: 100%; width: 100%"></div></div></td>
  <td bgcolor="buttonface" valign=center><input type="text" name="ColorHex" value="" size=15 style="font-size: 12px"></td>
  <td bgcolor="buttonface" width=100%></td>
 </tr>
</table>

<table border=0 cellspacing=1 cellpadding=0 bgcolor=#000000 style="cursor: hand;">
<tr>
<td bgcolor=#000000 onMouseOver=View('000000') onClick=Set('000000') height=10 width=10></td>
<td bgcolor=#000000 onMouseOver=View('000000') onClick=Set('000000') height=10 width=10></td>
<td bgcolor=#000000 onMouseOver=View('000000') onClick=Set('000000') height=10 width=10></td> 

usw...

Ich hätte jetzt aber gern das so, das ich verschiedene textfields mit einem radiobutton in fokus setze, und das dann onCLick auf die jeweilige farbe, das textfield mit dem wert gefüllt wird.
Ich hab mir hierzu schon diesen thread angekuckt:
http://php-resource.de/forum/showthr...0&pagenumber=2
Aber sorecht komm ich da nicht weiter.
Hat jemand eine idee?

Gruss

[wahsaga]

Re: Colorpicker

Original geschrieben von timepoint5
Ich hätte jetzt aber gern das so, das ich verschiedene textfields mit einem radiobutton in fokus setze, und das dann onCLick auf die jeweilige farbe, das textfield mit dem wert gefüllt wird.

gib dem radiobutton der vor einem textfeld steht die ID des textfeldes als value.

jetzt kannst du beim klick auf eine deiner 'farben' über den value des radiobuttons die ID des zugehörigen textfeldes rausfinden, und dort dann einen wert reinschreiben.

[timepoint5]

hui ich hab ehrlich gesagt keine ahung von js, ich hätte etwas in der richtung onClick setfokus probiert, könnte das so auch gehen`?

Vielen dank!

[wahsaga]

Original geschrieben von timepoint5
ich hätte etwas in der richtung onClick setfokus probiert, könnte das so auch gehen`?

ich weiss jetzt nicht genau was du meinst...

du kannst javascript jedenfalls nicht sagen "schreibe einen text in das feld, das gerade den fokus hat" - sowas gibt's nicht.

[timepoint5]

Vielleicht hat es auch deshalb nicht geklappt

Du hast gesagt:

gib dem radiobutton der vor einem textfeld steht die ID des textfeldes als value.

jetzt kannst du beim klick auf eine deiner 'farben' über den value des radiobuttons die ID des zugehörigen textfeldes rausfinden, und dort dann einen wert reinschreiben.

Mit php wäre das ja recht einfach, aber wie macht man das in js?

[MelloPie]

Original geschrieben von timepoint5
hui ich hab ehrlich gesagt keine ahung von js, ...

Keine Ahnung? Dann wirste auch net weit kommen...

[timepoint5]

`Doch nur dauerts dann halt stunden länger, um js kommt man ja nicht herum, aber so eine sache hatte ich halt noch nie.

Ich will ja auch keinen code, sondern nur einen ansatz. Mit Wahsagas tipp konnte ich trotz nachlesen und googlen, noch nicht allzuviel anfangen deshalb hab ich noch einmal nach gefragt.

[MelloPie]

Keine Ahnung bedeutet, ich checks nicht, auch wenn Du's mir vorkaust.
Da gibts einige Experten...

Bissi ahnung heisst ich kann wenigstens etwas Logik verstehen... etc.

[timepoint5]

Ich hab mich halt geärgert, weil ich es selbst nicht hinbekommen hab --> ich hab keine ahung.

Frage neu formuliert:

Wie bekomm ich die value eines aktivierten radio buttons, ohne alle abzuklappern, und wie kann ich diesen wert dann weiter benützen ohne eine menge ifs?

Ich hab an soetwas gedacht gehabt, aber da bin ich nicht weiter gekommen:

<script language="javascript">
  function w1() { document.f1.a1.value="123";};
  function w2() { document.f1.a1.value="abc";};
  function w3() { document.f1.a1.value="+++";};  
</script>

<form name="f1">
<input name="r1" type=radio value="1" onClick="w1()">Wahl1
<input name="r1" type=radio value="2" onClick="w2()">Wahl2
<input name="r1" type=radio value="3" onClick="w3()">Wahl3
  ausgew&auml;hlt: <input name="a1" type=text>
</form> 

Vielen dank

[MelloPie]

Sowas:?

<script language="javascript">
function w(wert) {
    document.f1.a1.value = wert;
}
</script>

<form name="f1">
<input name="r1" type=radio value="1" onClick="w('123');">Wahl1
<input name="r1" type=radio value="2" onClick="w('abc');">Wahl2
<input name="r1" type=radio value="3" onClick="w('+++');">Wahl3
  ausgew&auml;hlt: <input name="a1" type=text>
</form>

[timepoint5]

Nicht so ganz.
Ich hab mich unklar ausgedrückt:
Ich habe einen js colorpicker, eine tabelle siehe oben die viele farben enthält und ein js das wenn man die maus über eine farbe hält, den wert der farbe in einem text feld(name=ColerHex) anzeigt:

function View(color) {                 
  document.all.ColorPreview.style.backgroundColor = '#' + color;
  document.all.ColorHex.value = '#' + color;
} 

Das ist schon mal nicht schlecht, nur muss man sich jetzt die farbe merken, und in die verschiedene txt felder eintragen.
Deshalb die idee mit den radio buttos:

Hinter den textfeldern ist ein radio button, aktiviert man den dann wird der farbewert in das feld eingeschreiben, OnClick arretiert den wert.

Ich bekomm es nicht hin das nur das per radio button "aktivierte" feld mit dem wert gefüllt wird.



Sorry das war echt mit verständlich beschreiben.

[timepoint5]

EDIT ging doch nicht

[timepoint5]

so jetzt hab ich es schon soweit das es mit den radio buttons funktioniert

function View(color) {             
  var f = document.f1
  

for (var i=0; i<f.hex.length; i++)
   if (f.hex[0].checked){
      document.all.ColorPreview.style.backgroundColor = '#' + color;
  document.all.ColorHex.value = '#' + color; }
if (f.hex[1].checked) {
 document.all.ColorPreview.style.backgroundColor = '#' + color;
  document.all.Colordex.value = '#' + color; }


}


usw 

Wie kann ich das jetzt machen das OnClick der Wert arretiert wird?

[timepoint5]

solved

function Init() {                                                       // run on page load
 
  stopper = false;
  color = window.dialogArguments;
  color = ValidateColor(color) || '000000';
  View(color);                                                          // View default color
}



function hold() {
stopper = true;
}

function View(color) {                  // preview color
if (stopper == false) {
  var f = document.f1


  
  for (var i=0; i<f.hex.length; i++)
   if (f.hex[0].checked){
      document.all.ColorPreview.style.backgroundColor = '#' + color;
  document.all.ColorHex.value = '#' + color; }
if (f.hex[1].checked) {
 document.all.ColorPreview.style.backgroundColor = '#' + color;
  document.all.Colordex.value = '#' + color; }

}
}