Skapa en egen Focuskontroll i ASP.NET
Förord
När jag började med asp.net så var allting precis nytt för mig och jag intalade mig även att precis alla funktioner som kunde tänkas finnas fast jag inte visste var de fanns redan skulle vara implementerade. Men givetvis är det inte så. I och med att man börjar med asp.net så får man också tänka om ordentligt mycket för att istället för att kasta ihop asp med html börja tänka objektorienterat vilket inte direkt är en dans på rosor i början. När jag fick en förfrågan om vad jag tyckte om vb.net från Simon Brown, tidigare VD på Microsoft i Sverige sa jag till svar: - Det är som 12 Mount Everest bakom varandra. Först är det världens uppförsbacke och när man kommit upp skiker man jippey, därefter bär det utför ett tag tills man inser att nu kommer ytterligare en topp. Så håller det på ett bra tag tills man inser att topparna plötsligt planar ut eller kanske att man lärt sig bestiga de efter några gånger. Man gör helt enkelt inte samma misstag två gånger, och nyttjar de vägar som fungerat bra tidigare.Innehåll
»»
»
Nu till ämnet, nämligen att via codebehind kunna sätta fokus på en viss kontroll som antingen byggs via codebehind eller redan lagts till på din aspxsida. Det finns ingen funktion som fokuserar en kontroll såsom .SetFocus eller liknande eftersom koden körs på servern. Dock är det inte speciellt svårt att skriva en egen funktion som du kan använda dig av i ditt projekt och det är just det jag tänkte visa hur man gör.
Om du hade haft en vanlig sida hade du säkert skrivit ihop en liten javascriptrutin som du antingen lagt i body-onloadtaggen alternativt att den kallas från något annat ställe. En sådan rutin hade troligen sett ut som följer:
När din sida hade laddats upp så hade focus satts på det fält i din form som du angett inom och problemet hade varit avklarat. I exemplet används document.getElementById som är ett objekt som returnerar kontrollens namn om den förekommer. Nu är det faktiskt så att du kan göra precis samma sak genom att skriva en liten rutin som bygger detta javascript åt dig och på så sätt faktiskt lösa ditt problem.
I asp.net finns en metod som heter RegisterStartupScript och i detta finns en funktion som heter Page.RegisterStartupScript. Genom denna funktion kan vi skapa oss ett javascript som i sin tur kan skickas in och presenteras som ett block med javascript när sidan laddas upp för användaren.
Genom att skriva en subrutin som du kan lägga någonstans i projektet, företrädesvis en modul som i sin tur tar emot just detta controlname som vi pratade om. Sagt å gjort – vi tittar på koden.
Som du ser så används Chr(34) som betyder ” för att kunna bygga upp koden korrekt syntaxmässigt. Nu ser du att vi byggt en funktion som heter SetFocusControl som tar emot ett kontrollnamn av typen sträng. Så när du nu kallar denna rutinen så kan det se ut såhär:
Som I sin tur kommer bygga upp scriptet, infoga textbox2 som namn, hämtas upp via .GetElementById och i sin tur kontrollera om objektet finns på sidan. Avslutningsvis i subrutinen så kallas Page.RegisterStartupScript för att rendera (skriva/bygga) upp detta script och placera den javascriptkoden på ett korrekt ställe i din html-sida. Slutligen om kontrollens namn finns, så kommer även focus att sättas på detta fält.
Det som har hänt egentligen är att på din aspxsida så kommer denna kod att finnas om du visar källan:
Om nu nu vill i ditt program sätta focus på olika fält, kanske beroende på vad du trycker så går ju detta också bra under förutsättning att du har AutoPostback på knapptrycken samt att dina kontroller är serversided:
Svårare än såhär var det faktiskt inte. Dock är det kanske lite svårt precis som inledningsvis är att veta om dessa rutiner finns eller inte. Eftersom vb.net har så oerhört många kontroller som är kraftfulla så är det minst sagt mycket att lära sig innan man ens hittar allting man skulle kunna behöva.
Nu vet du i alla fall vad som gäller rörande SetFocus och asp.net. Vad som sker i kommande versioner vet jag inte men det är nog stor chans att detta kommer finnas inbyggt. – Lycka till med programmeringen!
Skriv ett javascript för att sätta fokus
Om du hade haft en vanlig sida hade du säkert skrivit ihop en liten javascriptrutin som du antingen lagt i body-onloadtaggen alternativt att den kallas från något annat ställe. En sådan rutin hade troligen sett ut som följer:
<script language="javascript">
var control = document.getElementById();
if( control != null ){ control.focus(); }
</script>
När din sida hade laddats upp så hade focus satts på det fält i din form som du angett inom
Bygg scriptet
I asp.net finns en metod som heter RegisterStartupScript och i detta finns en funktion som heter Page.RegisterStartupScript. Genom denna funktion kan vi skapa oss ett javascript som i sin tur kan skickas in och presenteras som ett block med javascript när sidan laddas upp för användaren. Genom att skriva en subrutin som du kan lägga någonstans i projektet, företrädesvis en modul som i sin tur tar emot just detta controlname som vi pratade om. Sagt å gjort – vi tittar på koden.
Public Sub SetFocusControl(ByVal ControlName As String)
' character 34 = "
Dim script As String = _
"<script language=" + Chr(34) + "javascript" + Chr(34) _
+ ">" + _
" var control = document.getElementById(" + Chr(34) + _
ControlName + Chr(34) + ");" + _
" if( control != null ){control.focus();}" + _
"</script>"
Page.RegisterStartupScript("Focus", script)
End Sub
Som du ser så används Chr(34) som betyder ” för att kunna bygga upp koden korrekt syntaxmässigt. Nu ser du att vi byggt en funktion som heter SetFocusControl som tar emot ett kontrollnamn av typen sträng. Så när du nu kallar denna rutinen så kan det se ut såhär:
SetFocusControl(Textbox2.ClientID)
Som I sin tur kommer bygga upp scriptet, infoga textbox2 som namn, hämtas upp via .GetElementById och i sin tur kontrollera om objektet finns på sidan. Avslutningsvis i subrutinen så kallas Page.RegisterStartupScript för att rendera (skriva/bygga) upp detta script och placera den javascriptkoden på ett korrekt ställe i din html-sida. Slutligen om kontrollens namn finns, så kommer även focus att sättas på detta fält.
Det som har hänt egentligen är att på din aspxsida så kommer denna kod att finnas om du visar källan:
<script language="javascript">
var control = document.getElementById("TextBox2");
if( control != null ){control.focus();}
</script>
Använd scriptet
Om nu nu vill i ditt program sätta focus på olika fält, kanske beroende på vad du trycker så går ju detta också bra under förutsättning att du har AutoPostback på knapptrycken samt att dina kontroller är serversided:
Private Sub Button1_Click(ByVal sender As System.Object, _
ByVal e As System.EventArgs) Handles Button1.Click
SetFocusControl(Textbox1.ClientId)
End Sub
Private Sub Button2_Click(ByVal sender As System.Object, _
ByVal e As System.EventArgs) Handles Button2.Click
SetFocusControl(Textbox2.ClientId)
End Sub
Svårare än såhär var det faktiskt inte. Dock är det kanske lite svårt precis som inledningsvis är att veta om dessa rutiner finns eller inte. Eftersom vb.net har så oerhört många kontroller som är kraftfulla så är det minst sagt mycket att lära sig innan man ens hittar allting man skulle kunna behöva.
Nu vet du i alla fall vad som gäller rörande SetFocus och asp.net. Vad som sker i kommande versioner vet jag inte men det är nog stor chans att detta kommer finnas inbyggt. – Lycka till med programmeringen!
Oskar Johansson
>>Som du ser så används Chr(34) som betyder ” för att kunna bygga upp koden korrekt syntaxmässigt.<< Jag förstår inte riktigt varför du inte använder "" istället för det där... :/ Dessutom: Jag skulle göra en överlagring till på den där metoden och låta den nya metoden ta en webcontrol som parameter samt en för htmlgenericontrol. och sedan låta de metoderna anropa den vanliga varianten och lägga till .ClientId. Dvs. public sub SetFocusControl(byref TheControl as webcontrol) setfocuscontrol(thecontrol.clientid) end sub =D Ser lite snyggare ut (tror att det borde vara byref för bättre prestanda också...) :)