2017-01-23 22 views
1

ボタンをクリックしたときに外部JavaScriptを使用してaspx.cs関数を呼び出そうとしています。外部jsを使用してaspx.cs関数を呼び出す(ボタンクリック時)

はここでここでScriptsフォルダに配置され、私のjavascriptのlookup.jsあるASPX

<head runat="server"> 
    <title></title> 
    <link href="style.css" rel="stylesheet" type="text/css" /> 
    <script type="text/javascript" src="<%= ResolveUrl ("~/Scripts/lookup.js") %>"></script> 
</head> 
<body> 

     <section class="webdesigntuts-workshop"> 
      <asp:ScriptManager ID='ScriptManager1' runat='server' EnablePageMethods='true' /> 
    <form id="form1" runat="server">    
     <asp:TextBox type="search" name="search" id="sform" placeholder="What are you looking for?" runat="server" />  
     <asp:TextBox type="search" name="hdnText" id="hdnText" runat="server" /> 

     <button id="Button1" runat="server" onclientclick="lookup();return false;">Search</button> 
    </form> 
</section> 

</body> 

です。

function Signup() { 
    var query = document.getElementById('<%=sform.ClientID %>').value; 


    PageMethods.lookupfromjs_Click(query); 

    function onSucess(result) { 
     alert(result); 
    } 

    function onError(result) { 
     alert('Cannot process your request at the moment, please try later.'); 
    } 
} 

ここにはaspx.cs機能があります。

protected void lookupfromjs_Click(String query) 
     { 

      if (!String.IsNullOrEmpty(query)) 
      { 
       hdnText.Text = "query= " + query + " look up number " + lookup_no++; 

       // sform.Text= "You are looking up the term " + query; 

      } 
     } 

VSまたはブラウザにはエラーはありません。しかし、私のブレークポイントはブラウザには入りません。Javaスクリプトはブラウザによって正しく読み込まれます。しかし、ボタンをクリックすると何も起こらないようです。

ご協力いただければ幸いです。

+0

これはなんですか? 'protected void lookupfromjs_Click(String query) –

+0

AFAIK aspx.csのメソッドは静的で、 '[System.Web.Services.WebMethod]'でマークする必要があります。あなたはすでにこれを試しましたか? – Kolichikov

+0

ありがとう..私は "静的"を逃した – codingyo

答えて

0

.aspxファイルを使用している場合は、webformsフレームワークを使用しています。 Webフォームを使用している場合は、コードビハインドページにイベントハンドラを持つ<asp:Button runat="server" ...></asp:Button>があるのが普通です。 postbacksを避けたい場合は、間違ったフレームワークを使用しています。

もちろん、ポストバックが不必要に重くなり、サーバー上に小さなコードスニペットを実行したい場合もあります。ページメソッドを使用することができます。

page methodとして使用できるようにするの背後にあるコードでメソッドのためには、この方法は、必要があります。

  • [WebMethod]属性で装飾すること - System.Web.Services.WebMethod
  • public static宣言すること

ページメソッドは、ページ上のコントロールでは機能しません。ページメソッドは、ajax要求を使用して呼び出されます。進行中の全面的なページ生成はありません。ページメソッドを使用しているページの更新は、メソッドが返された後にjavascriptを使用して実行する必要があります。

あなたのコード内の少なくともいくつかの異なる見かけエラーがあります:あなたのlookup.jsファイルに<%=sform.ClientID %>

  • はあなたがこれを持ってjavascriptの方法がSignup
  • と呼ばれ、まだlookup(); return false;を呼び出します。しかし、そのファイルは<script ... ></script>タグを使用して取り込まれます。これは、ブラウザによる別のリクエストであり、静的ハンドラによって処理されます。したがって、<%=sform.ClientID %>は解決されません。
  • Webメソッドが正しく定義されていないと、は、ページ内のコントロールをあたかもポストバックイベントハンドラのように扱います。
  • その他、各種

ワーキングサンプル(私の作品):

Webフォーム:

<head runat="server"> 
    <title></title> 
    <script type="text/javascript" src="<%= ResolveUrl("~/Scripts/lookup.js") %>"></script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
     <asp:ScriptManager ID="ScriptManager1" runat="server" 
      EnablePageMethods="true"> 
     </asp:ScriptManager> 
     <asp:TextBox type="search" name="search" ID="sform" placeholder="What are you looking for?" runat="server" /> 
     <asp:TextBox type="search" name="hdnText" ID="hdnText" runat="server" /> 
     <button id="Button1" onclick="Signup('<%= sform.ClientID %>', '<%= hdnText.ClientID %>');">Search</button> 
    </form> 
</body> 

はJavaScript:

function Signup(sformId, hdnId) { 
    var query = document.getElementById(sformId).value; 
    var res = PageMethods.lookupfromjs_Click(query, onSucess, onError); 
    function onSucess(result) { 
     document.getElementById(hdnId).value = result; 
     alert(result); 

    } 
    function onError(result) { 
     alert('Cannot process your request at the moment, please try later.'); 
    } 
} 

ページ方法:

[System.Web.Services.WebMethod] 
public static string lookupfromjs_Click(String query) 
{ 
    return "query was " + HttpUtility.UrlEncode(query); 
} 
+0

これは私のために働いてくれてありがとう:) – codingyo

関連する問題