Avatar billede kak Nybegynder
17. april 2006 - 17:12 Der er 24 kommentarer og
1 løsning

Kald af javascript

Er det på nogen måde muligt, at kalde en javascript-funktion fra et asp.net element?

F.eks. vil jeg gerne udfylde "by" automatisk, ud fra det postnummer en bruger skriver. Jeg kan sagtens gøre det via en vb-funktion, men det kræver jo at jeg laver en postback. Jeg ville gerne undgå det for at spare tid, og det kræver jo at jeg bruger javascript.

Jeg ved godt, at jeg kan lave postnummer-feltet til at "almindeligt" felt, men der kan også være andre tilfælde, f.eks. hvor jeg vil ændre værdien i en tekstboks, ud fra valget i en <asp:calendar...>.
Avatar billede snepnet Nybegynder
17. april 2006 - 17:18 #1
bruger du version 1.X eller 2.0?

hvis du benytter 1.X kan du lave det direkte med xmlhttp, og bruger du 2.0 kan du fikse det med en implementering af ICallBackEventHandler - sig lige til hvad du bruger, så skal du få et eksempel.

mvh
Avatar billede kak Nybegynder
17. april 2006 - 17:20 #2
Det er 2.0
Avatar billede arne_v Ekspert
17. april 2006 - 17:21 #3
Hvis du vil undgaa et server round trip, saa er du noedt til at loade
alle postnumre ind i noget JS kode som du saa kalder client side ...
Avatar billede snepnet Nybegynder
17. april 2006 - 17:22 #4
altså ... du kan altid kalde et javascript fra din kontrol. de nævnte muligheder er med henblik på at du henter resultatet på serveren - uden at brugeren oplever et postback (ajax-tingen).

hvis du bare vil have et javascript kald - f.eks. ved klik på en serverknap:

<asp:Button id="btnKlik" runat="server" OnClick="btnKlik_Click" />

du vil så have en btnKlik_Click(object sender, EventArgs e) i din serverkode, og du kan få kaldt et javascript på denne måde:

// i fx. page_load
btnKlik.Attributes.Add("onclick","return confirm('er du sikker');");

mvh
Avatar billede snepnet Nybegynder
17. april 2006 - 17:23 #5
hvor du kan udskifte return confirm(..) med et kald til en javascript funktion der er på siden.
mvh
Avatar billede kak Nybegynder
17. april 2006 - 17:28 #6
Jeg er ikke helt med.

<asp:Button id="btnKlik" runat="server" OnClick="btnKlik_Click" />
... og ...
btnKlik.Attributes.Add("onclick","return confirm('er du sikker');");
... har vel ikke noget med hinanden at gøre? Eller har de?

Det andet lyder også interessant! Altså at hente resultatet fra serveren, uden et postback. Kan du give et eksempel på det?
Avatar billede snepnet Nybegynder
17. april 2006 - 17:34 #7
jo - de har noget med hinanden at gøre.... det er den samme knap der "pilles ved"

det er er din serverside-knap:
<asp:Button id="btnKlik" runat="server" OnClick="btnKlik_Click" />

hvis serverside klikevent du abbonnerer på, og du får kaldt metoden btnKlik_Clik i din serverside kode når der klikkes.

det her:

btnKlik.Attributes.Add("onclick","return confirm('er du sikker');");

skriver du i page_load, således at du får abbonneret på clientside klikeventet med
return confirm(...);
hvor du jo så kunne kalde hvilken som helst javascript funktion istedet.

du får et eksempel på callbacks om 10 min.

mvh
Avatar billede arne_v Ekspert
17. april 2006 - 17:36 #8
vi skal lige skelne mellem:

normal postback (HTTP request til server, "blink")

AJAX (HTTP request til server, intet "blink")

ren JavaScript (ikke noget HTTP request til server)

er det blinket eller server belastning du vil undgaa
Avatar billede kak Nybegynder
17. april 2006 - 17:41 #9
Jeg vil jo helst undgå både belastning og blinket :-) Men hvis jeg kan undgå blinket, er det en god mulighed i en del tilfælde.
Avatar billede snepnet Nybegynder
17. april 2006 - 17:47 #10
du kan i hvert fald få et eksempel på callbacks her... så kan du jo se om det er noget for dig.
(så meget fylder det jo heller ikke hvis du lægger postnumre og bynavne ud til klienten, så du kan lave en ren klientløsning, men hvis du skal lave noget lidt mere avanceret med serverside validering og ditten og datten - kan du bruge eksemplet som udgangspunkt)

// en form:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="CallbackSample.aspx.cs" Inherits="CallbackSample" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Untitled Page</title>
    <script language="javascript" type="text/javascript">
    function hentByNavn(arg, targetId)
    {
        var context = new Object();
        context.TargetId = targetId;   
        <%= CallbackFunction %>
    }   
   
    function setByNavn(result, context)
    {
        document.getElementById(context.TargetId).value = result;
    }       
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <asp:TextBox id="txtPostnummer" runat="server" />
        <asp:TextBox id="txtBy" runat="server" />   
        <br />
        <asp:TextBox id="txtPostnummer2" runat="server" />
        <asp:TextBox id="txtBy2" runat="server" />           
    </form>
</body>
</html>

// og koden
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class CallbackSample : System.Web.UI.Page, ICallbackEventHandler
{
    // property med privat field
    private string _callbackFunction;
    public string CallbackFunction
    {
        get { return _callbackFunction; }
    }

    protected void Page_Load(object sender, EventArgs e)
    {
        // få sat callbackfunction
        _callbackFunction = Page.ClientScript.GetCallbackEventReference(this, "arg", "setByNavn", "context");

        // sørg for at der clientside kaldes, når brugeren forlader feltet
        this.txtPostnummer.Attributes["onblur"] += "hentByNavn(this.value, '" + txtBy.ClientID + "');";
        this.txtPostnummer2.Attributes["onblur"] += "hentByNavn(this.value, '" + txtBy2.ClientID + "');";
    }

    #region ICallbackEventHandler implementering
    string callbackResult;
    public string GetCallbackResult()
    {
        return callbackResult;
    }

    public void RaiseCallbackEvent(string eventArgument)
    {
        callbackResult = eventArgument + "_ÅRHUS";
    }
    #endregion
}

det virker måske lidt kryptisk, men du kan debugge igennem det, og se hvad der sker...
Avatar billede snepnet Nybegynder
17. april 2006 - 17:47 #11
der er lidt ekstra ballade i det (som at overføre targetid) for at du kan have flere sæt på samme side, hvis det skulle være nødvendigt.

mvh
Avatar billede snepnet Nybegynder
17. april 2006 - 17:51 #12
måske denne implemetering af af RaiseCallbackEvent er mere beskrivende (omænd vældig midlertidig ;o) :

    public void RaiseCallbackEvent(string eventArgument)
    {
        switch (eventArgument)
        {
            case "8000":
                callbackResult = "ÅRHUS";
                break;
            case "5000":
                callbackResult = "ODENSE";
                break;
            default:
                callbackResult = "UKENDT";
                break;
        }       
    }

mvh
Avatar billede snepnet Nybegynder
17. april 2006 - 17:54 #13
hvis det er den slags funktionalitet du er ude efter - kan det pakkes pænt ind i en kontrol på sigt, så du ikke skal fuske rundt med det hver gang du skal bruge en byopslag.
mvh
Avatar billede kak Nybegynder
17. april 2006 - 18:01 #14
I første omgang prøver jeg at få javascript til at virke, når en dropdownlist ændres, men det virker ikke. Min kode ser således ud:

    Public Sub page_load()
        MyDropDownlist.Attributes.Add("onchange", "alert('test');")
    End sub

    Sub dropdownChange(ByVal sender As Object, ByVal e As System.EventArgs)
    End Sub

<asp:DropDownList ID="MyDropDownlist" runat="server" AutoPostBack=false OnSelectedIndexChanged="dropdownChange">

Jeg har jo nok misforstået hvordan det bruges, men kan du sige hvor det kikser?
Avatar billede snepnet Nybegynder
17. april 2006 - 18:15 #15
næh... det skulle være fint. hvad er det der ikke virker?
vis evt. hele koden.
mvh
Avatar billede kak Nybegynder
17. april 2006 - 18:29 #16
Det virker til dels nu, ved at jeg ændrede Autopostback=true for dropdownlisten. Men den virker først fra anden gang jeg ændrer værdien i listen?!

Er der noget i dit eksempel ovenfor, der viser brugen af AJAX? Jeg har ikke hørt om det før, men det lyser jo smart, så jeg vil gerne prøve det af.
Avatar billede snepnet Nybegynder
17. april 2006 - 22:42 #17
AutoPostBack="true/false" skulle ikke ændre på at din clientscript kører - får du ikke nogen alertbox frem når du skifter i den første gang?
Mht AJAX : http://vertikal.dk/ajax/
Og ja - det eksempel du har fået er et eksempel på hvordan du kan lave den slags i ASP.NET 2.0
Du skulle kunne køre det umiddelbart.
mvh
Avatar billede kak Nybegynder
18. april 2006 - 09:45 #18
Jeg har fået det til at virke med autopostback=false og ved første klik. Fejlen var at elementet ligger inde i en <asp:formview...> som får data fra en db. Derfor skulle denne her: MyDropDownlist.Attributes.Add("onchange", "alert('test');") ...
køres ondatabound på mit formview i stedet.

Så nu virker det stort set, men fra min javascript funktion, har jeg svært ved at hente værdierne af elementerne inde i mit formview. Denne her: document.all.myTextbox.value; ... virker så længe textboksen ikke er inde i mit formview. Men er den det, kan jeg ikke få fat på den (har prøvet forskellige muligheder uden held).

Ved du hvordan det gøres?
Avatar billede snepnet Nybegynder
18. april 2006 - 17:15 #19
den får et andet id når du propper den ind i sådan en container kontrol (kig i den resulterende html).
du kan enten hardkode direkte mod det resulterende id (mod at du så skal rette der når du laver ændringer) eller også kan du i dit script gøre noget i denne stil:

function someScript()
{
  document.getElementById('<%=myTextBox.ClientID%>');
}

mvh
Avatar billede kak Nybegynder
18. april 2006 - 21:03 #20
Ok, det virker. Min formview hedder "formview1", og ved at kigge på html-koden fandt jeg ud af, at id'et bliver til formview1_myTextBox

Smider du et svar, så du kan få point?
Avatar billede snepnet Nybegynder
18. april 2006 - 21:15 #21
kommer her :o)
mvh
Avatar billede snepnet Nybegynder
18. april 2006 - 21:15 #22
husk arne
mvh
Avatar billede kak Nybegynder
18. april 2006 - 21:54 #23
arne, smider ud også et svar?
Avatar billede arne_v Ekspert
18. april 2006 - 22:05 #24
jeg synes at snepnet har fortjent dem alle - jeg havde kun et par
indskudte bemaerkninger for at markere at der er andet en AJAX i denne verden
Avatar billede kak Nybegynder
18. april 2006 - 22:29 #25
Ok, men tak til jer begge!
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
IT-kurser om Microsoft 365, sikkerhed, personlig vækst, udvikling, digital markedsføring, grafisk design, SAP og forretningsanalyse.

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester