appeler fonction javascript a partir d'un code c#

**Msysteme** · 04/05/2014, 15h44

Bonjour, j'ai un boutton search dans ma page asp.net :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<asp:Button ID="btnsearch" Text="Search" runat="server" CssClass = "button" 
                     onclick="btnsearch_Click"/>

mon code behind c# est le suivant :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
protected void btnsearch_Click(object sender, EventArgs e)
    {
        this.ClientScript.RegisterStartupScript(this.GetType(), "findAdress", "findAddress();", true);
    } //findAdress c'est une chaine que j'ai mise pour identification

Mon code javascript qui marche tres bien :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
function findAddress() {
    var address = document.getElementById("ddlAdr").value;
 
    //appeler methode c# qui retourne l'element station selectionné
 
    // script uses our 'geocoder' in order to find location by address name
    geocoder.geocode({ 'address': address }, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) { // and, if everything is ok
 
            // we will center map
            var addrLocation = results[0].geometry.location;
            map.setCenter(addrLocation);
 
            // store current coordinates into hidden variables
            document.getElementById('lat').value = results[0].geometry.location.$a;
            document.getElementById('lng').value = results[0].geometry.location.ab;
 
            // and then - add new custom marker
            var addrMarker = new google.maps.Marker({
 
                position: addrLocation,
                map: map,
                title: results[0].formatted_address
            });
        } else {
            alert('Geocode was not successful for the following reason: ' + status);
        }
    });

si je met un div et je met directement :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<div id="button2" class="button" onclick="findAddress(); return false;">Chercher</div>

tout marche bien

Mais malheureusement quand je clique sur mon boutton rien ne se passe
veuillez m'aider sachant que ma fonction javascript est dans un fichier a part :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 <head runat="server">
                <script type ="text/javascript" src="Scripts/script.js"></script>
 
    </head>

**DotNetMatt** · 05/05/2014, 10h57

La méthode RegisterStartupScript est obsolète, en principe tu dois avoir un avertissement du compilateur. Il faut passer par ClientScriptManager.RegisterClientScriptBlock.

**Beowulf59** · 05/05/2014, 11h39

De plus, il faut bien connaître la différence entre la manipulation d'un this.ClientScript et d'un ClientScriptManager classe évoquée par DotNetMatt.
De mémoire, le ClientScriptManager est à utiliser dans le cadre de postbacks asynchrones (UpdatePanel), car le ClientScript gère mal l'appel au JS dans ce cadre là.
Si ton bouton est englobé par un UpdatePanel, cela pourrait expliquer ton souci

**Msysteme** · 05/05/2014, 12h20

Merci pour vos reponses mais je n'ai pas compris :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
De mémoire, le ClientScriptManager est à utiliser dans le cadre de postbacks asynchrones (UpdatePanel), car le ClientScript gère mal l'appel au JS dans ce cadre là. 
Si ton bouton est englobé par un UpdatePanel, cela pourrait expliquer ton souci

**Beowulf59** · 05/05/2014, 14h09

En ASP.NET, tu peux utiliser un composant "UpdatePanel" pour te permettre de faire de l'AJAX (et donc du Postback asynchrone).
Quand tu utilises le composant UpdatePanel, les appels à this.ClientScript.RegisterStartupScript ne peuvent plus déclencher d'évènements Javascript, il faut passer par le ClientScriptManager.

**Msysteme** · 05/05/2014, 16h38

Le ScriptManager.RegisterClientScriptBlock marche bien mais uniquement quand je met :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

ScriptManager.RegisterClientScriptBlock(this.Page, this.GetType(), "findAdress", "findAddress();", true);

avec :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
function findAddress() {
 
    var address = document.getElementById('ddlAdr').value;
 
    // script uses our 'geocoder' in order to find location by address name
    geocoder.geocode({ 'address': address }, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) { // and, if everything is ok
 
            // we will center map
            var addrLocation = results[0].geometry.location;
            map.setCenter(addrLocation);
 
            // store current coordinates into hidden variables
            document.getElementById('lat').value = results[0].geometry.location.$a;
            document.getElementById('lng').value = results[0].geometry.location.ab;
 
            // and then - add new custom marker
            var addrMarker = new google.maps.Marker({
 
                position: addrLocation,
                map: map,
                title: results[0].formatted_address
            });
        } else {
            alert('Geocode was not successful for the following reason: ' + status);
        }
    });

Mais ce que je veux faire c'est enlever la ligne :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var address = document.getElementById('ddlAdr').value;

et passer la valeur directement dans la fonction, comme ca :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
function findAddress(address) {
 
    //var address = document.getElementById('ddlAdr').value;
 
    // script uses our 'geocoder' in order to find location by address name
    geocoder.geocode({ 'address': address }, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) { // and, if everything is ok
 
            // we will center map
            var addrLocation = results[0].geometry.location;
            map.setCenter(addrLocation);
 
            // store current coordinates into hidden variables
            document.getElementById('lat').value = results[0].geometry.location.$a;
            document.getElementById('lng').value = results[0].geometry.location.ab;
 
            // and then - add new custom marker
            var addrMarker = new google.maps.Marker({
 
                position: addrLocation,
                map: map,
                title: results[0].formatted_address
            });
        } else {
            alert('Geocode was not successful for the following reason: ' + status);
        }
    });
}

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
    protected void btnsearch_Click(object sender, EventArgs e)
    {
        String adresse = "";
        while (oDBDataReader.Read() == true)
        {
            adresse = ...;// je retourne bien une valeur
        }
        connection.Close();
 
        ScriptManager.RegisterClientScriptBlock(this.Page, this.GetType(), "findAdress", "findAddress("+adresse+");", true);
    }

Comment dois je faire

**DotNetMatt** · 05/05/2014, 19h41

Qu'est-ce que ça donne avec ceci ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

Page.ClientScript.RegisterClientScriptBlock(this.Page, this.GetType(), "findAdress", "findAddress('"+adresse+"');", true);

Il faut bien entendu échapper les apostrophes éventuellement contenues dans la variable adresse pour que ça passe.

**Msysteme** · 05/05/2014, 22h49

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

Page.ClientScript.RegisterClientScriptBlock(this.Page, this.GetType(), "findAdress", "findAddress('"+adresse+"');", true);

nest pas accepté, il me dit :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

inaccessible due to its protected level

Quand je met :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "findAdress", "findAddress('" + adresse + "');", true);

Je ne reçois rien Par contre si je donne une valeur a adresse a l’intérieur de la fonction javascript, je recois ce que je veux
et l'appel de la fonction se fait avec succés via ClientScript

aidez moi svp

**Immobilis** · 07/05/2014, 10h05

Envoyé par DotNetMatt

La méthode RegisterStartupScript est obsolète, en principe tu dois avoir un avertissement du compilateur. Il faut passer par ClientScriptManager.RegisterClientScriptBlock.

Obsolète? Je n'ai rien vu de tel sur la MSDN: http://msdn.microsoft.com/fr-fr/libr...v=vs.110).aspx

Tu pourrais utiliser seulement du jQuery

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
$(document).ready(function(){}
    var selectedAddress = "";
    $(".address").change(function(){ 
        // modifier la valeur de selectedAddress
    });
    $(".button").click(function(){ 
        // Ta fonction de recherche utilisant selectedAddress
    });
);

A+

**DotNetMatt** · 07/05/2014, 10h27

Envoyé par Immobilis

Obsolète? Je n'ai rien vu de tel sur la MSDN: http://msdn.microsoft.com/fr-fr/libr...v=vs.110).aspx

Je parlais de la méthode Page.RegisterStartupScript : http://msdn.microsoft.com/en-us/libr...v=vs.110).aspx

**Msysteme** · 07/05/2014, 11h17

je me rend compte que L'appel de la fonction javascript via c# se fait correctement, parce qu'il m'affiche le message de la fonction javascript "Geocode was not successful for the following reason:zero result", aussi la base de donnée me retourne bien une valeur adresse que je passe a l'appel de la fonction a l'interieur du register...block mais toujours je recois pas de resultat alors si j'affecte la meme valeur d'adresse a l'interieur de la fonction js tout marche bien

je n'arrive pas a comprendre c'est quoi le probleme ???

**Immobilis** · 07/05/2014, 12h31

Que contient "adresse" dans

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

"findAddress('" + adresse + "');"

**Msysteme** · 07/05/2014, 13h17

adresse contient une valeur adresse que j'extrait a partir de la BD, il est du genre "Rue tel, ville tel", quand je fais un F9 je recois bien la bonne valeur.

J'ai un drop down list contenant un SqlDataSource, sa vrai valeur est l'id de chaque client, dans le boutton search je cherche l'adresse correspondante au niveau de la BD et c'est bien adresse.

dans la fonction javascript, il y a une ligne a la fin quand je ne recois pas de resultat :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
else {
            alert('Geocode was not successful for the following reason: ' + adresse);

je lui ai assigné l'adresse que je passe a la fonction javascript findadress(adresse) mais il me retourne :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
            Geocode was not successful for the following reason:undefined

**Immobilis** · 07/05/2014, 14h19

J'ai besoin de la valeur de "adresse" qui te retourne cette erreur. Peux-tu la fournir?

**Msysteme** · 07/05/2014, 14h43

exemple "N1, kenitra"

**Immobilis** · 07/05/2014, 15h52

Il est possible que la virgule entre N1 et Kenitra coupe la valeur de la propriété. Essaye de modifier ta fonction js comme ceci:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

geocoder.geocode({ 'address': "'" + address +"'" },

**Msysteme** · 07/05/2014, 15h57

Je ne pense pas que c'est ca le probleme parce que quand je met :

geocoder.geocode({ 'address': 'N1...' }, a l'interieur de la fonction js ca marche

voila ma page asp..net je crois que c'est la ou je fais des betises

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<body onload="checkconnection()" >
        <header>
        </header>
        <div id="container" class="container">
             <div id="gmap_canvas"></div>
             <form id = "searchStation" method="post" runat ="server"> 
             <div class="actions">
                <div class="button">
                <asp:ScriptManager ID="ScriptManager1"  EnablePageMethods="true" EnablePartialRendering="true" runat="server" />
 
                <label for="gmap_where">Station de service :</label>
 
               <asp:DropDownList ID="ddlAdr" runat="server" DataSourceID="SDSStation"
                                    DataTextField="Name_Station" DataValueField="ID_station" AutoPostBack="true">
               </asp:DropDownList>
                <asp:SqlDataSource ID="SDSStation" runat="server" ConnectionString="<%$ ConnectionStrings: %>"
                                    SelectCommand="SELECT * FROM [StationsServices] order by Name_station asc"></asp:SqlDataSource>
 
                </div>
                <div id="btnClear" class="button" onclick="findAddress(); return false;">Clear All</div>
                <div id="button2" class="button" onclick="findAddress(); return false;">Chercher</div>
                <asp:Button ID="btnFind" Text = "Localiser" runat="server" CssClass ="button" 
                     onclick="btnFind_Click" /> 
                <input type="hidden" id="lat" name="lat" value="34.2500000" />
                <input type="hidden" id="lng" name="lng" value="-6.5833330" />
                <div id="button1" class="button" onclick="findPlaces(); return false;">Toutes les stations</div>
                <asp:Button id="btnImg" cssclass="button" Text="To Image" runat="server" 
                     onclick="btnImg_Click" />                
             </div>   
             </form>
             <img src="http://maps.googleapis.com/maps/api/staticmap?center=-15.800513,-47.91378&zoom=11&size=200x200&sensor=false" alt="xxxx"/>
        </div>
    </body>

**Immobilis** · 07/05/2014, 16h20

ScriptManager est à utiliser pour faire de l'AJAX. J'avoue ne l'avoir jamais utilisé autrement. Je ne sais pas ce que cela donne sans un Updatepanel. Or ta page n'a pas d'UpdatePanel.

Envoyé par Msysteme

geocoder.geocode({ 'address': 'N1...' }, a l'interieur de la fonction js ca marche

Mets un point d'arrêt sur cette ligne de ta fonction javascript. Normalement, tu devrais t'arrêter dessus. Ensuite vérifie la valeur de "adresse" et communique la nous.

**Msysteme** · 07/05/2014, 20h45

J'ai réussi a appeler la fonction avec un parametre en mettant ceci:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
private string adresseStation()
    {
        System.Data.SqlClient.SqlDataReader oDBDataReader;
 
        String Query = "SELECT * FROM [StationsServices] where ID_Station =" + ddlAdr.SelectedValue;
        String adresse = "kenitra";
        connection.Open();
        SqlCommand cmdDatabase = new SqlCommand(Query, connection);
        oDBDataReader = cmdDatabase.ExecuteReader();
 
        while (oDBDataReader.Read() == true)
        {
            adresse = oDBDataReader["Adresse"].ToString();
        }
        connection.Close();
 
        return adresse;
    }
 
 
    protected void btnFind_Click(object sender, EventArgs e)
    {
        String adresse = adresseStation();
 
        btnFind.Attributes.Add("onClick", "javascript:findAddress('" + adresse + "'); return false;");
    }

Je passe bien mon adresse a la fonction et je recois mon marker

Mais je recois toujours la meme adresse, si je cherche a marker le premier element dans le drop down je marque pour tous les autre la meme adresse, idem si je cherche le 2eme ....

Si je met un point d'arret a l'interieur du bouton, je remarque le programme s'arrete une seul fois pas a chaque click

le probleme est dans mon drop down peut etre ? le postback est il obligatoire ?

Mon programme est fou

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
function findAddress(adresse) {
 
    var address = adresse;  
 
    // script uses our 'geocoder' in order to find location by address name
    geocoder.geocode({ 'address': address }, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) { // and, if everything is ok
 
            // we will center map
            var addrLocation = results[0].geometry.location;
            map.setCenter(addrLocation);
 
            // store current coordinates into hidden variables
            document.getElementById('lat').value = results[0].geometry.location.$a;
            document.getElementById('lng').value = results[0].geometry.location.ab;
 
            // and then - add new custom marker
            var addrMarker = new google.maps.Marker({
 
                position: addrLocation,
                map: map,
                title: results[0].formatted_address
            });
        } else {
            alert('Geocode was not successful for the following reason: ' + address);
        }
    });

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
   <div id="container" class="container">
             <div id="gmap_canvas"></div>
             <form id = "searchStation" method="post" runat ="server"> 
             <div class="actions">
                <div class="button">
                <asp:ScriptManager ID="ScriptManager1"  EnablePageMethods="true" EnablePartialRendering="true" runat="server" />
 
                <label for="gmap_where">Station de service :</label>
 
               <asp:DropDownList ID="ddlAdr" runat="server" DataSourceID="SDSStation"
                                    DataTextField="Name_Station" DataValueField="ID_station" AutoPostBack="true">
               </asp:DropDownList>
                <asp:SqlDataSource ID="SDSStation" runat="server" ConnectionString="<%$ ConnectionStrings:XXX %>"
                                    SelectCommand="SELECT * FROM [StationsServices] order by Name_station asc"></asp:SqlDataSource>
 
                </div>
                <div id="btnClear" class="button" onclick="findAddress(); return false;">Clear All</div>
                <div id="button2" class="button" onclick="findAddress('N1,kenitra'); return false;">Chercher</div>
                <asp:Button ID="btnFind" Text = "Localiser" runat="server" CssClass ="button" 
                     onclick="btnFind_Click" /> 
                <input type="hidden" id="lat" name="lat" value="34.2500000" />
                <input type="hidden" id="lng" name="lng" value="-6.5833330" />
                <div id="button1" class="button" onclick="findPlaces(); return false;">Toutes les stations</div>
                <asp:Button id="btnImg" cssclass="button" Text="To Image" runat="server" 
                     onclick="btnImg_Click" />                
             </div>   
             </form>
             <img src="http://maps.googleapis.com/maps/api/staticmap?center=-15.800513,-47.91378&zoom=11&size=200x200&sensor=false" alt="xxxx"/>
        </div>

**Msysteme** · 08/05/2014, 20h47

Bonjour, j'ai pu resoudre le probleme, j'arrive a appeler la fonction javascript via le code behind en ajoutant le btn.attribute.add....

appeler fonction javascript a partir d'un code c#

ASP.NET

Discussions similaires

Partager

Partager