disabled input Feld übergeben

newbi_1

Mitglied
Hallo,
ich habe 5 INPUT Felder, die ich mit Werten befüllen möchte und kann.
Ich kann die Anzahl der Zeilen dynamisch erweitern (onclick="javascript:clone_this(this);)
Wenn im zweiten Feld ein "<"-Zeichen steht, dann werden Feld Wert3 und Relmess ausgegraut (checkWERT(this)).
Das Formular wird mit "Daten absenden" abgschickt und die eingegebenen Daten sollen ausgelesen werden, - aber bei den 'disabled' Werten wird nix übergeben so dass die Werte verrutschen? Was kann ich da machen ? Mit hidden Werten übergeben aber wie mache ich das, oder habe ich den Ansatz total falsch********:rolleyes:
PHP:
<script type="text/javascript">
function clone_this(btn){
  tbl=btn.parentNode.parentNode.parentNode;
  // Knoten klonen
  var objNode = tbl.rows[tbl.rows.length-2].cloneNode(true);
  var arrInput = objNode.getElementsByTagName("input");
  for(var i=0; i<arrInput.length; i++){
  	if((arrInput[i].type == "text") && (arrInput[i].name!="wert4[]"))
    	arrInput[i].value = "";
    }
  }
  tbl.insertBefore(objNode, tbl.rows[tbl.rows.length-1]);
}


function checkWERT(e) {
  if(e.value.length) 
  {
    if (!e.value.match(/^[\s\<]+$/)) {
		alert("Nur folgendes Zeichen '<' oder Leerzeichen ist  erlaubt");
		setTimeout(function(){wert1.parentNode.parentNode.getElementsByTagName('input')[0].focus()}, 100);
		return false;
    } 
    else 
    { 
		e.parentNode.parentNode.getElementsByTagName('input')[2].disabled = true;
		e.parentNode.parentNode.getElementsByTagName('input')[2].value = '-';
		e.parentNode.parentNode.getElementsByTagName('input')[3].disabled = true;
		e.parentNode.parentNode.getElementsByTagName('input')[3].value = '-';
		setTimeout(function(){e.parentNode.parentNode.getElementsByTagName('input')[1].focus()}, 10);
		return ;
    }
  } else {
		e.parentNode.parentNode.getElementsByTagName('input')[2].disabled = false;
		e.parentNode.parentNode.getElementsByTagName('input')[2].value = '';
		e.parentNode.parentNode.getElementsByTagName('input')[3].disabled = false;
		e.parentNode.parentNode.getElementsByTagName('input')[3].value = '';
		//setTimeout(function(){messwert.focus()}, 100);
		setTimeout(function(){e.parentNode.parentNode.getElementsByTagName('input')[1].focus()}, 10);
		return true;
  }
}  

</script>
HTML:
<FORM  ACTION='ausgabe.php' METHOD='POST' NAME='Eingabeformular' >
  <DIV id="new_row"><TABLE  cellspacing="0" border="1" name="cloneTable"> 
   <TR>
    <TH colspan=6>Bitte Werte eingeben</TH>
   </TR>
   <TR>
    <TH>Gr&ouml;sse</TH>
    <TH>Wert 1</TH>
    <TH>Wert 2</TH>
    <TH>Wert 3</TH>
    <TH>Relmess</TH>
    <TH>Wert 4</TH>
  </TR>
  <TR>
    <TD>
      <SELECT>
        <OPTION>[bitte w&auml;hlen]</OPTION>
        <OPTION>1</OPTION>
        <OPTION>2</OPTION>
		<OPTION>3</OPTION>
		<OPTION>4</OPTION>
		<OPTION>5</OPTION>
		<OPTION>6</OPTION>
      </SELECT>
    </TD>
    <TD><INPUT name="wert1[]" onblur="checkWERT(this)"></TD>
    <TD><INPUT name="wert2[]"></TD>
    <TD><INPUT name="wert3[]"></TD>
	<TD><INPUT NAME='relmess[]'></TD>
    <TD><INPUT name="wert4[]"></TD>
  </TR>
  <TR>
    <TH colspan=6>
      <INPUT type="submit"/>
      <INPUT value=" Werte eingeben " onclick="javascript:clone_this(this);" type="button"/>
    </TH>
  </TR>
</TABLE> 
</FORM>


Über Hilfe wäre ich sehr dankbar:)
 
Das einfachste ist es eigentlich, wenn man das Feld nicht disabled, sondern nur auf readonly setzt und das aussehen per CSS so verändert, dass es aussieht, als wäre das Feld disabled. Du kannst bei readonly dann zwar immer noch ins Feld klicken und du siehst einen Cursor, aber du kannst natürlich nichts mehr bearbeiten.

Beispiel CSS um das Feld so aussehen zu lassen, als wäre es disabled:
Code:
form .disabled {
opacity: 0.5;
}
 
Danke für die Antwort - aber
Schreib ich dann

e.parentNode.parentNode.getElementsByTagName('input')[2].readonly = false;

so klappts aber nicht und wo stell ich das opacity rein****

Bin verwirrt!!
 
Ich hab hier mal schnell ein kleines Beispiel gemacht. Natürlich ist mein Beispiel nicht mit dynamischen Formularfeldern ;)

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="de" id="vbulletin_html">
	<head>
		<title>Disabled Input</title>
		<script type="text/javascript">
		<!--
			function disable() {
				document.forms[0].elements[0].className = "disabled";
				document.forms[0].elements[0].readOnly = true;
			}
			
			function enable() {
				document.forms[0].elements[0].className = "";
				document.forms[0].elements[0].readOnly = false;
			}
		// -->
		</script>
		<style type="text/css">
			form .disabled {
				opacity: 0.5;
			}
		</style>
	</head>
	<body>
		<form action="" method="post">
			<input type="text" name="test" /> <input type="button" onclick="disable();" value="disable" /> <input type="button" onclick="enable();" value="enable" />
		</form>
	</body>
</html>

Am Rande wollte ich noch anmerken, dass die grossgeschriebenen HTML-Tags nicht mehr Standardkonform sind... Ich glaub das ist noch HTML 4.0, momentan aktuell ist eigentlich XHTML 1.0, oder XHTML 1.1. HTML 5.0 ist ebenfalls im kommen, allerdings noch nicht komplett Standardisiert.
 
Zurück