Wert aus Funktion an andere Funktion übergeben

[muellernm]

Hallo,

ich habe ein kleines tippspiel mit quoten.
Radion butons mit den Quoten für 1 X 2 und ein Input Feld.

Ich möchte nun eine Berechnung, der selektierten Quote mal den Wert aus dem Input

Habe auf den radios das Onchange= getQuote(this) mit folgender Funktion

function getQuote(quote){
    var wert = quote.value;
  
    return wert;
    console.log(wert);
    

}

auf dem Input habe Ich das oninputchange = moeglicherGewinn(this,wert)

function moeglicherGewinn(input,wert){

    var x = input.value;
    var y = wert;
    $(input).parent().parent().parent().next('.gewinn').html('Gewinn:' + x + y);

}

Wenn Ich das allerdings aufrufe erscheint "wert is not defined."

Wie bekomme Ich den die Variable wert aus Funktion 1 an meine 2. Funktion moeglcherGewinn(input,quote) übergeben?

 

[SteelWheel]

Hi und Willkommen hier im Zentraum von JS.

Wenn Du "var wert" nur innerhalb von "getQuote" hast, besteht der Namensraum nur darin - daher ist "wert" außerhalb der Funktion unbekannt und die Übergabe an "moeglicherGewinn" scheitert.

Mir scheint, als würde ein JS-Framework bei Dir zum Einsatz kommen - dennoch fährst Du Mischbetrieb (bspw. für "wert").

Wenn Du ein wenig mehr von Deiner Seite zeigst, kriegen wir da bestimmt was Schöneres zusammen hin ... !

Ansonsten gilt: Hab Spaß daran ... !

 

[muellernm]

ich habe folgenden hhtml code

<div class="form-group tipp">

                                    <div class="btn-group" data-toggle="buttons">
                                        <label class="btn btn-default btn-sm">
                                            <input type="radio" onchange="getQuote(this)" name="tipp" value="27_1_1.85" id="27_1" autocomplete="off"> 1.85                                        </label>
                                        <label class="btn btn-default btn-sm">
                                            <input type="radio" onchange="getQuote(this)" name="tipp" value="27_0_3.30" id="27_0" autocomplete="off"> 3.30                                        </label>
                                        <label class="btn btn-default btn-sm">
                                            <input type="radio" onchange="getQuote(this)" value="27_2_4.00" name="tipp" id="27_2" autocomplete="off"> 4.00                                        </label>
                                    </div>
                                </div>



                                <div class="form-group punkte">
                                    <div class="input-group input-group-sm">
                                        <input type="text" class="form-control btn-sm" oninput="moeglicherGewinn(this,wert)"
                                               name="points"
                                               id="setpoints_27" placeholder="z.b. 100">

                                        <div class="input-group-addon">P</div>
                                    </div>
                                </div>

Der Value ist so, weil ich 3 Werte übergeben muss.

Ich verwende jQuery und bootstrap. alles noch local.

- - - Aktualisiert - - -

habe es hinbekommen mit folgenden Funktionen.

Allerdings wenn ich bereits einen value ins input eingetragen habe und nachträglich die radios ändere, ändert sich das ergebnis nicht. Also entweder müsste man nocheinbauen, dass der input.value dann wieder geleert wird, oder sich automatisch die werte der radios austauschen..

Das ist momentan nochetwas zu hoch für mich

function getQuote(radio){
    value = radio.value;
    wert = value.split("_");
    wert = wert[2]
    return wert;
   // console.log(wert);
    

}


function moeglicherGewinn(input,wert){

    var x = input.value;
    var y = wert;
    var gewinn = x * y;
    $(input).parent().parent().parent().next('.gewinn').html('möglicher Gewinn: <strong>' + gewinn + "</strong> P");

}

 

[SteelWheel]

Da sind noch ein paar mehr Denkfehler drin - vorweg: Du bekommst weiterhin das Problem mit "wert". Also zerlegen wir das mal ...

Denkfehler 1: Wenn kein Radiobutton ausgewählt ist und der Nutzer direkt was in die Input-Box schreibt, fliegt es Dir schon um die Ohren.

Denkfehler 2: Du benötigst die Berechnung der jeweiligen Wege in zwei Richtungen: "top-down" und auch "bottom-up" (eintragen von oben nach unten wie auch unten nach oben; gerade bei Änderungen).

Denkfehler 3: Du wirst mehr Zeilen am Ende haben - womöglich mindestens neun! (damit ändert sich auch die Familie "tipp" je Checkbox [Du hast drei radios je "name"]) ^^

Ich weiß, was Du da machst - ich habe das selbst schon gebastelt. Also vorweg ...

Verbesserungsvorschlag: Statt "value" für die "mehreren Werte" richtest Du jeweils ein data-* ein! Damit würde Dein Input so aussehen:

<input type="radio" onchange="getQuote(this)" name="tipp27" data-id="27" data-tendenz="1" data-quote="1.85">

Auf die Felder "id" und das Attribut "autocomplete" habe ich ganz verzichtet (lässt sich via data-* bereitsdarstellen). Zu "autocomplete": Finde ich eigentlich toll (denken auch wenigen dran), aber macht nur bei Texteingabefeldern Sinn. ^^ "name" habe ich - aufgrund "Kritik" vorweg - bereits um die ID erweitert. Das Verhalten ist identisch und die Gruppenzugehörigkeit je Zeile (= Tipp) ist gewahrt.

Du benötigst eigentlich nur EINE Funktion, die aufgerufen wird, wenn sich
a) bei den Radiobuttons was ändert
b) beim Eingabefeld unten was ändert

Demnach müsstest Du eigentlich nur (!) bei jeder Änderung ...
a) alle aktiven Checkboxen mit ihren data-* Attributen einsammeln
b) optional das Eingabefeld berücksichtigen

Das könnte dann z. B. (entschlackt) so aussehen ...

<input type="radio" name="tipp27" data-id="27" data-tendenz="1" data-quote="1.85" /> 1.85
<input type="radio" name="tipp27" data-id="27" data-tendenz="0" data-quote="3.30" /> 3.30
<input type="radio" name="tipp27" data-id="27" data-tendenz="2" data-quote="4.00" /> 4.00

<input type="text" class="form-control btn-sm" name="points" id="setpoints_27" placeholder="z. B. 100" />

$(function()){
  $("input[type=radio]").on('click', function(){
      moeglicherGewinn(); // den habe ich für das Verständnis absichtlich so gesetzt!
  });

  $("input[id^='setpoints_']").on('input', function(){
      moeglicherGewinn(); // Grund wie oben
  });
}

Der HTML-Teil lässt sich auf diese Weise simpel erweitern - jede Zeile ist autark zu einer anderen. Das JavaScript dürfte in der Form alle Erweiterungen bereits abdecken - damit ist Dein Quellcode schon ordentlich "entlastet". Die Schreibweise ist - wie kommentiert - absichtlich so gewählt, um es verständlicher zu machen.

Sooo ... reden wir jetzt noch über die Funktion "moeglicherGewinn":
- diese holt alle aktiven Checkboxen und liest zugehörige data-* Attribute aus (weil für die Berechnung benötigt)
- berücksichtigt u. U. gesetzt Zahlen im jeweiligen Textfeld

Das ist jetzt nicht getestet, könnte aber so funktionieren ...

function moeglicherGewinn(){
  $("input[name^='tipp']").each(function(){
    var $obj = $(this),
         id = $obj.data('id'), // hier steht jetzt "27" drin
         tendenz = $obj.data('tendenz'),
         quote = $obj.data('quote'),
         setpoints = parseInt($("#setpoints_"+id).val(),10);

     // ab hier dann Deine Berechnungen zzgl. Eintrag in das Textfeld, was rausspringt
  });
}

Du hast daher immer (!) aktuelle Änderungen drin und keine Hektik mit Übergabewerten - empfinde ich als etwas komfortabler. Aber wie erwähnt - keine Gewähr auf Funktion bei Copy/Paste - das ist jetzt "mal eben" hier drin entstanden.

Quoten addieren sich und werden mit dem Einsatz multipliziert ... ... und der neuste Schrei ist eine "Versicherung" auf Tipps - das nur am Rande.

Viele Grüße und viel Erfolg.

 

[muellernm]

Viele Dank, ich werde das heute einmal ausprobieren.