jqueryのは..私は何をしようとしている

Question

using Visual.Web.Developer.2010.Express; 
using SQL.Server.Management.Studios.R2.Express; 

は、ボタンがクリックされたときに、いくつかのC＃を実行するためのボタンを取得している「のButton1 Clickが定義されていません」と言っスパンボタンは右、簡単に聞こえる？..私はこだわっていますこの部分で

ユーザーのキー入力がHTML入力であると、スパン（Jquery UIボタン）が作成されています。スパンをクリックするとすぐに、ユーザーが入力した内容が保存され、データベースに送信されます...まあ、まだありません。私はこれを構築しており、私はこの部分で立ち往生しています。

スパンタグの属性を使用してボタンクリックを添付しますか？

<span class="ui-state-default ui-corner-all ui-icon-disk ui-icon saveButton" title="Save" style="float:left" onclick="Button1_Click"></span> 

C＃

protected void Button1_Click(object sender, EventArgs e) 
{ 
    Console.WriteLine("Hello World"); 
} 

右、かなりシンプルなルックス？これをデバッグで実行すると、Firebugは "Button1_Clickが定義されていません"と表示します
。
。
。
ここに私にいくつかの洞察力を与えてください！事前に

私のHTML/Javascriptのコード

<script type="text/javascript"> 
    $(document).ready(function() { 

     $('.hexen').after('<span class="ui-state-default ui-corner-all ui-icon-disk ui-icon saveButton" title="Save" style="float:left" onclick="Button1_Click"></span>')// ui icon 

    .keypress(function() { 
     $(this).next('.saveButton').show(); 
    }); //adds ui icon 

     $('.ui-state-default').hover(
    function() { 
     $(this).addClass('ui-state-hover'); 
    }, function() { 
     $(this).removeClass('ui-state-hover'); 
    }); //ui icon hover 

     $('.saveButton').click(function() { 
      var id = $(this).prev().attr('id'); //used in the "data" attribute of the ajax call 
      var value = $(this).prev().val(); //used in the "data" attribute of the ajax call 

      $.ajax({ 
       type: "POST", 
       url: "Default.aspx", 
       data: "{Id: " + id + ", Value: " + value + "}", 
       dataType: "json", 
       contentType: "application/json; charset=utf-8", 
       success: function (data) { 
        console.log(data); 
       } 
      }); 
      $(this).hide(); 
     }); //runs ajax call and removes ui-icon after .saveButton is clicked 

    }); //end .ready 
</script> 

<input type="text" class="hexen" id="investigate1"/><br /> 
<input type="text" class="hexen" id="investigate2"/><br /> 
<input type="text" class="hexen" id="investigate3"/><br /> 
<input type="text" class="hexen" id="investigate4"/><br /> 
<input type="text" class="hexen" id="investigate5"/> 

ありがとう！

Answer 1

Button1_Clickは、クライアント側からonclick属性を使用して呼び出すことはできないサーバー側のボタンクリックハンドラです。

onclickは常にクライアントサイドのJavaScriptコードでハンドラまたはメソッドを検索します。

サーバーにポストバックを実行するために、ページに必要なメソッドをレンダリングするボタンコントロールAsp.Netを使用する必要があります。

Asp.Netボタンをクリックすると、必要なボタンクリックハンドラーを実行するように、現在のページをasp.netフレームワークに必要な詳細とともにサーバーに送信します。

など。このようにLinkButtonのコントロールを使用し、OnClickプロパティをButton1_ClickとOnClientClickプロパティに指定すると、クライアントサイドのjavascriptメソッドを呼び出すことができます。あなたはJavaScriptでそれに結合しているので、あなたはとにかくスパンのための「のonclick」ハンドラを必要としない、それを見てから、

<asp:LinkButton Text="Click me!" 
     OnClick="Button1_Click" runat="server" 
     OnClientClick="clientSideJavaScriptFunction()" /> 

Answer 2

：

$('.saveButton').click(....); 

また、あなたonclickハンドラスペースには、JavaScriptイベントのためのクライアント側のハンドラではなく、C＃イベント用のサーバサイドハンドラを参照しています。 onclickの値は、j​​avascriptのクライアントサイドコードで使用可能な関数でなければなりません。ボタンをクリックしてサーバーにデータを送信する場合は、javascriptでAJAXリクエスト（あなたのように）を行う必要があります。

最後に、ドキュメントのロードが完了する前に、おそらくバインドしようとしているので、JavaScriptの.saveButtonにバインドしようとしたイベントハンドラは機能しません。 afterを.hexenに呼び出した後で、イベントバインディングをdocument.readyブロックに移動します。

Answer 3

C＃での動作は正確ではありませんが、ajax呼び出しのURLで関数を参照する必要があると思います。

url: "Default.aspx/Button1_Click",

Button1_Clickこれが機能するためのパブリック関数でなければならないことがあります。

EDIT：チェックアウト、このページの「代わりにjQueryを使ってページメソッドを呼び出す」セクション：