nicht angemeldet
HTML Formular Locked / ReadOnly
Hallo,
ich musste ein Formular ReadOnly machen. ReadOnly ist bei uns nicht das selbe wie disabled.
Auswahlliste, Checkbox und Radiobutton reagieren bei ReadOnly etwas anders als erwartet, da
die Werte ja nicht geändert werden, wenn etwas anderes ausgewählt.
Mit CSS funktioniert es leider nicht, dass oben genannte Komponenten disabled =true gesetzt werden,
sie jedoch nicht grau hinterlegt sind. (weiters sieht man bei der auswahlliste nicht, welche
auswahlmöglichkeiten es gibt)
Anbei mein Vorschlag wie combobox, radio und checkbox locked (also readonly) gemacht werden können.
hoffe es hilft
Christoph
p.s.: das 'R' kommt von JSF zur Laufzeit
p.p.s.: ja man kann das alles 'hacken'. wir brauchen es nur, dass in der "readonly" Ansicht die Werte nicht versehentlich verändert werden und ein Formular (das es nicht gibt) ausgedruckt wird.
<HTML>
<HEAD>
<script>
function radioReadOnly(_id, _R){
radios = document.getElementsByName(_id);
if(_R=='R') {
for (i = 0; i < radios.length; i++) {
if(radios[i].defaultChecked==true) {
radios[i].checked=true;
document.ef1.t1.value='t';
}
else{
radios[i].checked=false;
}
}
}
}
function comboboxReadOnly(_id, _R){
var comboBox=document.getElementsByName(_id)[0];
if(_R=='R') {
for (i = 0; i < comboBox.length; i++) {
if (comboBox[i].defaultSelected==true) {
comboBox[i].selected=true;
}
else{
comboBox[i].selected=false;
}
}
}
}
</script>
<body>
<select
name="abcdefg" size="1" onchange="comboboxReadOnly(this.name,'R')" >
<option value="accord">Honda Accord</option>
<option value="4runner">Toyota 4Runner</option>
<option selected value="nissan-z">Nissan Z350</option>
</select>
<br>
<table>
<tr>
<td>
<label for="form:page1:_9"><input type="radio" name="form:page1:_9" onblur="radioReadOnly(this.name,'R')" onchange="radioReadOnly(this.name,'R')" onclick="radioReadOnly(this.name)" value="nicht erhoben">nicht erhoben</label></td>
</tr>
<tr>
<td>
<label for="form:page1:_9"><input type="radio" name="form:page1:_9" onblur="radioReadOnly(this.name,'R')" onchange="radioReadOnly(this.name,'R')" onclick="radioReadOnly(this.name)" value="unauffällig">unauffällig</label></td>
</tr>
<tr>
<td>
<label for="form:page1:_9"><input type="radio" checked="true" name="form:page1:_9" onblur="radioReadOnly(this.name,'R')" onchange="radioReadOnly(this.name,'R')" onclick="radioReadOnly(this.name,'R')" value="Komplikationen">Komplikationen</label></td>
</tr>
</table>
<br>
<table>
<tr>
<td class="panelGridColumn01"><input id="form:page1:_13" type="checkbox" name="form:page1:_13" checked class="selectBooleanCheckbox" onclick="if('R'=='R') eval('this.checked = ! this.checked')" /></td>
<td class="panelGridColumn02"><span id="form:page1:label_13" class="outputText">checkboxesT1</span></td>
</tr>
<tr>
<td class="panelGridColumn01"><input id="form:page1:_14" type="checkbox" name="form:page1:_14" class="selectBooleanCheckbox" onclick="if('R'=='R') eval('this.checked = ! this.checked')" /></td>
<td class="panelGridColumn02"><span id="form:page1:label_14" class="outputText">checkboxesT2</span></td>
</tr>
</table>
<input type="text" name="input" value="abcdefg" readonly="readonly"/>
</HTML>
-
Hi,
hoffe es hilft
Nichts für ungut, aber ich weiß zwar nicht, was das Script/die Seite bewirken soll (denn ich sehe nicht, das irgendwas eine Reaktion hervorruft - außer einem JS-Fehler wg. document.ef1.t1), aber bei Scripts, die mit so etwas ( eval('this.checked = ! this.checked')" ) operieren, bin ich üblicherweise per se skeptisch ...
... und rate von der Verwendung ab (mal davon ausgehend, daß das Script woanders besser/überhaupt erkennbar läuft).
Gruß, Cybaer
--
Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!-
Danke fürs FeedBack!
ja die Zeile 10 (document.ef1.t1.value='t';) muss gelöscht werden.
Die Seite soll zeigen, wie mit Javascript html-form-elemente gesperrt werden können, ohne dass sie das Aussehen verändern.
Hast du einen besseren Vorschlag wie das erreicht werden kann?
Bei mir (Opera 9 und Firefox 2) läuft es (ohne Zeile 10) problemlos. d.h. der User kann überhaupt nichts machen ;-) -> READONLY
LG
Christoph
Nichts für ungut, aber ich weiß zwar nicht, was das Script/die Seite bewirken soll (denn ich sehe nicht, das irgendwas eine Reaktion hervorruft - außer einem JS-Fehler wg. document.ef1.t1), aber bei Scripts, die mit so etwas ( eval('this.checked = ! this.checked')" ) operieren, bin ich üblicherweise per se skeptisch ...
... und rate von der Verwendung ab (mal davon ausgehend, daß das Script woanders besser/überhaupt erkennbar läuft).
Gruß, Cybaer
-
Hallo,
Bei mir (Opera 9 und Firefox 2) läuft es (ohne Zeile 10) problemlos. d.h. der User kann überhaupt nichts machen ;-) -> READONLY
kann ich mir nicht vorstellen, hast du die Fehlerkonsole geprüft?
Mir scheint, dir ist der Unterschied in der Struktur von <select> und <input type="radio"> überhaupt nicht klar. In deiner combobox-Funktion müsstest du doch wohl option-Eigenschaften setzen/abfragen. Wenn dann die Funktionen funktionieren, sollte ein event-Handler (onchange) ausreichen. Wofür onclick und onblur?dann schau dir nochmal die Verwendung von <http://de.selfhtml.org/html/formulare/strukturieren.htm#label@title=<label>> an. Das for-Attribut zeigt auf die id und nicht auf den Namen eines Input-Elements. Es können also nicht alle <label>-Elemente das gleiche for-Attribut haben!
Gruß plan_B
--
*®*´¯`·.¸¸.· -
Hi,
Die Seite soll zeigen, wie mit Javascript html-form-elemente gesperrt werden können, ohne dass sie das Aussehen verändern.
Also auf div. IEs klappt das nur zur Hälfte (die unteren beiden).
Hast du einen besseren Vorschlag wie das erreicht werden kann?
Auf jeden Fall mit strukturierterem und besserem Code. ;-)
Generell würde ich aber bevorzugen, daß deutlicher zu sehen ist, wenn ich nichts machen darf. Ggf. sogar, daß es gar keine Input-Elemente gibt, die ich nicht verändern kann (d.h., sie erst dann sichtbar machen, wenn man was eingeben kann).
Meine Meinung - das Problem, daß dich zu dieser Variante getrieben hat, hatte ich wohl noch nicht in der Form. ;-)
Gruß, Cybaer
--
Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
-
-