Jag har en webbapplikation där användaren fyller i en massa information i ett formulär. För att användaren inte skall glömma att spara sina ändringar, när han lämnar sidan, vill jag få upp frågan:
"Du har ändrat informationen på sidan, vill du spara?"
Jag vill ju bara få upp frågan när användaren verkligen ändrat på informationen.
I dagsläget har jag onkeydown, onclick, onchange (beroende på element-typ) på alla formulärelement och sedan en JS-variabel som håller reda på om något ändrats.
Den spontana tanken är att när sidan laddas spara allt innehåll i javaskriptvariabler och sen när användaren lämnar sidan jämföra dessa med vad som då står i formuläret för att på så vis se om något verkligen är ändrat och att man inte bara klickat lite fram och tillbaka.
Ja, typ slänga in all data (servernside), hasha den (om man nu kan hasha med t.ex. MD5 i JavaScript sen för att jämföra) och kasta ut den i en JS-variabel som jämförs med en annan JS-variabel som innehåller formulärdatat (clientside).
Era förslag låter intressant. Jag är lite rädd för att lagra hela formuläret bara eftersom det kan bli ganska mycket info. Fördelen med det system jag använder idag är att jag inte behöver lagra någon information. Problemet är att det är lätt att missa onkeydown på något element.
icaaq skrev:
Vad händer om man har js avslaget?
I just det här fallet är det ingen fara. Det är en företagsintern applikation där alla har samma datorkonfiguration.
Det finns ju defaultValue, defaultSelected m.m. att läsa av på input fält.
Bara loopa igenom alla fält och kolla om de ändrats. Fina med det är att om man återställer vad det ursprungliga var så ses inte formuläret som ändrat.
Ett sätt att inte missa någon onkeydown/onchange är att binda eventsen genom att loppa igenom elementen i formuläret och binda onkeyup, onchange, onclick beroende på element-typen.
Och sen kapslar man in detta i en snygg JavaScript-klass. Eller så kanske jag kan va snäll och ge dig en klass som hanterar just detta... ;)
Här är en klass för att hantera formulärändringar. Finns med en exempelfil där.
Det ser intressant ut men jag får nog kolla på det till ett annat projekt.
Lösningen som jag har idag fungerar ganska tillfredsställande och är dessutom bara runt 20 JS-rader istället för 400. ;)
259 ms totalt · 4 externa anrop · v20260731065814-full.a51de22e