Funktion

Kalito

Erfahrenes Mitglied
Hallo,

ich habe 6 Inputfelder, welche , die sich in 5 div-Container befinden.

Über checkboxen mache ich diese div's sichtbar bzw. unsichtbar. Wenn ich nun in das Imputfeld einen wert eingebe, wird dieses auf die richtigkeit geprüft und wenn das in Ordnung ist, dann soll mittels innerHTML in ein anderes div angezeigt werden. Soweit so gut. Ich hab dann auch noch es so gestaltet, dass ich, wenn ich ein andere RadioButton tätige die Werte in dem ausgabe-div leer werden und auch das Inputfeld geleert wird.

Mein Hauptproblem ist folgendes.

Wenn ich radiobutton 1 drücke muss ich in einen Inputfeld eine Breite eingeben. Diese wird angezeigt, wunderbar. Wenn ich aber einen anderen Radiobutton drücke verschwindet das Inputfeld und ich bekomme zweie angezeigt, wo ich wieder breiten eingeben soll, die aber addiert werden.

Mit der breite bzw der addition der beiden anderen Breiten soll dann mit den anderen Eingaben was berechnet werden und da ein anderes div angezeigt werden.

Merin Problem ist einfach, das ich es nicht schaffe zu differenzieren wann er welchen wert für die Breite nehmen soll. Ich hatte zwar schon sachen, aber dies hatte aufwirkung auf die anderen Inputfelder. Über die radiobutton würde ich auch ungern gehen, da hier noch andere abfragen sind, die auf anderes eine Wirkung hat.

ein simpler Code:
Code:
<html>
    <head>
        <script language="javascript" type="text/javascript">
           // bei Bauformauswahl --> checkradio****?

            function klick(id){
                if(id == 'eins'){
                    document.getElementById("eingabe_breiteL").value = "";
                    document.getElementById("eingabe_breiteR").value = "";
                    document.getElementById("eingabe_breite").value = "1000";

                }
                if(id == 'zwei'){
                    document.getElementById("eingabe_breiteL").value = "1000";
                    document.getElementById("eingabe_breiteR").value = "1000";
                    document.getElementById("eingabe_breite").value ="";

                    //hier sind noch andere Abfragen, die hier aber nicht zur geltung kommen

                }
            }
            function showWert(){

            breite = parseInt(document.getElementById('eingabe_breite').value);

            breite = parseInt(parseInt(document.getElementById('eingabe_breiteL').value) + parseInt(document.getElementById('eingabe_breiteR').value));

            ma

           }
          </script>
    </head>
    <body>
        <div>
            <input type="radio" name="radio" id="eins" onclick="klick(this.id)" checked="checked"/> Ein
            <input type="radio" name="radio" id="zwei" onclick="klick(this.id)"/> Zwei
        </div>
        <div><input type="text" id="eingabe_breite" onblur="showWert();"/></div>
        <div><input type="text" id="eingabe_breiteL" onblur="showWert();"/></div>
        <div><input type="text" id="eingabe_breiteR" onblur="showWert();"/></div>   ,

        <div></div>
        <div id="ausgabe_breite"></div>
        <div id="ausgabe_hoehe"></div>
        <div id="preis"></div>
    </body>
</html>
 
Und was ist wenn du es so unterscheidest:

Java:
function showWert(){
if (document.getElementById("eins").checked == true) {
    breite = parseInt(document.getElementById('eingabe_breite').value);
} else {
    breite = parseInt(parseInt(document.getElementById('eingabe_breiteL').value) + parseInt(document.getElementById('eingabe_breiteR').value));
}
alert(breite);
}

Ansonsten musst du für die einzelnen Felder verschiedene Funktionen schreiben.
 
Danke nochmal. Manchmal ist man echt Betriebsblind.
Hab jetzt aber nochmal eine Frage. Habe das ganze jetzt eingebaut, und es funktioniert nicht ganz.
Ich habe 16 Bilder und je nachdem auf welches ich klicke werden bestimmte Felder zugeschaltet/abgeschaltet

Die Inputfelder
HTML:
<input type="text" name="breite" id="eingabe_breite" maxlength="4" size="1" onblur="checkWert()" value="1000"/>
<input type="text" name="breite" id="eingabe_breiteL" maxlength="4" size="1" onblur="checkWert()" value="1000"/
<input type="text" name="breite" id="eingabe_breiteR" maxlength="4" size="1" onblur="checkWert()" value="1000"/
JS-Code für Auswahl
Code:
function CheckRadio(id){
if(id == "T"){
        document.getElementById('hbe').style.display = 'block';
        document.getElementById('hbz').style.display = 'none';
        document.getElementById('sl').style.display = 'none';
        document.getElementById('sr').style.display = 'none';
        document.getElementById('sl').style.display = 'none';
        document.getElementById('o').style.display = 'none';

        document.getElementById('seite').style.display = 'block';

        wechselF = document.getElementById('eingabe_breite').value;
        document.getElementById('anzeige_breite').innerHTML = "Breite Flügel: "+ wechselF +"mm";
        document.getElementById('anzeige_SL').innerHTML ="";
        document.getElementById('anzeige_SR').innerHTML ="";
        document.getElementById('anzeige_O').innerHTML ="";

        document.getElementById('eingabe_breite').disabled = false;
        document.getElementById('eingabe_breiteL').disabled = true;
        document.getElementById('eingabe_breiteR').disabled = true;
}

if(id == "ZT"){
        document.getElementById('hbe').style.display = 'none';
        document.getElementById('hbz').style.display = 'block';
        document.getElementById('sl').style.display = 'none';
        document.getElementById('sr').style.display = 'none';
        document.getElementById('sl').style.display = 'none';
        document.getElementById('o').style.display = 'none';

        wechselF = parseInt(parseInt(document.getElementById('eingabe_breiteL').value) + parseInt(document.getElementById('eingabe_breiteR').value));
        document.getElementById('anzeige_breite').innerHTML = "Breite Flügel: "+ wechselF +"mm";
        document.getElementById('anzeige_SL').innerHTML ="";
        document.getElementById('anzeige_SR').innerHTML ="";
        document.getElementById('anzeige_O').innerHTML ="";

        document.getElementById('faslLja').disabled = true;
        document.getElementById('faslLja').checked = (false) ? true : false;
        document.getElementById('faslLnein').checked = true;
        document.getElementById('faslRja').disabled = true;
        document.getElementById('faslRja').checked = (false) ? true : false;
        document.getElementById('faslRnein').checked = true;

        document.getElementById('seite').style.display = 'none';

Bei T soll nur die breite genommen werden und bei ZT halt die Summe von breiteL und breiteR. Das klappt auch soweit. Die Funktion checkRadio wird per oncklick ausgelöst.

Für die Berrechnung bzw die Anzeige der neuen Werte habe ich noch folgenden Code, der als onblur im jeweiligen Inputfeld hinterlegt ist.
Code:
function checkWert(){
//Breitenvergleich anhand der id
if(
    (document.getElementById("T").checked == true)||  
    (document.getElementById("TSL").checked == true)||
    (document.getElementById("TSR").checked == true)||
    (document.getElementById("T2S").checked == true)||
    (document.getElementById("TO").checked == true)||
    (document.getElementById("TSOL").checked == true)||
    (document.getElementById("TSOR").checked == true)||
    (document.getElementById("T2SO").checked == true)
){
      breite = parseInt(document.getElementById('eingabe_breite').value);
}
else{
        breite = parseInt(parseInt(document.getElementById('eingabe_breiteL').value) + parseInt(document.getElementById('eingabe_breiteR').value));
 }

    document.getElementById('anzeige_breite').innerHTML = breite;
}

Wenn ich jetzt das Bild mit der id T anklicke, wird die Breite mit 1000 angezeigt. Wenn ich aber nun einen anderen Wert eingebe und das Feld verlasse, wird aber 2000 (die summe von breiteL und breiteR). Aber bei einen erneuten klick auf das bild mit der id= T wird der von mir eingetragene Wert eingegeben.
 
Zuletzt bearbeitet:
Hi,

vielleicht geht es nur mir so, aber ich kann deiner Ausführung nur schwer folgen und das Problem nachvollziehen.

Poste doch bitte einen funktionierenden Codeschnipsel (mit auslösenden Bildern, Inputs usw), anhand dessen der Fehler nachgestellt werden kann.

Ciao
Quaese
 
Ich konnte das ganze schon etwas eingrenzen. Hab aber mal eine kleien Seite gebaut. http://fensterfan.de/test/test.php

Wenn Ihr auf eine Tür klickt, wird diese rechts angezeigt, ebenfalls die eingaben aus den Inputfeldern.
Wenn ich nun im inputfeld hoehe einen neuen Wert eingebe, wird dieser auch sofort angezeigt. Leder klappt das bei breite nicht :( Ich denke es liegt an der if-Abfrage, aber die ist doch nicht anders, als bei tombe's Code oben?
 
Hi,

du prüfst in den if-Bedingungen auf die Elemente mit den IDs T und ZT. Korrekt müsste es jedoch BauteilT und BauteilZT heissen.

Weiterhin würde ich die beiden if-Anweisungen in ein verkettetes if-Konstrukt auflösen, da die zweite Bedingung nur eintreten kann, wenn die erste nicht erfüllt ist.
Code:
//Die Problemstelle
if(document.getElementById("BauformT").checked){
  breiteF = document.getElementById('eingabe_breite').value;
}else if(document.getElementById("BauformZT").checked){
  breiteF = parseInt(parseInt(document.getElementById('eingabe_breiteL').value) + parseInt(document.getElementById('eingabe_breiteR').value));
}
Ciao
Quaese
 
Danke.

Bin doch schon Urlaubsreif :)

Ich hab die If-Anweisung so gemacht, da ich 16 Bilder habe und das ganze Konstrukt auch etwas komplexer ist
 
Zurück