Avatar billede kxh Nybegynder
22. maj 2006 - 11:27 Der er 24 kommentarer og
1 løsning

Onmouseover - kald funktion i C#

Hej

Jeg vil gerne have en række billeder, når brugeren flytter musen
over billederne, skal der kaldes en funktion i min c# kode, som henter den tilhørende tekst til billedet, men hvordan får jeg
onmouseover til at aktivere en funktion i C# - kald

private void test()
{
.... henter data fra en sqldatabase ....
}


med venlig hilsen

Kim Hansen
Avatar billede thesurfer Nybegynder
22. maj 2006 - 11:35 #1
Normalt henter man ikke data'ene (teksterne) ind i JavaScript, og henter dem derfra.
Det sparer en masse tid, og det er ofte det brugeren kigger på.
Avatar billede kxh Nybegynder
22. maj 2006 - 11:38 #2
hmm... ville nu være rart hvis jeg kunne kalde en c# funktion
Avatar billede Simon Praktikant
22. maj 2006 - 13:01 #3
Jeg ved ikke lige hvordan man kalder funktionen fra java. Men jeg ville foreslå at du brugte tooltip attributten. Denne sætter du for hvert billede evt. fra din c# kode, og så vises teksten automatisk når man bevæger musen over billedet.
Avatar billede kxh Nybegynder
22. maj 2006 - 13:38 #4
Hej Simi

Det var en ide, men jeg vil gerne have teksten vist i en label eller lign,
da en tooltip hurtigt bliver for uoverskuelig til den produkt tekst der skal stå.
Overvejede lidt om man skulle over i javascript og lave noget GetElementByID eller lign.
Avatar billede snepnet Nybegynder
22. maj 2006 - 13:49 #5
Du kan se et eksempel på hvordan du kan gøre den slags her.... Der er flere varianter over temaet, men eksemplet er ganske grundlæggende.
Jeg synes for øvrigt også du bør lade teksterne følge med ud i html'en, fremfor at kalde serveren for hvert tooltip der skal vises.
Mvh
Avatar billede kxh Nybegynder
22. maj 2006 - 13:51 #6
Snerept...

Ville du ligge et eksempel eller ?
Jeg vil helst ikke bruge tooltip, bare en række med x antal billeder, når musen
køres over skal teksten i label ændres, og evt. vises en stor udgave af billedet.

// Kim
Avatar billede snepnet Nybegynder
22. maj 2006 - 13:55 #7
Hehe ... der smuttede lige et link der :o)
http://www.eksperten.dk/spm/681658

Bruger du ASP.NET 2.0?
(Så er der lidt andre måder at gøre det på)

Mvh
Avatar billede kxh Nybegynder
22. maj 2006 - 13:57 #8
Hej

Det er asp.net 2.0 - kodet i c#
Avatar billede snepnet Nybegynder
22. maj 2006 - 14:14 #9
Så kan du lave det med callbacks, hvilket i praksis betyder at du skal implementere et interface på din form, og skrive både lidt javascript og lidt C# - kode.

Du kan se et eksempel her:

// aspx-fil
<%@ 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)
    {
        switch (eventArgument)
        {
            case "8000":
                callbackResult = "ÅRHUS";
                break;
            case "5000":
                callbackResult = "ODENSE";
                break;
            default:
                callbackResult = "UKENDT";
                break;
        }       
    }
    #endregion
}

Mvh
Avatar billede kxh Nybegynder
22. maj 2006 - 14:28 #10
Hejsa

jeg får følgnde fejl...
The target '__Page' for the callback could not be found or did not implement ICallbackEventHandler.

// få sat callbackfunction
Line 24:        _callbackFunction = Page.ClientScript.GetCallbackEventReference  (this, "arg", "setByNavn", "context");
Avatar billede snepnet Nybegynder
22. maj 2006 - 14:48 #11
Det lyder jo som om interfacet ikke er implementeret... Er det mit du har taget direkte, eller er det noget af dit eget, hvor du så ikke har implementeret interfacet som på denne klasse:
public partial class CallbackSample : System.Web.UI.Page, ICallbackEventHandler

Mvh
Avatar billede kxh Nybegynder
22. maj 2006 - 14:49 #12
det var din kode direkte, jeg checker lige det hele igennem engang mere.
Avatar billede kxh Nybegynder
22. maj 2006 - 14:56 #13
Hej snerpet,

Det var lige en smutter, havde ikke får ICallbackEventHandler sat på.

// Kim
Avatar billede snepnet Nybegynder
22. maj 2006 - 15:09 #14
Ok :o)
Avatar billede kxh Nybegynder
22. maj 2006 - 15:17 #15
Hej snerpet

Jeg kan godt se ideen i koden, virker til noget jeg skal undersøge nærmere, hvis man kan undgå at skærmen skal opdatere hvergang data skal valideres.

Jeg skal have lagt event over på mouseover på billedet,
i stil med
this.Image1.Attributes["onmouseover"] += "hentByNavn(this.value, '" + txtBy.ClientID + "');";

men hvordan får jeg angivet et værdi, så funktion ved hvilke tekst der skal hentes, altså på samme måde som når man taster et postnummer ind ?

// Kim
Avatar billede kxh Nybegynder
22. maj 2006 - 15:25 #16
Det blev hurtigt løst

this.Image1.Attributes["onmouseover"] += "hentByNavn('1', '" + txtBy.ClientID + "');";

Nu skal jeg bare have lavet så jeg kan få vist billedet i en anden imagebox
Avatar billede kxh Nybegynder
22. maj 2006 - 15:37 #17
snerpet, hvordan får jeg den til at udfører to funktioner ved mouseover,
jeg kan godt få teksten til at ændre sig nu, men har problemer med selve billedet
da det jo skal behandles i en ny funktion, da man jo 'kun' kan retuner en værdi ?

// Kim
Avatar billede snepnet Nybegynder
22. maj 2006 - 16:33 #18
Hvaba' - kalder du snerpet :oD

Du kan bare kalde en metode der kalder to andre, eller også kan du kalde to direkte ved at seperere kaldene med ; - altså så du på mouseover-attributten får:
onmouseover="kald1();kald2();"

Det er rigtigt at du kun kan returnere én værdi, men du kan jo eksempelvis returnerer sådan noget her:

21;http://www.site.dk/images/someImage.jpg

Og det kan du så adskilde inden du benytter værdierne.

Mvh
Avatar billede snepnet Nybegynder
22. maj 2006 - 16:34 #19
Altså adskilde så du får
21
og
http://www.site.dk/images/someImage.jpg
... Bare et eksempel.
Mvh
Avatar billede kxh Nybegynder
22. maj 2006 - 19:13 #20
Hejsa - sorry med navnet ;-) den var slem, snepnet...

Skal der noget specielt til, for at ændre imageurl på et image, det vil bare ikke
virke ?

// Kim
Avatar billede snepnet Nybegynder
22. maj 2006 - 21:54 #21
Hoget specielt ... nøh .... du skal ændre src-attributten.
Hvordan gør du nu?
Mvh
Avatar billede kxh Nybegynder
23. maj 2006 - 07:42 #22
Hej snepnet

det er nærmere selve callback funktionen der fejler, mangler targetID, har prøvet
at lave en eksakt kopi af den forrige kode.

// Kim
Avatar billede kxh Nybegynder
23. maj 2006 - 08:13 #23
Hej igen snepnet

Jeg smider lige koden, den er nok helt tosset, men måske er jeg på rette vej
Generelt er der to billeder, når man kører over dem skal Image3 sættes lig det
billede man er har musen over, plus en tekst skal vises i txtBy

// ASPX
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="kxh01.aspx.cs" Inherits="Webpages_Diverse_kxh01" %>

<!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 id="Head1" 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 GetPic(arg, TargetID)
    {
    var  context=new Object();
    context.TargetId = targetId;
   
   
   
    <%= CallbackFunctionImage %>
   
  }
   
 
   
    function setByNavn(result, context)
    {
        document.getElementById(context.TargetId).value = result;
     
    }     
   
      function setPicture(result, context)
    {
        document.getElementById(context.TargetId).src = result;
 
    } 
   
 
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <asp:TextBox id="txtPostnummer" runat="server" />&nbsp;
        <br />
        <asp:TextBox id="txtPostnummer2" runat="server" />
        <asp:TextBox id="txtBy2" runat="server" />           
        <br />
        <br />
        <br />
        <asp:Label ID="Label1" runat="server" Text="Label" Width="348px"></asp:Label>
        <br />
        <br />
        <br />
        <br />
        <asp:Image ID="Image1" runat="server" ImageUrl="~/Graphics/ProduktBilleder/produkt_test01.jpg" Height="113px" Width="158px" />
        <asp:Image ID="Image2" runat="server" ImageUrl="~/Graphics/ProduktBilleder/produkt_test02.jpg" Height="113px" Width="158px" />
        <br />
        <br />
        &nbsp;
        <asp:TextBox id="txtBy" runat="server" Height="98px" Width="634px" AutoPostBack="True" OnTextChanged="txtBy_TextChanged" />    <asp:TextBox id="TextBox1" runat="server" Height="98px" Width="634px" />
        <asp:Image ID="Image3" runat="server" />
    </form>
</body>
</html>

// 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 Webpages_Diverse_kxh01 : System.Web.UI.Page, ICallbackEventHandler
{
    // property med privat field
    private string _callbackFunction;
    private string _callbackFunctionImage;

    public string CallbackFunction
    {
        get { return _callbackFunction; }
    }

    public string CallbackFunctionImage
    {
        get { return _callbackFunctionImage; }
    }
 
    protected void Page_Load(object sender, EventArgs e)
    {
       
        // få sat callbackfunction
        _callbackFunction = Page.ClientScript.GetCallbackEventReference(this, "arg", "setByNavn", "context");
        _callbackFunctionImage = Page.ClientScript.GetCallbackEventReference(this, "arg", "setPicture", "context");

        // sørg for at der clientside kaldes, når brugeren forlader feltet
        this.Image1.Attributes["onmouseover"] += "hentByNavn('1', '" + txtBy.ClientID + "');";
        this.Image2.Attributes["onmouseover"] += "hentByNavn('2', '" + txtBy.ClientID + "');GetPic('1','" + Image3.ClientID + "');";
    }

    #region ICallbackEventHandler implementering

    string callbackResult;
   

    public string GetCallbackResult()
    {
        return callbackResult;
    }

    public void RaiseCallbackEvent(string eventArgument)
    {
        switch (eventArgument)
        {
            case "1":
                callbackResult = "110_1.jpg";
                break;
            case "2":
                callbackResult = "VICTOR.jpg";
                break;
            default:
                callbackResult = eventArgument.ToString();
                break;
        }
    }

    // IMAGE

    string callbackImageResult;
    public string GetCallbackImageResult()
    {
        return callbackImageResult;
    }


// Kim
Avatar billede kxh Nybegynder
23. maj 2006 - 12:42 #24
Hej snepnet

Hvis du vil ligge et svar så får du points, jeg fik løst det med dit forslag
plus lidt yderligere javascript

// Kim
Avatar billede snepnet Nybegynder
23. maj 2006 - 13:48 #25
Ok fint :o) - hoppede ellers ud på spørgsmålet for at kigge på det du sendte tidligere :o)
Mhv
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