onclick abfragen und anzeigen @ tutorials.de: Tutorials, Forum & Hilfe

fredolin · 05.02.10 17:02

Hallo Tuts Gemeinde,

hab da mal wieder ein Problem mit JavaScript. Was will ich erreichen?
Also in einem Formular verwende ich verschiedenen Bezahlarten. Bei einigen Bezahlarten soll der Kunde dann seine Bankdaten eingeben.
Beim anklicken der Bezahlart, soll dann die Formularelemante in einengesonderten Bereich in der Webseite auf gehen.

So hier mal der Coder der Seite

PHP-Code:


ist nur ein Teil, wäre zulang wenn ich alles rein tue

Hier die Bezahlarten
<form action="#" method="post">
<table>
    <tr>
    <td><input type="radio" name="payment" value="24" class="radio" ></td>
    <td><img src="img/modullogo_bp_kk_zw.gif" align="middle" /></td>
    <td>Kreditkarte (International)</td>
    <td>&nbsp;</td>
  </tr>
        <tr>
    <td colspan=4><hr /></td>

  </tr>
    <tr>
    <td><input type="radio" name="payment" value="26" class="radio" ></td>
    <td><img src="img/modullogo_bp_lv_zw.gif" align="middle" /></td>
    <td>Lastschrift (Deutschland/Österreich)</td>
    <td>&nbsp;</td>
  </tr>
        <tr>

      <td colspan="2">&nbsp;</td>
      <td>Kontoinhaber: *</td>
      <td><input type="text" name="deb_owner" value=""></td>
    </tr>
    <tr>
      <td colspan="2">&nbsp;</td>
      <td>BLZ: *</td>
      <td><input type="text" name="deb_bankcode" value=""></td>

    </tr>
    <tr>
      <td colspan="2">&nbsp;</td>
      <td>Konto: *</td>
      <td><input type="text" name="deb_account" value=""></td>
    </tr>
        <tr>
    <td colspan=4><hr /></td>

  </tr>
    <tr>
    <td><input type="radio" name="payment" value="29" class="radio" ></td>
    <td><img src="img/modullogo_bp_gp_zw.gif" align="middle" /></td>
    <td>Giropay&reg (Deutschland)</td>
    <td>&nbsp;</td>
  </tr>

        <tr>
      <td colspan="2">&nbsp;</td>
      <td>BLZ: *</td>
      <td><input type="text" name="gir_bankcode" value=""></td>
    </tr>
    <tr>
      <td colspan="2">&nbsp;</td>
      <td>Konto: *</td>

      <td><input type="text" name="gir_account" value=""></td>
    </tr>
        <tr>
    <td colspan=4><hr /></td>
  </tr>
    <tr>
    <td><input type="radio" name="payment" value="18" class="radio" ></td>
    <td><img src="img/modullogo_bp_vk_zw.gif" align="middle" /></td>
    <td>Vorkasse (International)</td>

    <td>&nbsp;</td>
  </tr>
    <tr>
    <td colspan=4><hr /></td>
  </tr>
    <tr>
    <td><input type="radio" name="payment" value="10" class="radio" ></td>
    <td><img src="img/modullogo_bp_or_zw.gif" align="middle" /></td>
    <td>Offene Rechnung (International)</td>

    <td>&nbsp;</td>
  </tr>
    <tr>
    <td colspan=4><hr /></td>
  </tr>
      <tr>
      <td><input type="radio" name="payment" value="43" class="radio" ></td>
      <td><img src="img/modullogo_bp_sue_zw.gif" align="middle" /></td>
  </tr>

        <tr>
      <td colspan="2">&nbsp;</td>
      <td>Kontoinhaber: *</td>
      <td><input type="text" name="ebank_owner" value=""></td>
  </tr>
  <tr>
      <td colspan="2">&nbsp;</td>
      <td>BLZ: *</td>

      <td><input type="text" name="ebank_bankcode" value=""></td>
  </tr>
  <tr>
      <td colspan="2">&nbsp;</td>
      <td>Konto: *</td>
      <td><input type="text" name="ebank_account" value=""></td>
  </tr>
            <tr>

    <td colspan=4><hr /></td>
  </tr>
  <tr>
    <td colspan="2">&nbsp;</td>
    <td colspan="2"><INPUT TYPE="SUBMIT" name="_senden" value="Buchen"></td>
  </tr>
</table>
</form>

Das ist das PAymentformular, wo ich nun über das <input> Feld den Namen und den Inahlt des VALUE gerne auslesen möchte.
Wenn jemand in das FEld <input type="radio" ...../> reinklick, das ich weiss was er geklickt hat und dazu die Informationen anzeigen kann.

Ich hoffe IHr versteht mich nun besser?
Hier schon mal mein JAvaScript Code was ich probiere

PHP-Code:


function init(){
    var pa = document.getElementById("pay");
    for (i = 0; i <= pa.length; ++i);
    alert (pa);
    if(pa[i].value == "24") {
        alert("Kreditkarte");
        return true;
    } else if(pa[i].value == "26") {
        alert("Lastschrift");
        return true;
    } else if(pa[i].value == "29") {
        alert("Giropay");
        return true;
    } else if(pa[i].value == '43') {
        alert("E-Banking");
        return true;
    }
    return false;
}

Gruß
Fredolin

one6666 · 06.02.10 21:32

Wo ist den der Fehler ?
du beschreibst leider nur was du gerne machen möchtest, aber nicht wo es Probleme gibt

Was ich aber jetzt schon sehe ist das du versuchst auf ein Array zuzugreifen, document.getElementById() gibt aber kein Array aus,
Da müsstest du mit document.getElementByTagName()[] arbeiten

Sven Mintel · 07.02.10 11:02

Moin fredolin,

genaugenommen müsstest du mit document.getElemenstByName() arbeiten.

Anstatt das value-Attribut zu Prüfen(dies ändert sich nicht, egal ob der Button ausgewählt wurde oder nicht), teste darauf, ob die Eigenschaft checked des Buttons true ist.

fredolin · 08.02.10 10:14

Hallo Sven,

leider weiss ich nicht genau wie ich anfangen soll... und wie ich es aufbauen soll.. das ist mein Problem..

wenn du mir da starthilfe geben könntest..

Danke gruß
Fredolin

fredolin · 09.02.10 09:45

Habe nun doch was zusammen gebastelt.
Aber leider bekomme ich immer eine Fehlermeldung.

Hier mein JavaScript-Code

PHP-Code:




function showValue(){

    var cols = document.getElementsByName('payment');

    for (var i=0; i<cols.length; i++) {

   if (cols[i].checked == true) {

      alert('Ihr gewähltes Payment ist ' + cols[i].nextSibling.nodeValue);

      break;

   }

 }

}

ich benutze dieses Script in einem Paymentformular, wo ich mehrere Paymenttypen (KK / LS / GP / VK / OR) benutze.
Die Paymenttypen spreche ich so an

PHP-Code:




<form action="" method="post">

 <input type="radio" onClick="showValue();" name="payment" value="24" id="24" /><br />

 <input type="radio" onClick="showValue();" name="payment" value="29" id="29" /><br />

 <input type="radio" onClick="showValue();" name="payment" value="10" id="10" /><br />

u.s.w



</form>

Das Script liefert mir dann einen Fehler, wo ich nichts mit anfangen kann, weil normalerweise der Wert gesetzt bzw. gefüllt sein sollte.

Fehlermeldung: cols[i].netSibling is null

Kann ir jemand weiter helfen

Gruß
Fredolin

Sven Mintel · 10.02.10 01:58

Hier mal eine ganz simple und zugleich sehr performante Lösung.
(performant deswegen, weil sie nicht erfordert, endlos Zeilen zu durchlaufen)

Code :

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; 
                                charset=ISO-8859-1"   />
<meta name="author"             content="doktormolle" />
<meta name="date"               content="2010-02-09" />
<title>Test</title>
<style type="text/css">
<!--
form fieldset{
display:none;
}
form.klasse1 fieldset.klasse1,
form.klasse2 fieldset.klasse2,
form.klasse3 fieldset.klasse3{
  display:block
}
-->
</style>
</head>
<body>
<form action="#" method="post">
  <table border="1">
    <tr>
      <td>
        <input name="payment"  type="radio"  onclick="if(this.checked)this.form.className='klasse1';" >klasse1
        <fieldset class="klasse1">
          mehr zeugs#1
        </fieldset>
      </td>
    </tr>
    <tr>
      <td>
        <input name="payment"  type="radio"  onclick="if(this.checked)this.form.className='klasse2';" >klasse2
        <fieldset class="klasse2">
          mehr zeugs#2
        </fieldset>
      </td>
    </tr>
    <tr>
      <td>
        <input name="payment"  type="radio"  onclick="if(this.checked)this.form.className='klasse3';" >klasse3
        <fieldset class="klasse3">
          mehr zeugs#3
        </fieldset>
      </td>
    </tr>
  </table>
</form>  
</body>
</html>

Geändert wird jeweils nur der Klassenname des Formulars, der Rest geschieht über das CSS.
(Hab die zusätzlichen Daten mal in einem <fieldset> untergebracht, der IE scheint zumindest bis V7 diese Lösung im Zusammenhang mit Tabellenelementen zu Verweigern)

fredolin · 18.02.10 08:44

Das Formular ist ein Paymentformular, wo der User die Bezahlart auswählen kann die er möchte.

Was möchte ich erreichen?
ICh möchte erreichen, das bei der Auswahl der Bezahlart sich ein Textfeld oder ein zusätzliches Fomfeld, wo der User BLZ und Konto-Nr. eingeben kann, erscheint.

Super wäre, wenn dann noch ein preloder vorher läuft, der den User informiert das weitere Daten geladen werden.

So ich habe auch es hinbekommen, mit den onClick Event die ausgewählte Bezahlart per alert an zu zeigen.

Code des Paymentformular (diese wird per include in die index.php eingefügt)

PHP-Code:



<?php if ($ccard){?>
        <div class="paymentradio"><input id="24" onClick="showValue();" type="radio" name="payment" value="24" class="radio" <?php if (isset($_REQUEST['payment']) && $_REQUEST['payment']=='24') echo 'checked';?>></div>
        <div class="paymentgrafik"><img src="<?php echo $picpfad ?>modullogo_bp_kk_zw.gif" align="middle" /></div>
        <div class="paymentgrafik"><?php echo BUSINESS_PAYMENT_CCARD ?></div>
        <div class="layerdiv" id="24" style="display: none;">
            <div class="background-color: #ADADAD;">
                [B]Hier soll dann die Informationen eingeblendet werden[/B]
            </div>
        </div>
        <div class="clear"></div>
    <?php }?>
        <div class="clear"></div>
    <?php if ($debit){?>
        <div class="paymentradio"><input id="26" onClick="showValue();" type="radio" name="payment" value="26" class="radio" <?php if (isset($_REQUEST['payment']) && $_REQUEST['payment']=='26') echo 'checked';?>></div>
        <div class="paymentgrafik"><img src="<?php echo $picpfad ?>modullogo_bp_lv_zw.gif" align="middle" /></div>
        <div class="paymentgrafik"><?php echo BUSINESS_PAYMENT_DEBIT ?></div>
        <!--<div class="layerdiv">
            <?php if ($uos_direct_debit == 1){?>
                <div class="payment_box">
                    <?php echo BUSINESS_PAYMENT_KONTOINHABER ?>: <?php if (in_array('deb_owner',$checkFieldsDebitDirect)) echo '*';?><br/>
                    <input type="text" name="deb_owner" value="<?php if (isset($_REQUEST['deb_owner'])) echo $_REQUEST['deb_owner'];?>"><br/><br/>
                </div>
                <div class="payment_box">
                    <?php echo BUSINESS_PAYMENT_BLZ ?>: <?php if (in_array('deb_bankcode',$checkFieldsDebitDirect)) echo '*';?><br/>
                    <input type="text" name="deb_bankcode" value="<?php if (isset($_REQUEST['deb_bankcode'])) echo $_REQUEST['deb_bankcode'];?>"><br/><br/>
                </div>
                <div class="payment_box">
                    <?php echo BUSINESS_PAYMENT_KONTO ?>: <?php if (in_array('deb_account',$checkFieldsDebitDirect)) echo '*';?><br/>
                    <input type="text" name="deb_account" value="<?php if (isset($_REQUEST['deb_account'])) echo $_REQUEST['deb_account'];?>"><br/><br/>
                </div>
            <?php } ?>
        </div>//-->
        <div class="clear"></div>
    <?php } ?>
    <div class="clear"></div>
    <?php if ($giropay){?>
        <div class="paymentradio"><input id="29" onClick="showValue();" type="radio" name="payment" value="29" class="radio" <?php if (isset($_REQUEST['payment']) && $_REQUEST['payment']=='29') echo 'checked';?>></div>
        <div class="paymentgrafik"><img src="<?php echo $picpfad ?>modullogo_bp_gp_zw.gif" align="middle" /></div>
        <div class="paymentgrafik"><?php echo BUSINESS_PAYMENT_GIROPAY ?></div>
        <!--<div class="layerdiv" id="giropay">
            <?php if ($uos_direct_giro == 1){?>
                <div class="payment_box">
                    <?php echo BUSINESS_PAYMENT_BLZ ?>: <?php if (in_array('gir_bankcode',$checkFieldsGiroDirect)) echo '*';?><br/>
                    <input type="text" name="gir_bankcode" value="<?php if (isset($_REQUEST['gir_bankcode'])) echo $_REQUEST['gir_bankcode'];?>"><br/><br/>
                </div>
                <div class="payment_box">
                    <?php echo BUSINESS_PAYMENT_KONTO ?>: <?php if (in_array('gir_account',$checkFieldsGiroDirect)) echo '*';?><br/>
                    <input type="text" name="gir_account" value="<?php if (isset($_REQUEST['gir_account'])) echo $_REQUEST['gir_account'];?>"><br/><br/>    
                </div>
            <?php } ?>
        </div>//-->
        <div class="clear"></div>
    <?php } ?>
        <div class="clear"></div>
    <?php if ($prepaid){?>
        <div class="paymentradio"><input id="18" onClick="showValue();" type="radio" name="payment" value="18" class="radio" <?php if (isset($_REQUEST['payment']) && $_REQUEST['payment']=='18') echo 'checked';?>></div>
        <div class="paymentgrafik"><img src="<?php echo $picpfad ?>modullogo_bp_vk_zw.gif" align="middle" /></div>
        <div class="paymentgrafik"><?php echo BUSINESS_PAYMENT_VORKASSE ?></div>
        <div class="layerdiv"></div>
    <?php } ?>
        <div class="clear"></div>
    <?php if ($invoice){?>
        <div class="paymentradio"><input id="10" onClick="showValue();" type="radio" name="payment" value="10" class="radio" <?php if (isset($_REQUEST['payment']) && $_REQUEST['payment']=='10') echo 'checked';?>></div>
        <div class="paymentgrafik"><img src="<?php  echo $picpfad ?>modullogo_bp_or_zw.gif" align="middle" /></div>
        <div class="paymentgrafik"><?php echo BUSINESS_PAYMENT_OFFENERECHNUNG ?></div>
        <div class="layerdiv"></div>
    <?php } ?>
        <div class="clear"></div>
    <?php if ($ebanking){?>
        <div class="paymentradio"><input id="43" onClick="showValue();" type="radio" name="payment" value="43" class="radio" <?php if (isset($_REQUEST['payment']) && $_REQUEST['payment']=='43') echo 'checked';?>></div>
        <div class="paymentgrafik"><img src="<?php  echo $picpfad ?>modullogo_bp_sue_zw.gif" align="middle" /></div>
        <div class="paymentgrafik"><?php echo BUSINESS_PAYMENT_SOFORTUEBERWEISUNG ?></div>
        <!--<div class="layerdiv" id="ebanking">
            <?php if ($uos_direct_ebank == 1){?>
                <div class="payment_box">
                    <?php echo BUSINESS_PAYMENT_KONTOINHABER ?>: <?php if (in_array('ebank_owner',$checkFieldseBankDirect)) echo '*';?><br/>
                    <input type="text" name="ebank_owner" value="<?php if (isset($_REQUEST['ebank_owner'])) echo $_REQUEST['ebank_owner'];?>"><br/><br/>
                </div>
                <div class="payment_box">
                    <?php echo BUSINESS_PAYMENT_BLZ ?>: <?php if (in_array('ebank_bankcode',$checkFieldseBankDirect)) echo '*';?><br/>
                    <input type="text" name="ebank_bankcode" value="<?php if (isset($_REQUEST['ebank_bankcode'])) echo $_REQUEST['ebank_bankcode'];?>"><br/><br/>
                </div>
                <div class="payment_box">
                    <?php echo BUSINESS_PAYMENT_KONTO ?>: <?php if (in_array('ebank_account',$checkFieldseBankDirect)) echo '*';?><br/>
                    <input type="text" name="ebank_account" value="<?php if (isset($_REQUEST['ebank_account'])) echo $_REQUEST['ebank_account'];?>"><br/><br/>
                </div>
            <?php } ?>
        </div>//-->
        <div class="clear"></div>
    <?php } ?>
        <div class="clear"></div>
        <div class="toggler" style="text-align: center;"><INPUT TYPE="SUBMIT" name="_senden" value="<?php echo PAYMENTSEND ?>"></div>

Hier mein Code vom JavaScript, was teilweise funktioniert, wo ich nun nicht weiter weis:

Code javascript:

 
function showValue(){
    var cols = document.getElementsByName("payment");
    for(var i=0; i<cols.length; i++){
        if(cols[i].checked == true){
            if(cols[i].value == "24"){
                alert("Kreditkarte");
                var a = cols[i].value;
                alert (a);
                break;
                var pay = document.getElementById(a);
                if(!pay)return true;
                if(pay.style.display == 'none'){
                    pay.style.display == 'block';
                } else {
                    pay.style.display == 'none';
                }
                return true;
            }
        }
    }
}

Ich bekomme nun den Wert, den ich in col[i].value nicht in das document.getElementById() rein. Bekomme etweder [objectHTMLInputElement] oder es wird nichts angezeigt.

Woran kann es liegen? Weiß da jemand weiter?

Mit freundlichen Grüßen
Fredolin

tut orials.de	tut verbinden	tut dir helfen	tut kooperieren
©2000-2012 tutorials.de Alle Rechte vorbehalten	tut informieren » Impressum » Nutzungsregeln » Netiquette » Team » Redaktion	» Tutorials » Videotutorials » Showroom » Events & Contests » Chat » RSS-Feed » Blogs	» der-webdesigner.net » DesignerInAction » Design Nation » Directorforum » Flashhilfe » PHP-Resource » PHPwelt » PSD-Tutorials

Themen-Optionen

Anzeige

Ähnliche Themen

DIV anzeigen onclick?

Nur einen Wert aus DB abfragen, je nachdem Inhalt anzeigen

abfragen ob onclick Event ausgeloest wurde.

Alle 10 Abfragen Text anzeigen.

Dreamweaver MX: Ebenen anzeigen bei onClick

Stichworte

E-Mail:

Abonnieren Abbestellen