disable on input

5 svar · 297 visningar · startad av SteveP 25 sep. 2003

StevePMedlem sedan mars 2003772 inlägg

Frågan25 sep. 2003 11:29#1

Jag har 3st input fält

<input type="text" name="one">
<input type="text" name="two">
<input type="text" name="three">

Om man skriver nåt i "one" eller i "two" så ska "three" disablas.

Skriver man nåt i "three" så ska "one" och "two" disablas.

Hur gör jag detta?

PalleMedlem sedan apr. 20003 174 inlägg

25 sep. 2003 11:39#2

En variant: :)

[red]<script type="text/javascript">
<!--

function diss(val){

	if(document.foo.one.value.length !== 0 || document.foo.two.value.length !== 0){
		document.foo.three.disabled=true;
	} else {
		document.foo.three.disabled=false;
	} 

	if(document.foo.three.value.length !== 0){
		document.foo.one.disabled=true;
		document.foo.two.disabled=true;
	} else {
		document.foo.one.disabled=false;
		document.foo.two.disabled=false;
	} 

}

//-->
</script>

...

<form name="foo">
	<input type="text" name="one" onkeyup="diss();">
	<input type="text" name="two" onkeyup="diss();">
	<input type="text" name="three" onkeyup="diss();">
</form>[/red]

dectgapMedlem sedan sep. 20021 655 inlägg

25 sep. 2003 11:51#3

Jag förstod det som att de textfält som markören inte står i ska bli disabled:

<script type="text/javascript">
textfieldNames = new Array('one', 'two', 'three');

function diss(focusName, focusVal){
    if(focusVal==""){
        for(i=0; i<textfieldNames.length; i++){
            document.foo.elements[textfieldNames[i]].disabled = false;
        }
    } else{
        for(i=0; i<textfieldNames.length; i++){
            if(textfieldNames[i]!=focusName){
                document.foo.elements[textfieldNames[i]].disabled = true;
            }
        }
    }
}
</script>

...

<form name="foo">
	<input type="text" name="one" onkeyup="diss(this.name, this.value);">
	<input type="text" name="two" onkeyup="diss(this.name, this.value);">
	<input type="text" name="three" onkeyup="diss(this.name, this.value);">
</form>

StevePMedlem sedan mars 2003772 inlägg

25 sep. 2003 11:53#4

Funkar bra palle!
Går det att ändra färgen på dom disablade fälten till grå och när dom inte är disablade så går dom tillbaka till vit?

PalleMedlem sedan apr. 20003 174 inlägg

25 sep. 2003 12:03#5

Så här nånting: :)

[red]<script type="text/javascript">
<!--

function diss(){

	if(document.foo.one.value.length !== 0 || document.foo.two.value.length !== 0){
		document.foo.three.disabled=true; document.foo.three.style.backgroundColor='#cccccc';
	} else {
		document.foo.three.disabled=false; document.foo.three.style.backgroundColor='';
	} 

	if(document.foo.three.value.length !== 0){
		document.foo.one.disabled=true; document.foo.two.style.backgroundColor='#cccccc';
		document.foo.two.disabled=true; document.foo.one.style.backgroundColor='#cccccc';
	} else {
		document.foo.one.disabled=false; document.foo.one.style.backgroundColor='';
		document.foo.two.disabled=false; document.foo.two.style.backgroundColor='';
	} 

}

//-->
</script>[/red]

Erik JuhlinMedlem sedan maj 200010 687 inlägg

25 sep. 2003 12:09#6

Eller så här:

<script type="text/javascript">
function disableField()
{
	var f = document.foo;
	
	f.three.disabled = (f.one.value != "" || f.two.value != "");
	f.three.className = (f.one.value != "" || f.two.value != "" ? "disabled" : "active");
	
	f.one.disabled = (f.three.value != "");
	f.one.className = (f.three.value != "" ? "disabled" : "active");
	f.two.disabled = (f.three.value != "");
	f.two.className = (f.three.value != "" ? "disabled" : "active");
}
</script>

<style type="text/css">
input.disabled {
	background-color: #CCCCCC;
}
input.active {
	background-color: #FFFFFF;
}
</style>

<form name="foo">
	<input type="text" name="one" onKeyUp="disableField();">
	<input type="text" name="two" onKeyUp="disableField();">
	<input type="text" name="three" onKeyUp="disableField();">
</form>