JavaScript in Tabelle Text anzeigen (visible)

banshe

Mitglied
Hallo zusammen,


Vorarbeit:
Ich habe ein PHP Formular das mit einer Tabelle aufgebaut ist - welches durch einen ausgelagerten JavaScript überprüft wird.

Wenn z.B.: das Feld "Name" leer ist, wird das Feld rot markiert...

dies funktioniert auch Prima.


Ziel:
Jetzt möchte ich, dass wenn ein Feld nicht richtig ausgefüllt ist, zusätzlich ein Text angezeigt wird.


Aufbau:

HTML:
<table>
  <tr>
    <td>Name</td>
    <td>**Textbox**</td>
    <td>**Fehlermeldung**</td>
  </tr>
  <tr>
    <td>Vorname</td>
    <td>**Textbox**</td>
    <td>**Fehlermeldung**</td>
  </tr>
</table>


Frage:
Wie kann ich das mit der Fehlermeldung realisieren?
Wenn ich die JavaScript Variable mit dem Fehler - mit PHP benutzen könnte, wäre dies einfach. Aber soweit ich gelesen habe, müsste ich die Variable dann in ein externes File lagern und mit PHP wieder auslesen - was ich nicht möchte.


Danke und Grüsse
 
Hier mal ein Beispiel wie man es machen könnte:

HTML:
<form id="foobar" onsubmit="return checkForm();">
<table>
  <tr>
    <td>Name</td>
    <td><input type="text" name="nachname" id="nachname"></td>
    <td></td>
  </tr>
  <tr>
    <td>Vorname</td>
    <td><input type="text" name="vorname" id="vorname"></td>
    <td></td>
  </tr>
  <tr>
	<td colspan="3">
		<input type="submit" name="submit" value="submit">
	</td>
  </tr>
</table>
</form>

Javascript:
function checkForm(){
	var nachname = document.getElementById('nachname');
	var vorname = document.getElementById('vorname');
	
	var elements = new Array(nachname,vorname);
	
	var error = false;
	
	for(i = 0; i < elements.length; i++){
		var empty = checkIfEmpty(elements[i]);
		if(error == false && empty == true){
			error = true;
		}
	}
	
	return !error;
}


function checkIfEmpty(el){
	var parent = el.parentNode;
	var errorTextElement = parent.nextSibling;
	while(errorTextElement.nodeType != 1){
		errorTextElement = errorTextElement.nextSibling;
	}

	if(el.value == ''){
		errorTextElement.innerHTML = "Fehler";
		return true;
	}else{
		errorTextElement.innerHTML = "";		
		return false;
	}
}
 
Hallo,

Ein Formular mit Überprüfung sämtlicher Textboxen habe ich.
Wenn eine Textbox leer ist oder etwas unerlaubtes beinhaltet wird diese Rot gefärbt.

Zu jeder Textbox habe ich auch eine Variable z.B.: fehlername oder fehlervorname
Wenn in der Textbox ein Fehler ist, wir die entsprechende Variable auf 1 gesetzt.

Wie kann ich jetzt diese Variablen benutzen um in der HTML Tabelle text auszugeben oder wenn es verbesser wurde, den text wieder zu entfernen?

Grüsse
 
Hast du dir das Beispiel eigentlich angesehen?

Das td-Element in das der error Text soll kannst du so ansprechen:
Javascript:
var parent = el.parentNode;
    var errorTextElement = parent.nextSibling;
    while(errorTextElement.nodeType != 1){
        errorTextElement = errorTextElement.nextSibling;
    }

Und etwas reinschreiben kannst du mit innerHTML
Javascript:
if(el.value == ''){
        errorTextElement.innerHTML = "Fehler";
}
 
Hallo

Sorry, dann hab ich wohl etwas falsch verstanden!
Ich bin nun etwas schlauer geworden, aber so ganz hingehauen hat es noch nicht...

ich hab es heute nachmittag mehrfach versucht.. aber ich bekomme es nicht hin (bin zudem noch JS anfänger)...

Hier das direkte Beispiel aus meinem Code.. ohne meine gescheiterten versuche..

Ausschnitt aus dem HTML File:
HTML:
<table>
	<tr>
		<td>Name:</td>
		<td><input type="text" name="name" id="idname" size="50"></td>
		<td></td>
	</tr>
</table>

Ausschnitt aus dem JavaScript:
Code:
function chkFormular() {

	if (document.register.name.value == "") {
		var fehlername = 1;
		var fehler = 1;
	}

if (fehler > 0) {
		
		if (fehlername > 0) {
			document.register.name.style.backgroundColor = "#D60000";
		}
		else {
			document.register.name.style.backgroundColor = "#FFFFFF";
		}
  }
}


Wie muss ich das genau einbauen? ich bekomms leider nicht hin =(

Danke euch vielmals!

Grüsse
 
Zurück