2013-01-17 67 views
0

我有一個javascript。我想從該腳本調用c#方法,但無法調用。 這裏是我的腳本Asp.net從Ajax調用C#方法

(function($){ 

//define the new for the plugin ans how to call it 
$.fn.contactable = function(options) { 
    //set default options 
    var defaults = { 
     url: 'Default.aspx/Send', 
     name: 'Name', 
     email: 'Email', 
     message : 'Message', 
     subject : 'A contactable message', 
     submit : 'SEND', 
     recievedMsg : 'Thank you for your message', 
     notRecievedMsg : 'Sorry but your message could not be sent, try again later', 
     disclaimer: 'Please feel free to get in touch, we value your feedback', 
     hideOnSubmit: false 

    }; 

    //call in the default otions 
    var options = $.extend(defaults, options); 
    //act upon the element that is passed into the design  
    return this.each(function() { 
     //construct the form 
     var this_id_prefix = '#'+this.id+' '; 
     $(this).html('<div id="contactable_inner"></div><form id="contactForm" method="" action=""><div id="loading"></div><div id="callback"></div><div class="holder"><p><label for="name">'+options.name+'<span class="red"> * </span></label><br /><input id="name" class="contact" name="name"/></p><p><label for="email">'+options.email+' <span class="red"> * </span></label><br /><input id="email" class="contact" name="email" /></p><p><label for="message">'+options.message+' <span class="red"> * </span></label><br /><textarea id="message" name="message" class="message" rows="4" cols="30" ></textarea></p><p><input class="submit" type="submit" value="'+options.submit+'"/></p><p class="disclaimer">'+options.disclaimer+'</p></div></form>'); 
     //show/hide function 
     $(this_id_prefix+'div#contactable_inner').toggle(function() { 
      $(this_id_prefix+'#overlay').css({display: 'block'}); 
      $(this).animate({"marginLeft": "-=5px"}, "fast"); 
      $(this_id_prefix+'#contactForm').animate({"marginLeft": "-=0px"}, "fast"); 
      $(this).animate({"marginLeft": "+=387px"}, "slow"); 
      $(this_id_prefix+'#contactForm').animate({"marginLeft": "+=390px"}, "slow"); 
     }, 
     function() { 
      $(this_id_prefix+'#contactForm').animate({"marginLeft": "-=390px"}, "slow"); 
      $(this).animate({"marginLeft": "-=387px"}, "slow").animate({"marginLeft": "+=5px"}, "fast"); 
      $(this_id_prefix+'#overlay').css({display: 'none'}); 
     }); 

     //validate the form 
     $(this_id_prefix+"#contactForm").validate({ 
      //set the rules for the fild names 
      rules: { 
       name: { 
        required: true, 
        minlength: 2 
       }, 
       email: { 
        required: true, 
        email: true 
       }, 
       message: { 
        required: true 
       } 
      }, 
      //set messages to appear inline 
       messages: { 
        name: "", 
        email: "", 
        message: "" 
       },   

      submitHandler: function() { 
       $(this_id_prefix+'.holder').hide(); 
       $(this_id_prefix+'#loading').show(); 
$.ajax({ 
    type: 'POST', 
    url: options.url, 
    data: {subject:options.subject, name:$(this_id_prefix+'#name').val(),  email:$(this_id_prefix+'#email').val(), message:$(this_id_prefix+'#message').val()}, 
    success: function(data){ 
        $(this_id_prefix+'#loading').css({display:'none'}); 
        if(data == 'success') { 
         $(this_id_prefix+'#callback').show().append(options.recievedMsg); 
         if(options.hideOnSubmit == true) { 
          //hide the tab after successful submition if requested 
          $(this_id_prefix+'#contactForm').animate({dummy:1}, 2000).animate({"marginLeft": "-=450px"}, "slow"); 
          $(this_id_prefix+'div#contactable_inner').animate({dummy:1}, 2000).animate({"marginLeft": "-=447px"}, "slow").animate({"marginLeft": "+=5px"}, "fast"); 
          $(this_id_prefix+'#overlay').css({display: 'none'});  
         } 
        } else { 
         $(this_id_prefix+'#callback').show().append(options.notRecievedMsg); 
         setTimeout(function(){ 
          $(this_id_prefix+'.holder').show(); 
          $(this_id_prefix+'#callback').hide().html(''); 
         },2000); 
        } 
       }, 
error:function(){ 
        $(this_id_prefix+'#loading').css({display:'none'}); 
        $(this_id_prefix+'#callback').show().append(options.notRecievedMsg); 
            } 
});  
      } 
     }); 
     }); 
    }; 

})(jQuery); 

Default.aspx.cs

[WebMethod] 
    public static void Send(string subject, string name, string email, string message)   
    { 
    ..... 
    ...... 
    } 

我設定的出發斷點發送方法。但是那時我沒有得到調試器。我怎樣才能撥打從我的腳本發送方法?腳本中是否有任何更改?

+0

嗨,阿杰,你有什麼例外嗎?你可以在這裏發佈嗎? –

+0

Hello @ Joe.wang我沒有得到任何異常。我的腳本沒有調用c#方法。 –

+0

如果我遇到這樣的問題,我會簡化代碼。並刪除與Asp.net Ajax無關的代碼。我認爲這將有助於找出不工作的原因。 –

回答

2

要從jQuery訪問asp.net方法,必須將ScriptManager的EnablePageMethods屬性設置爲true。它只是爲頁面代碼隱藏中的所有適當方法生成內嵌JavaScript代理。

<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="True" 
     EnablePartialRendering="True" ScriptMode="Release"> 
</asp:ScriptManager> 

現在訪問使用jQuery的頁面方法類似

(function($) { 
     $.ajax({ 
      type: "POST", 
      url: "test.aspx/Send", 
      data: "{subject: 'hi',name:'abc',email:'def',message:'msg'}", 
      contentType: "application/json; charset=utf-8", 
      dataType: "json", 
      success: function (msg) { 
       alert('success'); 
      } 
     }); 
    }); 

你的方法應該是這樣

[WebMethod] 
public static void Send(string subject, string name, string email, string message) 
{ 

} 

我得到這個工作正常,請參閱http://screencast.com/t/4VR0Gz2hOZye

+0

Thak你的答覆我已經試過了。但出現錯誤「只能將一個ScriptManager的一個實例添加到頁面中。」我已經將它添加到主頁面 –

+0

它不起作用。我在代碼中添加了您的代碼,但無法正常工作。我無法調用方法。 –

+0

如果您在Master頁面中已經有ScriptManager,那麼只需將EnablePageMethods =「True」放入主頁面的腳本管理器。 –