Asp.net从Ajax调用C#方法

时间:2022-09-05 03:17:07

I have a javascript. I want to call c# method from that script but not able to call. Here is my script

我有一个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);

My Default.aspx.cs

我的Default.aspx.cs

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

I set break point at starting of Send method. But I didn't get debugger at that point. How can I call Send method from my script? Is there any change in script?

我在Send方法的启动时设置了断点。但那时我没有得到调试器。如何从脚本中调用Send方法?脚本有什么变化吗?

1 个解决方案

#1


2  

To access asp.net method from jQuery, you have to set the EnablePageMethods property of ScriptManager to true. It's simply generates an inline JavaScript proxy for all of the appropriate methods in your page’s code-behind.

要从jQuery访问asp.net方法,必须将ScriptManager的EnablePageMethods属性设置为true。它只是为页面代码隐藏中的所有适当方法生成内联JavaScript代理。

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

Now access the page method using jQuery like

现在使用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');
            }
        });
    });

Your method should be like

你的方法应该是这样的

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

}

I get this working properly, please refer http://screencast.com/t/4VR0Gz2hOZye

我的工作正常,请参考http://screencast.com/t/4VR0Gz2hOZye

#1


2  

To access asp.net method from jQuery, you have to set the EnablePageMethods property of ScriptManager to true. It's simply generates an inline JavaScript proxy for all of the appropriate methods in your page’s code-behind.

要从jQuery访问asp.net方法,必须将ScriptManager的EnablePageMethods属性设置为true。它只是为页面代码隐藏中的所有适当方法生成内联JavaScript代理。

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

Now access the page method using jQuery like

现在使用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');
            }
        });
    });

Your method should be like

你的方法应该是这样的

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

}

I get this working properly, please refer http://screencast.com/t/4VR0Gz2hOZye

我的工作正常,请参考http://screencast.com/t/4VR0Gz2hOZye