ボタンクリック時のスクリプト

Question

ボタンクリック時にスクリプトを呼び出そうとしています。ここでは関数summarydataは呼び出されません。

また、コンソールをチェックすると、単一のエラーはありません。問題はどこだ？どのような解決してください？私は、Webメソッドにブレークポイントを設定し、ボタンをクリックすると、その後ブレークポイント

<button id="chartid" type="button" runat ="server">Show</button> 

CODE

[WebMethod] 
     public static string summarydata() 
     { 

      try 
      { 
       T1 sd = new T1(); 
       var data = new TrackDataEntities1().spsumdata().Select(s => new { name = s.Month, data = new int[] { s.data.Value } }).ToArray(); 
       return Newtonsoft.Json.JsonConvert.SerializeObject(data); 

      } 
      catch (Exception) 
      { 
       throw new Exception(); 
      } 

     } 

UPDATED

<script type="text/javascript"> 
      alert("iooooooooooooo"); 
      $(function() { 
       $('[ID*=chartid]').on('click', function() { 
        alert("i"); 
        $.ajax({ 
         type: "POST", 
         url: "WebForm1.aspx/summarydata", 
         contentType: "application/json; charset=utf-8", 
         dataType: "json", 
         async: true, 
         cache: false, 
         success: function (result) { 
          alert(result.d); 
          alert("i"); 
         }, 

         error: function (error) { 

          alert(error); 
         } 

        }); 
       }); 

</script> 

が

Answer 1

を呼び出すことはありません、あなたのjsのコードはする必要があります$(document).ready()

<script type="text/javascript"> 
      alert("iooooooooooooo"); 
$(document).ready(function(){ 
      $("#chartid").click(function() { 
        alert("i"); 
        $.ajax({ 
         type: "POST", 
         url: "WebForm1.aspx/summarydata", 
         contentType: "application/json; charset=utf-8", 
         dataType: "json", 
         async: true, 
         cache: false, 
         success: function (result) { 
          alert(result.d); 
          alert("i"); 
         }, 

         error: function (error) { 

          alert(error); 
         } 

        }); 
       }); 
}); 

</script> 

Answer 2

あなたは.onを（使用してのような他のオプションを試してみました）この1つの

<script type="text/javascript"> 
alert("iooooooooooooo"); 
$(document).ready(function(){ 
     $("#chartid").on("click",function() { 
       alert("i"); 
       $.ajax({ 
        type: "POST", 
        url: "WebForm1.aspx/summarydata", 
        contentType: "application/json; charset=utf-8", 
        dataType: "json", 
        async: true, 
        cache: false, 
        success: function (result) { 
         alert(result.d); 
         alert("i"); 
        }, 

        error: function (error) { 

         alert(error); 
        } 

       }); 
      }); 
}); 

</script> 

Answer 3

場所のように、文書内のボディタグ/使用$（文書）.onの終了前にスクリプトが含まれる/レディ（」 click "、"＃chartid "、function（）{}）をクリックしてください。これはルートドキュメントオブジェクトからIDを持つ要素をchartidとして検索するためです。

Answer 4

ボタンがポストバックを引き起こす可能性があります。はいの場合、問題が発生します。

$("#chartid").on("click",function() { 
    $.ajax({ 
     type: "POST", 
     url: "WebForm1.aspx/summarydata", 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     async: true, 
     cache: false, 
     success: function (result) { 
     alert(result.d); 
     alert("i"); 
     }, 
     error: function (error) { 
     alert(error); 
     } 
    }); 
    return false; 
}); 

が、それはまだ動作しない場合は、ただのボタンを変更します：

<a id="chartid" href="#" runat ="server">Show</button> 

そして、あなたはコードでchartidを変更しない場合は、これを解決するために以下のようにあなたは、機能をクリックしreturn falseを追加することができます後ろには、runat="server"は必要ありません。

<a id="chartid" href="#">Show</button>