/ Forside / Teknologi / Udvikling / Java Scripts / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
Java Scripts
#NavnPoint
molokyle 5410
Klaudi 2799
smorch 2439
kim 1360
Harlekin 1134
bentjuul 984
gibson 800
severino 695
Random 675
10  konsulent.. 626
Tjek om der er lavet ændringer i form?
Fra : Lars Grove Mortensen


Dato : 06-05-11 17:41

Hej alle

I forbindelse med en form-validator, kunne jeg godt tænke mig at
tjekke, om der overhovedet er lavet ændringer i formularen.

Ved søgning på nettet har jeg fundet nedenstående kode, men så
skal jeg jo definere hver enkelt element i formen (og huske at
redigere dette ved ændringer, etc. etc.

Er der mon nogen, der kan/vil hjælpe med en kode, der bare
tjekker hele formularen for ændringer - uden at skulle definere
hvert enkelt felt?


På forhånd mange tak!

//Lars


<script>
function submitForm(obj)
{
if(obj.q.value==obj.q.defaultValue)
{
alert("Please make a change");
return false;
}
return true;
}
</script>
<form action=http://www.sembel.net/tools/q.php onsubmit="return
submitForm(this);">
<input type=text name=q value=hurra>
<input type=submit>
</form>

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

 
 
Birger Sørensen (06-05-2011)
Kommentar
Fra : Birger Sørensen


Dato : 06-05-11 19:59

Lars Grove Mortensen udtrykte præcist:
> Hej alle
>
> I forbindelse med en form-validator, kunne jeg godt tænke mig at
> tjekke, om der overhovedet er lavet ændringer i formularen.
>
> Ved søgning på nettet har jeg fundet nedenstående kode, men så
> skal jeg jo definere hver enkelt element i formen (og huske at
> redigere dette ved ændringer, etc. etc.
>
> Er der mon nogen, der kan/vil hjælpe med en kode, der bare
> tjekker hele formularen for ændringer - uden at skulle definere
> hvert enkelt felt?
>
>
> På forhånd mange tak!
>
> //Lars
>
>
> <script>
> function submitForm(obj)
> {
> if(obj.q.value==obj.q.defaultValue)
> {
> alert("Please make a change");
> return false;
> }
> return true;
> }
> </script>
> <form action=http://www.sembel.net/tools/q.php onsubmit="return
> submitForm(this);">
> <input type=text name=q value=hurra>
> <input type=submit>
> </form>

Hvordan vil du checke om der er ændringer uden at kende den oprindelige
værdi?

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk



Lasse Reichstein Nie~ (06-05-2011)
Kommentar
Fra : Lasse Reichstein Nie~


Dato : 06-05-11 21:00

Lars Grove Mortensen <spam@grove-mortensen.dk> writes:

> I forbindelse med en form-validator, kunne jeg godt tænke mig at
> tjekke, om der overhovedet er lavet ændringer i formularen.
>
> Ved søgning på nettet har jeg fundet nedenstående kode, men så
> skal jeg jo definere hver enkelt element i formen (og huske at
> redigere dette ved ændringer, etc. etc.
>
> Er der mon nogen, der kan/vil hjælpe med en kode, der bare
> tjekker hele formularen for ændringer - uden at skulle definere
> hvert enkelt felt?

Du skal gennemløbe formens elementer og tjekke hver enkelt på
samme måde.
Dog kun de elementer der faktisk kan ændres (ikke fx knapper).
Jeg ville i første omgang ignorere radio-grupper og tjekbokse,
for det er oftest rimeligt at de starter med en indstilling der
er gyldig.

Du kan prøve noget i stil med:

<script>
function checkAllChanged(form, callback) {
var elements = form.elements;
var success = true;
for (var i = 0, n = elements.length; i < n; i++) {
var elem = elements[i];
var ltag = elem.tagName.toLowerCase();
if (((ltag == "input" && elem.type == "text") || ltag == "textarea") &&
(elem.value == elem.defaultValue) ||
(ltag == "select" &&
elem.options[elem.selectedIndex].defaultSelected)) {
success = false;
// Found unchanged element. Call callback so that it can report
// this. End loop if callback returns false.
if (!callback(elem)) return false;
}
}
return success;
}

function reportUnchanged(element) {
alert("Please make a change to the value: " + element.value);
return false; // abort after first change
}
</script>

<form action="" onsubmit="return checkAllChanged(this, reportUnchanged);">
<input name="b" type="text" value="ok">
<select name="a"><option selected="true">A</option><option>B</option></select>
<textarea name="c">Oldenborre</textarea>
<input type="submit" value="try">
</form>


/L
--
Lasse Reichstein Holst Nielsen
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

Lars Grove Mortensen (11-05-2011)
Kommentar
Fra : Lars Grove Mortensen


Dato : 11-05-11 12:58

Hmm... Nu har jeg prøvet det lidt.

Hvis man bare kopierer den foreslåede kode, så melder den fejl i form af manglende
")"

Jeg har så lavet lidt rettelser til:

if ((((ltag == "input" && elem.type == "text") || ltag == "textarea") &&
(elem.value == elem.defaultValue)) || (ltag == "select" &&
elem.options[elem.selectedIndex].defaultSelected))


og nu kommer den ikke længere med dén fejl.

Tilgengæld vil den jo have, at alle felter skal ændres?

Det var mit ønske, at den blot skulle tjekke, om der var mindst ét af felterne,
der var blevet ændret.

Men hvis man "går lidt med på legen", kommer den med en anden fejl: Object
expected...

hmm... what to do?

//Lars

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Lars Grove Mortensen (11-05-2011)
Kommentar
Fra : Lars Grove Mortensen


Dato : 11-05-11 14:00

Jeg lavede det følgende... Det ser ud til at virke!

Er der mon nogen "best practice" kommentarer til det? :)

//Lars


<script>

function checkAnyChanges(form) {

   var elements = form.elements;
   var success = false;

for (var i = 0, n = elements.length; i < n; i++) {
   var elem = elements[i];
   var ltag = elem.tagName.toLowerCase();


    if ((ltag == "input" && elem.type == "text") && !(elem.value ==
elem.defaultValue)) {
       success = true;
    }
    if (ltag == "textarea" && !(elem.value == elem.defaultValue)) {
       success = true;
    }
    if (ltag == "select" && !elem.options[elem.selectedIndex].defaultSelected) {
       success = true;
    }

}


   if (success == false){
      alert("FORETAG EN ÆNDRING");
      return false;
   }

return success;
}

</script>

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Lasse Reichstein Nie~ (11-05-2011)
Kommentar
Fra : Lasse Reichstein Nie~


Dato : 11-05-11 20:15

Lars Grove Mortensen <spam@grove-mortensen.dk> writes:

> Jeg lavede det følgende... Det ser ud til at virke!
>
> Er der mon nogen "best practice" kommentarer til det? :)

Kun småting.

> //Lars
>
>
> <script>
>
> function checkAnyChanges(form) {
>
>    var elements = form.elements;
>    var success = false;
>
> for (var i = 0, n = elements.length; i < n; i++) {
>    var elem = elements[i];
>    var ltag = elem.tagName.toLowerCase();
>
>
>     if ((ltag == "input" && elem.type == "text") && !(elem.value ==
> elem.defaultValue)) {

!(a == b) er nemmere at læse som a != b

>        success = true;
>     }
>     if (ltag == "textarea" && !(elem.value == elem.defaultValue)) {
>        success = true;
>     }
>     if (ltag == "select" && !elem.options[elem.selectedIndex].defaultSelected) {
>        success = true;
>     }
>
> }
>
>
>    if (success == false){

if (!success) {

Dette tjekker at der er lavet en ændring på mindst et element, mens
resten kan være uændrede.
Hvis det er den ønskede opførsel, så er det fint.


>       alert("FORETAG EN ÆNDRING");
>       return false;

Unødvendigt at returnere false her, når du alligevel returnerer
succes-variablen bagefter, og den ved vi er false her.

>    }
>
> return success;
> }

/L
--
Lasse Reichstein Holst Nielsen
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

Søg
Reklame
Statistik
Spørgsmål : 177416
Tips : 31962
Nyheder : 719565
Indlæg : 6407859
Brugere : 218876

Månedens bedste
Årets bedste
Sidste års bedste