c# - Asp.net 从 Ajax 调用 C# 方法

Question

我有一个 JavaScript。我想从该脚本调用 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)        
    { 
     ..... 
     ......
    }

我在Send方法开始时设置了断点。但当时我还没有得到调试器。如何从脚本中调用 Send 方法？脚本有什么变化吗？

Answer 1

要从 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