SetaPDF
-


Hinweise


Antwort
 
LinkBack Themen-Optionen Thema durchsuchen Thema bewerten
Alt 08.05.2008, 11:35   #1
TP-Junior
 
Registriert seit: Jan 2008
[LaBeerdy] macht alles soweit korrekt

Grafikbutton im Formular > Problem mit Validation


Hallo,

Ich habe folgendes Problem und wäre über Hilfe sehr dankbar:

Ich habe ein funktionierendes Formular das sich auf zwei Seiten aufteilt, jedoch auf einer einzigen html Seite gecodet ist.
Die erste Seite beinhaltet ein paar radios, die zweite Seite die normalen Kontaktinfos und die dritte Seite ist nur die Bestätigung über den Absendevorgang.

Alles einwandfrei...

Wenn ich jetzt jedoch aus den normalen "Weiter" und "Submit" Buttons grafische Buttons mache kommt schon bei Klick auf Weiter die Fehlermeldung das bitte alle Felder ausgefüllt werden mögen obwohl ich auf Seite 2 noch keine Daten eingegeben habe. Diese Meldung soll natürlich nur kommen wenn ich auf den Absenden Button klicke und einige Felder vom Nutzer vergessen wird. Die Abfrage findet also zu früh statt.

Dies hier sind die normalen Buttons:

Weiter:

Code:
<input type=button onClick="if (validatePage1()) { collapseElem('mainForm_1'); expandElem('mainForm_2');}" class="mainForm" value="Weiter"/>
Und Absenden:

Code:
<input id="saveForm" class="mainForm" type="submit" value="Absenden" />
Eingefügt habe ich die Grafik bei "Weiter" so:

Code:
<input type=image onClick="if (validatePage1()) { collapseElem('mainForm_1'); expandElem('mainForm_2');}" "src="/index_r7_c12.jpg" value="Weiter"/>
Die Frage ist also: Warum findet die Abfrage zu früh statt und wie kann ich das verhindern?

Geändert von [LaBeerdy] (08.05.2008 um 11:51 Uhr).
[LaBeerdy] ist offline   Mit Zitat antworten


Alt 10.05.2008, 19:10   #2
TP-Junior
 
Registriert seit: Jan 2008
[LaBeerdy] macht alles soweit korrekt
Hm,...hat keiner eine Idee?

Vielleicht zumindest einen Lösungsansatz?
[LaBeerdy] ist offline   Mit Zitat antworten
Alt 10.05.2008, 20:19   #3
TP-Urgestein
 
Benutzerbild von webcreate
 
Registriert seit: Nov 2003
Ort: NRW
webcreate ist einer der Eckpfeiler des TP - ohne ihn geht nichtswebcreate ist einer der Eckpfeiler des TP - ohne ihn geht nichtswebcreate ist einer der Eckpfeiler des TP - ohne ihn geht nichtswebcreate ist einer der Eckpfeiler des TP - ohne ihn geht nichtswebcreate ist einer der Eckpfeiler des TP - ohne ihn geht nichtswebcreate ist einer der Eckpfeiler des TP - ohne ihn geht nichtswebcreate ist einer der Eckpfeiler des TP - ohne ihn geht nichtswebcreate ist einer der Eckpfeiler des TP - ohne ihn geht nichtswebcreate ist einer der Eckpfeiler des TP - ohne ihn geht nichtswebcreate ist einer der Eckpfeiler des TP - ohne ihn geht nichtswebcreate ist einer der Eckpfeiler des TP - ohne ihn geht nichts
Ggf. hilft es, wenn Du mal mehr zeigst ... wir haben hier keine Glaskugeln.
__________________
Gruß Mark
Mein Blog zum TP || XING Profil || grafiker.de Profil || How to use GOOGLE
emCalculator 1.0

webcreate IT SOLUTIONS
www.webcreate-nrw.de

>>> der code ist so scheisse, soweit hab ich nicht gelesen <<<
webcreate ist offline   Mit Zitat antworten
Alt 10.05.2008, 20:20   #4
TP-Senior
 
Benutzerbild von Singal
 
Registriert seit: Apr 2008
Singal macht sich hier sehr viel Mühe
Schon mal versucht, den Butten per CSS mit einer Klasse zu formatieren?
Singal ist offline   Mit Zitat antworten
Alt 11.05.2008, 00:27   #5
TP-Junior
 
Registriert seit: Jan 2008
[LaBeerdy] macht alles soweit korrekt
Eine Klasse ist schon zugeordnet...Daher denke ich nicht das da das Problem liegt. Oder müssen in dieser Klasse ganz bestimmte Werte eingetragen sein?

Jedenfalls hier einmal der gesamte Code. Aber von der funktionierenden Version habe ich wie gesagt nur die Dinge geändert die in meinem ersten Beitrag zu sehen sind.
Den Link um sich den Fehler mal anzusehen: Link

Ben: aod-web
Pass: testzugang

HTML-Code:
	<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
	<html>
	<head>
		<title>AOD-Web Kontakt</title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"><link href="style.css" rel="stylesheet" type="text/css">
		<!-- calendar stuff -->
		      <link rel="stylesheet" type="text/css" href="calendar/calendar-blue2.css" />
		      <script type="text/javascript" src="calendar/calendar.js"></script>
		      <script type="text/javascript" src="calendar/calendar-en.js"></script>
		      <script type="text/javascript" src="calendar/calendar-setup.js"></script>
		<!-- END calendar stuff -->

	    <!-- expand/collapse function -->
	    <SCRIPT type=text/javascript>
		<!--
		function collapseElem(obj)
		{
			var el = document.getElementById(obj);
			el.style.display = 'none';
		}


		function expandElem(obj)
		{
			var el = document.getElementById(obj);
			el.style.display = '';
		}


		//-->
		</SCRIPT>
		<!-- expand/collapse function -->


		<!-- expand/collapse function -->
		    <SCRIPT type=text/javascript>
			<!--

			// collapse all elements, except the first one
			function collapseAll()
			{
				var numFormPages = 2;

				for(i=2; i <= numFormPages; i++)
				{
					currPageId = ('mainForm_' + i);
					collapseElem(currPageId);
				}
			}


			//-->
			</SCRIPT>
		<!-- expand/collapse function -->


		 <!-- validate -->
		<SCRIPT type=text/javascript>
		<!--
			function validateField(fieldId, fieldBoxId, fieldType, required)
			{
				fieldBox = document.getElementById(fieldBoxId);
				fieldObj = document.getElementById(fieldId);

				if(fieldType == 'text'  ||  fieldType == 'textarea'  ||  fieldType == 'password'  ||  fieldType == 'file'  ||  fieldType == 'phone'  || fieldType == 'website')
				{	
					if(required == 1 && fieldObj.value == '')
					{
						fieldObj.setAttribute("class","mainFormError");
						fieldObj.setAttribute("className","mainFormError");
						fieldObj.focus();
						return false;					
					}

				}


				else if(fieldType == 'menu'  || fieldType == 'country'  || fieldType == 'state')
				{	
					if(required == 1 && fieldObj.selectedIndex == 0)
					{				
						fieldObj.setAttribute("class","mainFormError");
						fieldObj.setAttribute("className","mainFormError");
						fieldObj.focus();
						return false;					
					}

				}


				else if(fieldType == 'email')
				{	
					if((required == 1 && fieldObj.value=='')  ||  (fieldObj.value!=''  && !validate_email(fieldObj.value)))
					{				
						fieldObj.setAttribute("class","mainFormError");
						fieldObj.setAttribute("className","mainFormError");
						fieldObj.focus();
						return false;					
					}

				}



			}

			function validate_email(emailStr)
			{		
				apos=emailStr.indexOf("@");
				dotpos=emailStr.lastIndexOf(".");

				if (apos<1||dotpos-apos<2) 
				{
					return false;
				}
				else
				{
					return true;
				}
			}


			function validateDate(fieldId, fieldBoxId, fieldType, required,  minDateStr, maxDateStr)
			{
				retValue = true;

				fieldBox = document.getElementById(fieldBoxId);
				fieldObj = document.getElementById(fieldId);	
				dateStr = fieldObj.value;


				if(required == 0  && dateStr == '')
				{
					return true;
				}


				if(dateStr.charAt(2) != '/'  || dateStr.charAt(5) != '/' || dateStr.length != 10)
				{
					retValue = false;
				}	

				else	// format's okay; check max, min
				{
					currDays = parseInt(dateStr.substr(0,2),10) + parseInt(dateStr.substr(3,2),10)*30  + parseInt(dateStr.substr(6,4),10)*365;
					//alert(currDays);

					if(maxDateStr != '')
					{
						maxDays = parseInt(maxDateStr.substr(0,2),10) + parseInt(maxDateStr.substr(3,2),10)*30  + parseInt(maxDateStr.substr(6,4),10)*365;
						//alert(maxDays);
						if(currDays > maxDays)
							retValue = false;
					}

					if(minDateStr != '')
					{
						minDays = parseInt(minDateStr.substr(0,2),10) + parseInt(minDateStr.substr(3,2),10)*30  + parseInt(minDateStr.substr(6,4),10)*365;
						//alert(minDays);
						if(currDays < minDays)
							retValue = false;
					}
				}

				if(retValue == false)
				{
					fieldObj.setAttribute("class","mainFormError");
					fieldObj.setAttribute("className","mainFormError");
					fieldObj.focus();
					return false;
				}
			}
		//-->
		</SCRIPT>
		<!-- end validate -->




	    <style type="text/css">
<!--
.Stil1 {color: #FFFFFF}
.Stil8 {font-size: 24px; font-weight: bold; color: #FFFFFF;}
body {
	margin-left: 10px;
	margin-top: 0px;
	margin-right: 2px;
	margin-bottom: 0px;
}
.Stil11 {
	color: #000000;
	font-size: 26px;
}
.Stil12 {font-size: 14px}
.Stil13 {
	font-size: 22px;
	font-family: Verdana;
}
.Stil14 {font-size: 13px}
.Stil15 {font-family: Verdana}
body,td,th {
	font-family: Verdana;
}
-->
        </style>
    </head>

	<body onLoad="collapseAll()">

	<div id="mainForm">




<div id="formHeader">
  <table width="402" border="0" align="center" cellspacing="0">
      <tr>
                    <th width="400" height="45" scope="col"><div align="left" class="Stil8 Stil11 Stil13">Ihre Anfrage</div></th>
      </tr>
                </table>
	  </div>


<BR/><!-- begin form -->
	  <form method=post enctype=multipart/form-data action=processor.php onSubmit="return validatePage2();">
		  <ul class=mainForm id="mainForm_1">
		  <table width="442" border="0" align="center" cellspacing="0">
            <tr>
              <td scope="col"><div align="left" class="Stil12 Stil15">Gerne unterbreiten wir Ihnen ein Angebot zum  monatlichen Festpreis. Wenn Sie uns einige Angaben zu sich bzw. Ihrem  Betrieb machen, können wir vorab recherchieren, welches Net-Konzept zu  Ihnen und Ihrer Branche passt und auch schon gleich kostenfrei einige  Namensvorschläge (wenn Sie noch keine haben) unterbreiten.</span></div></td>
            </tr>
          </table>
		  <br>
		  <li class="mainForm" id="fieldBox_1"><label class="formFieldQuestion"><strong>Verfügen Sie bereits über eine Internetadresse oder eine Webpräsenz? </strong><br>
        <br>
	    </label><span>
	    <input class=mainForm type=radio name=field_1 id=field_1_option_1 value="Ich habe bereits eine Internetadresse (Domain) und möchte sie behalten." /><label class=formFieldOption for="field_1_option_1">Ich habe bereits eine Internetadresse (Domain) und möchte sie behalten.<br>
		    <br>
		  </label><input class=mainForm type=radio name=field_1 id=field_1_option_2 value="Ich habe noch keine Internetadresse (Domain)." /><label class=formFieldOption for="field_1_option_2">Ich habe noch keine Internetadresse (Domain).<br>
		    <br>
		  </label><input class=mainForm type=radio name=field_1 id=field_1_option_3 value="Ich habe bereits eine Domain, möchte zu einer griffigeren wechseln und möchte Vorschläge." /><label class=formFieldOption for="field_1_option_3">Ich habe bereits eine Domain, möchte zu einer griffigeren wechseln und möchte Vorschläge.<br>
		    <br>
		  </label><input class=mainForm type=radio name=field_1 id=field_1_option_4 value="Meine bestehende Seite soll überarbeitet werden." /><label class=formFieldOption for="field_1_option_4">Meine bestehende Seite soll überarbeitet werden.<br>
		    <br>
		  </label></span></li>

				<li class="mainForm" id="fieldBox_2"><span class="Stil14"><span class="Stil12"><strong class="formFieldQuestion">Ich habe eine Domain und eine Webpräsenz, möchte mir aber noch eine weitere Webpräsenz aufbauen.
			      </strong></span></span>
				  <span class="Stil12"><br>
				  </span><br>
				  <label class="formFieldQuestion"></label><span>
				  <input class=mainForm type=radio name=field_2 id=field_2_option_1 value="für den bestehenden Betrieb." /><label class=formFieldOption for="field_2_option_1">für den bestehenden Betrieb.<br>
				  <br>
				  </label><input class=mainForm type=radio name=field_2 id=field_2_option_2 value="für eine neue Zweigstelle." /><label class=formFieldOption for="field_2_option_2">für eine neue Zweigstelle.<br>
				  <br>
				  </label><input class=mainForm type=radio name=field_2 id=field_2_option_3 value="für einen neuen Betrieb." /><label class=formFieldOption for="field_2_option_3">für einen neuen Betrieb.<br>
				  <br>
				  </label></span></li>
		
		
		        <div align="center">
		          <!-- end of this page -->
		          
		          <!-- page validation -->
		          <SCRIPT type=text/javascript>
		<!--
			function validatePage1()
			{
				retVal = true;
				if (validateField('field_1','fieldBox_1','radio',1) == false)
 retVal=false;
if (validateField('field_2','fieldBox_2','radio',1) == false)
 retVal=false;

				if(retVal == false)
				{
					alert('Please correct the errors.  Fields marked with an asterisk (*) are required');
					return false;
				}
				return retVal;
			}
		//-->
		</SCRIPT>
		          
		          <!-- end page validaton -->
		          
		          
		          
		          <!-- next page buttons -->
		          <input name="next" type=image class="mainForm" id="next" onClick="if (validatePage1()){ collapseElem('mainForm_1'); expandElem('mainForm_2');}" value="Weiter"src="/index_r7_c12.jpg" alt="Weiter" />	
		          <!-- close the display stuff for this page -->
                    </div>
	    </ul>
<ul class=mainForm id="mainForm_2">

<li class="mainForm" id="fieldBox_3">
					<label class="formFieldQuestion">Firmenbezeichnung</label><input class=mainForm type=text name=field_3 id=field_3 size='20'>
		        </li>

				<li class="mainForm" id="fieldBox_4">
					<label class="formFieldQuestion">Firmentyp&nbsp;*</label>
<select class=mainForm name=field_4 id=field_4>
					  <option value=" " selected> </option>
					  <option value="GmbH">GmbH</option>
					  <option value="GmbH &amp; Co. KG">GmbH &amp; Co. KG</option>
					  <option value="GbR">GbR</option>
					  <option value="AG">AG</option><option value="Ltd.">Ltd.</option><option value="Einzelfirma">Einzelfirma</option><option value="Privat">Privat</option><option value="Andere">Andere</option>
		                                                                        </select>
		</li>

<li class="mainForm" id="fieldBox_5">
					<label class="formFieldQuestion">Vorname&nbsp;*</label><input class=mainForm type=text name=field_5 id=field_5 size='20'>
		        </li>

				<li class="mainForm" id="fieldBox_6">
					<label class="formFieldQuestion">Nachname&nbsp;*</label><input class=mainForm type=text name=field_6 id=field_6 size='20'>
		        </li>

				<li class="mainForm" id="fieldBox_7">
					<label class="formFieldQuestion">Anschrift&nbsp;*</label><input name=field_7 type=text class=mainForm id=field_7 value="Straße" size='20'>
					<input name=field_8 type=text class=mainForm id=field_8 value="Nr." size='2'>
				    <br>
				    <br>
				    <input name=field_9 type=text class=mainForm id=field_9 value="PLZ" size='5'>
                    <input name=field_10 type=text class=mainForm id=field_10 value="Ort" size='17'>
<br>
			        <label class="formFieldQuestion Stil1"></label>
		  </li>

<li class="mainForm" id="fieldBox_11">
					<label class="formFieldQuestion">Telefon&nbsp;*</label>
					<input class=mainForm type=text name=field_15 id=field_15 size='5'>
					<input class=mainForm type=phone name=field_11 id=field_11 size=17>
</li>

				<li class="mainForm" id="fieldBox_12">
					<label class="formFieldQuestion">Telefax</label>
					<input class=mainForm type=text name=field_16 id=field_16 size='5'>
					<input class=mainForm type=text name=field_12 id=field_12 size='17'>
				</li>

<li class="mainForm" id="fieldBox_13">
                  <label class="formFieldQuestion">E-Mail&nbsp;*</label>
                  <input name=field_13 type=email class="mainForm" id=field_13 size=21>
				  <br>
				  <br>
				  <label class="formFieldQuestion">Ihre Nachricht:</label>
				  <textarea name="field_14" cols="40" rows="4" class="mainForm" id="field_14"></textarea>
				</li>

<div align="center">
  <!-- end of this page -->
  
  <!-- page validation -->
  <SCRIPT type=text/javascript>
		<!--
			function validatePage2()
			{
				retVal = true;
				if (validateField('field_3','fieldBox_3','text',0) == false)
 retVal=false;
if (validateField('field_4','fieldBox_4','menu',1) == false)
 retVal=false;
if (validateField('field_5','fieldBox_5','text',1) == false)
 retVal=false;
if (validateField('field_6','fieldBox_6','text',1) == false)
 retVal=false;
if (validateField('field_7','fieldBox_7','text',1) == false)
 retVal=false;
if (validateField('field_8','fieldBox_8','text',1) == false)
 retVal=false;
if (validateField('field_9','fieldBox_9','text',1) == false)
 retVal=false;
if (validateField('field_10','fieldBox_10','text',1) == false)
 retVal=false;
if (validateField('field_11','fieldBox_11','phone',1) == false)
 retVal=false;
if (validateField('field_12','fieldBox_12','text',0) == false)
 retVal=false;
if (validateField('field_13','fieldBox_13','email',1) == false)
 retVal=false;
if (validateField('field_14','fieldBox_14','website',0) == false)
 retVal=false;
if (validateField('field_15','fieldBox_11','text',1) == false)
 retVal=false;

				if(retVal == false)
				{
					alert('Bitte überprüfen sie alle rot gekennzeichneten Felder und ergänzen sie ihre Angaben!');
					return false;
				}
				return retVal;
			}
		//-->
		</SCRIPT>
  
  <!-- end page validaton -->
  
  
  
  <!-- next page buttons -->
</div>
<li class="mainForm">
	  <div align="center">
	    <input name="goforit" type="image" class="mainForm" id="saveForm"value="Absenden" "src="/index_r7_c12.jpg " alt="Absenden" />
        </div>
</li>

	  </form>
			
    <!-- end of form -->
		<!-- close the display stuff for this page --></div>
	<div id="footer"></div>
	</body>
	</html>

Geändert von [LaBeerdy] (11.05.2008 um 00:33 Uhr).
[LaBeerdy] ist offline   Mit Zitat antworten
Antwort

  Aktuelles Thema
  TP Hilfe Forum > Web-Editoren & Coding > Traum-Dynamik
Grafikbutton im Formular > Problem mit Validation Grafikbutton im Formular > Problem mit Validation
« Formularbearbeitung in PHP | Externe Software für GoogleMaps legal? »

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)
 
Themen-Optionen Thema durchsuchen
Thema durchsuchen:

Erweiterte Suche
Thema bewerten
Thema bewerten:

Forumregeln
Es ist dir nicht erlaubt, neue Themen zu verfassen.
Es ist dir nicht erlaubt, auf Beiträge zu antworten.
Es ist dir nicht erlaubt, Anhänge hochzuladen.
Es ist dir nicht erlaubt, deine Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are an
Gehe zu


Alle Zeitangaben in WEZ +2. Es ist jetzt 16:15 Uhr.

Powered by: vBulletin Version 3.7 (Deutsch)
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd. / Search Engine Friendly URLs by vBSEO 3.2.0 ©2008, Crawlability, Inc.
Traum-Projekt.com | Suchen | Archiv | Impressum | Kontakt | | | Nach oben |



1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67