✔ jQuery dynamisch Selectbox.selected index ändern

[raybrackho]

Ich sitze hier grade an einem simplen Produktkonfigurator. (Zwei Farben)
Ich habe einen Colorpicker, dieser soll nun je nach ausgewählter Farbe einen Wert in einer SelectBox anwählen.
Damit wird dann ein PNG aus zwei verschiedenen Grafiken zusammengesetzt.

Nun versuche ich den ausgegebenen Wert meines Colorpickers zu verwenden um den Index meiner Selectbox zu ändern, aber irgendwie klappt das nicht.

$(document).ready(function(){

farbeA = $.url.param("farbe");

$('#cpm').colorPicker
({
			
defaultColor: farbeA | 0, // index of the default color (optional)
columns: 8,     // number of columns (optional)  
color: ['#ffffff','#000000', '#272727', '#001126', '#001805', '#200500', '#201400', '#1d0024'], // list of colors (optional)

// click event - selected color is passed as arg.
click: function(colorm)
{
$('#outputm').html(colorm.replace(/#ffffff/,"Weiß").replace(/#272727/,"Anthrazit").replace(/#001126/,"Dunkelblau").replace(/#001805/,"Dunkelgrün").replace(/#200500/,"Dunkelrot").replace(/#201400/,"Braun").replace(/#1d0024/,"Dunkellila").replace(/#000000/,"Schwarz"));

$(function(){
	$("#farbe_selectbox option[value=$('#outputm').html(colorm)]").attr("selected", "selected");
}); // um diese Funktion geht es!

},

});

Ich versuche also bei meiner Selectbox (id=farbe_selectbox)

<select name="farbe_selectbox" id="farbe_selectbox" onChange="calc()">
	<option value="Weiß" selected="selected">Weiß</option>
	<option value="Schwarz">Schwarz</option>
	<option value="Anthrazit">Anthrazit</option>
	<option value="Dunkelblau">Dunkelblau</option>
	<option value="Dunkelgrün">Dunkelgrün</option>
	<option value="Dunkelrot">Dunkelrot</option>
	<option value="Braun">Braun</option>
	<option value="Dunkellila">Dunkellila</option>
</select>

Je nach ausgewählter Farbe im Colorpicker den Index zu wechseln.
Klappt leider nicht wie erhofft.
Ich denke mal der Fehler liegt darin , dass ich einfach versucht habe an das "click" event noch eine Funktion dranzuhängen. Gibt es hier eine andere Möglichkeit?

 

[raybrackho]

Ich habe das ganze jetzt mal soweit umgebaut, dass ich auf die SelectBox verzichte und mein PNG direkt aus den JS Variablen zusammenbaue. Beim Seitenaufruf mit URL Vars klappt das auch, nur nicht wenn ich die Farben im Colorpicker durch klicken ändere.

<script type="text/javascript">
<!--

$(document).ready(function(){

farbeA = $.url.param("farbe");

$('#cpm').colorPicker({
			
defaultColor: farbeA | 0, // index of the default color (optional)
columns: 8,     // number of columns (optional)  
color: ['#ffffff','#000000', '#272727', '#001126', '#001805', '#200500', '#201400', '#1d0024'], // list of colors (optional)

// click event - selected color is passed as arg.
click: function(colorm){

$('#outputm').html(colorm.replace(/#ffffff/,"Weiß").replace(/#272727/,"Anthrazit").replace(/#001126/,"Dunkelblau").replace(/#001805/,"Dunkelgrün").replace(/#200500/,"Dunkelrot").replace(/#201400/,"Braun").replace(/#1d0024/,"Dunkellila").replace(/#000000/,"Schwarz"));
},
//irgendwo hier muss der Funktionsaufruf rein
});

Hier möchte ich jetzt zusammen mit der Replace Funktion eine JS Funktion aufrufen Namens "calc()".
Diese gibt die Variablen an mein PNG Script weiter. Aber wie kann ich diese Funktion bei einem Klick auf meine Farbfelder aufrufen?

function calc(){
var m_farbe=document.getElementById("outputm").innerHTML;
document.getElementById("bild").src = "phpimg.php?mf="+m_farbe;}

 

[raybrackho]

Sorry dass ich hier selbstgespräche führe, aber ich habs hingekriegt.

ich habe einfach an das Ende meines Colorpicker-Code folgendes drangehängt:

$('#cpm').click(calc);