Använd submit på olika sätt med ASP
Förord
Att använda sig av ASP tillåter massor av möjligheter och lika många problemställningar. Jag tänkte i denna artikel gå igenom några varianter att just hanteringen när man submittar en sida och skall hämta vad exempelvis en användare skrivit i en textbox, alternativt i dess URL - alltså sökvägen i browsern på webbplatsen.Innan vi sätter igång tänkte jag med en bild påvisa hur egentligen asp arbetar. Det finns två sätt som man oftast använder.
1. En sida som man kan skriva på - submit sker till samma sida.
2. En sida som man kan skriva på - submit sker till en annan sida.
Oftast har du skrivit en html-sida som kan vara ett formulär innehållande två frågor, exempelvis användarnamn och lösenord. Textboxarna heter username och password. Du måste även använda en form - som du sätter dess name-property till exempelvis "form1". Dess action blir samma namn som sidan heter - på så sätt kommer du att göra din submit till samma sida. För att hämta upp de värden du skrev in på användarnamn och lösenord hämtar du genom att fråga med Request() kommandot. Denna exempelfil kan du döpa login.asp och spara.
Vi har som sagt var html-texten och över denna html-text så skriver vi:
Det här såg ju väldigt enkelt ut men vad är det egentligen som händer?
1. Sidan visas upp i din webbläsare och väntar på att du skall skriva något i fältet användarnamn och lösenord. När du gjort det trycker du på skicka knappen och eftersom vi skrivit att den skall i action gå till sidan login.asp som är samma sida, kommer vi med request.form() få tag på vad som skrevs i dessa två textfält.
2. Som du ser så körs ju asp-koden redan första gången men då händer ingenting och det kommer det inte heller göra nästa gång du gör det eller om du submittar - men om vi skulle ta och bygga på vår kod lite och använda det vi hämtar in med asp och presenterar det igen - ja, varför inte i textboxarna?
Det som kommer hända nu är att varje gång du submittar sidan, kommer vi hämta upp vad som skrevs - samtidigt kommer vi skriva detta i dess textboxar. Så länge du skriver samma sak och submittar så syns ingen skillnad - men så fort du exempelvis byter värde i användarnamn och submittar - ja, då kommer du se det efteråt också.
Såhär fungerar det när man bygger upp information och submittar det. Precis samma sak gäller om du kanske har ett formulär där du vill ha en intresseanmälan eller något formulär som en besökare skall fylla i och som du sedan skall ta hand om.
Vi fortsätter nu med nästa variant, vi använder två submit-knappar. Att använda en är oftast inga problem men när du kanske behöver flera så kan det bli lite svårare om man inte är van. För detta så väljer jag samma formulär - men vi lägger till en submitknapp som vi kallar "rensa". Det den skall utföra är inget annat än att vi skall inte hämta upp de värden som skrivits, istället blanka ut det.
Innan vi kan börja så ser du ovan att submit-knappens namn är B1 - nu ser vi till att ha 2 knappar och observera, de skall ha samma namn.
Nu har vi två submit-knappar, det kommer stå Skicka och Rensa på dom, men ha samma namn. Nu kommer vi till själva tekniken med att döpa dom till samma namn. Vi kan nu hämta vad det står på den knappen som skickades genom att använda en vanlig request-fråga, men kommer få antingen "skicka" eller "rensa" i retur. Här är ett exempel:
Jag skrev till att vi skulle hämta in värdet med Lcase - alltså små bokstäver, det gör det enklare om vi använder detta som standard, för om du skulle skriva IF knapp = "skicka" Then .. så kommer du inte få träff, såvida det inte står value="skicka". Står det value="Skicka" på knappen så måste du också ställa frågan - IF knapp = "Skicka" för att få träff. Men Lcase behöver du inte tänka på det utan skriv alltid med små bokstäver.
Vi fortsätter och försöker göra lite nytta av våra knappar nu. Om användaren trycker "Skicka" så gör vi som vanligt, visar texten när vi gör submit, men om vi trycker Rensa - då ser vi till att fälten blir blanka, nu testar vi:
Nu har du lärt dig hur du gör för att kunna hämta upp ett värde när man trycker submit och sidan laddas om.
Nu tar vi oss även en titt på när man skickar iväg submit-anropet till en annan sida än den egna. Du kanske tror att det är mycket svårare, men så är det inte.
Du skriver på exakt samma sätt, du kan dock hoppa över steget med att använda asp-koden på login.asp. I stället lägger vi asp-koden på den sidan som vi skickar till. Jag visar båda sidorna här, den nya sidan kallar vi för validate.asp där vi exempelvis skall kontrollera eller logga in..
Nu när användaren kommer trycka submit så kommer inte längre samma sida att laddas. Därför är det heller ingen idé att använda 2 submit-knappar eftersom vi inte har kvar vårt gamla formulär. Nu är det en helt ny sida som gäller.
Men på samma sätt som tidigare kan vi hämta de fält som angivits från föregående sida. Skillnaden här är att vi kan inte arbeta och förändra den form som vi kom ifrån. Vi kan till och med ta reda på vilken knapp man tryckte på - precis på samma sätt som föregående exempel:
Nu var även detta exempel klart. Det finns syften för att använda det ena eller andra sättet - inget är bättre än det andra. Det beror helt på vad det är du skall göra.
Det kan tänkas att du inte vill ha en vanlig submit-knapp utan istället en vanlig text som man skall kunna trycka på för att utföra en submit. Det går lika bra och här är det en extra sak du måste hålla reda på för att det skall fungera. Att då använda sig av javascript är ett enkelt moment för att utföra detta.
Här är det viktigt att du har ett namn på din form, för det måste användas i javascriptet. Sätt formens name till exempelvis Form1, det är lätt att komma ihåg.
Som du ser här så har jag tagit bort submit-knapparna och ersatt det med en vanlig href-tag. Här är det viktigt att du som jag tidigare sagt att du måste döpa formen som jag gjort här: name = "Form1". För när du sedan använder dig av javascriptet så måste du även skriva den formens namn som skall submittas. Om du inte är van vid javascript så står Document för hela dokumentet, form1 står för formen och submit är ett kommando och det utför på samma sätt som en kommandoknapp som gör submit för att hämta de fält som finns inom området (formen).
Avslutningsvis
Detta var nog allt jag hade att skriva om just hanteringen vid submit - hoppas det har givit er något. Betygsätt gärna artikeln uppe till höger - det ger mig en möjlighet att se om det är bra eller dåligt skrivet. Du kan givetvis även kommentera detta genom att klicka på brevikonen ovan.
/Pelle Johansson
1. En sida som man kan skriva på - submit sker till samma sida.
2. En sida som man kan skriva på - submit sker till en annan sida.
Exempel 1
Oftast har du skrivit en html-sida som kan vara ett formulär innehållande två frågor, exempelvis användarnamn och lösenord. Textboxarna heter username och password. Du måste även använda en form - som du sätter dess name-property till exempelvis "form1". Dess action blir samma namn som sidan heter - på så sätt kommer du att göra din submit till samma sida. För att hämta upp de värden du skrev in på användarnamn och lösenord hämtar du genom att fråga med Request() kommandot. Denna exempelfil kan du döpa login.asp och spara.Vi har som sagt var html-texten och över denna html-text så skriver vi:
<%
username = Request.Form("username")
password = Request.Form("password")
%>
Det här såg ju väldigt enkelt ut men vad är det egentligen som händer?
1. Sidan visas upp i din webbläsare och väntar på att du skall skriva något i fältet användarnamn och lösenord. När du gjort det trycker du på skicka knappen och eftersom vi skrivit att den skall i action gå till sidan login.asp som är samma sida, kommer vi med request.form() få tag på vad som skrevs i dessa två textfält.
2. Som du ser så körs ju asp-koden redan första gången men då händer ingenting och det kommer det inte heller göra nästa gång du gör det eller om du submittar - men om vi skulle ta och bygga på vår kod lite och använda det vi hämtar in med asp och presenterar det igen - ja, varför inte i textboxarna?
<%
username = Request.Form("username")
password = Request.Form("password")
%>
Det som kommer hända nu är att varje gång du submittar sidan, kommer vi hämta upp vad som skrevs - samtidigt kommer vi skriva detta i dess textboxar. Så länge du skriver samma sak och submittar så syns ingen skillnad - men så fort du exempelvis byter värde i användarnamn och submittar - ja, då kommer du se det efteråt också.
Såhär fungerar det när man bygger upp information och submittar det. Precis samma sak gäller om du kanske har ett formulär där du vill ha en intresseanmälan eller något formulär som en besökare skall fylla i och som du sedan skall ta hand om.
Två submit-knappar på samma form
Vi fortsätter nu med nästa variant, vi använder två submit-knappar. Att använda en är oftast inga problem men när du kanske behöver flera så kan det bli lite svårare om man inte är van. För detta så väljer jag samma formulär - men vi lägger till en submitknapp som vi kallar "rensa". Det den skall utföra är inget annat än att vi skall inte hämta upp de värden som skrivits, istället blanka ut det.Innan vi kan börja så ser du ovan att submit-knappens namn är B1 - nu ser vi till att ha 2 knappar och observera, de skall ha samma namn.
Nu har vi två submit-knappar, det kommer stå Skicka och Rensa på dom, men ha samma namn. Nu kommer vi till själva tekniken med att döpa dom till samma namn. Vi kan nu hämta vad det står på den knappen som skickades genom att använda en vanlig request-fråga, men kommer få antingen "skicka" eller "rensa" i retur. Här är ett exempel:
<%
knapp = Request.Form("Btn")
knapp = Lcase(knapp)
%>
Jag skrev till att vi skulle hämta in värdet med Lcase - alltså små bokstäver, det gör det enklare om vi använder detta som standard, för om du skulle skriva IF knapp = "skicka" Then .. så kommer du inte få träff, såvida det inte står value="skicka". Står det value="Skicka" på knappen så måste du också ställa frågan - IF knapp = "Skicka" för att få träff. Men Lcase behöver du inte tänka på det utan skriv alltid med små bokstäver.
Vi fortsätter och försöker göra lite nytta av våra knappar nu. Om användaren trycker "Skicka" så gör vi som vanligt, visar texten när vi gör submit, men om vi trycker Rensa - då ser vi till att fälten blir blanka, nu testar vi:
<%
knapp = Request.Form("Btn")
knapp = Lcase(knapp)
if knapp = "skicka" then
username = Request.Form("username")
password = Request.Form("password")
end if
if knapp = "rensa" then
username = ""
password = ""
end if
%>
Nu har du lärt dig hur du gör för att kunna hämta upp ett värde när man trycker submit och sidan laddas om.
Submit till annan sida
Nu tar vi oss även en titt på när man skickar iväg submit-anropet till en annan sida än den egna. Du kanske tror att det är mycket svårare, men så är det inte. Du skriver på exakt samma sätt, du kan dock hoppa över steget med att använda asp-koden på login.asp. I stället lägger vi asp-koden på den sidan som vi skickar till. Jag visar båda sidorna här, den nya sidan kallar vi för validate.asp där vi exempelvis skall kontrollera eller logga in..
Nu när användaren kommer trycka submit så kommer inte längre samma sida att laddas. Därför är det heller ingen idé att använda 2 submit-knappar eftersom vi inte har kvar vårt gamla formulär. Nu är det en helt ny sida som gäller.
Men på samma sätt som tidigare kan vi hämta de fält som angivits från föregående sida. Skillnaden här är att vi kan inte arbeta och förändra den form som vi kom ifrån. Vi kan till och med ta reda på vilken knapp man tryckte på - precis på samma sätt som föregående exempel:
<%
knapp = Request.Form("Btn")
knapp = Lcase(knapp)
if knapp = "skicka" then
username = Request.Form("username")
password = Request.Form("password")
end if
if knapp = "rensa" then
Response.Write "Du tryckte på knappen Rensa"
end if
%>
Nu var även detta exempel klart. Det finns syften för att använda det ena eller andra sättet - inget är bättre än det andra. Det beror helt på vad det är du skall göra.
Submit med ett javascript
Det kan tänkas att du inte vill ha en vanlig submit-knapp utan istället en vanlig text som man skall kunna trycka på för att utföra en submit. Det går lika bra och här är det en extra sak du måste hålla reda på för att det skall fungera. Att då använda sig av javascript är ett enkelt moment för att utföra detta.Här är det viktigt att du har ett namn på din form, för det måste användas i javascriptet. Sätt formens name till exempelvis Form1, det är lätt att komma ihåg.
Som du ser här så har jag tagit bort submit-knapparna och ersatt det med en vanlig href-tag. Här är det viktigt att du som jag tidigare sagt att du måste döpa formen som jag gjort här: name = "Form1". För när du sedan använder dig av javascriptet så måste du även skriva den formens namn som skall submittas. Om du inte är van vid javascript så står Document för hela dokumentet, form1 står för formen och submit är ett kommando och det utför på samma sätt som en kommandoknapp som gör submit för att hämta de fält som finns inom området (formen).
Avslutningsvis
Detta var nog allt jag hade att skriva om just hanteringen vid submit - hoppas det har givit er något. Betygsätt gärna artikeln uppe till höger - det ger mig en möjlighet att se om det är bra eller dåligt skrivet. Du kan givetvis även kommentera detta genom att klicka på brevikonen ovan.
/Pelle Johansson
0 Kommentarer