如何从客户端JavaScript函数调用服务器方法后面的代码?

时间:2011-04-29 06:42:09

标签: c# javascript .net asp.net

我在ASPX页面中有一个HTML按钮单击事件的JavaScript函数。并在其代码页面后面的服务器方法。现在我想只在用户点击HTML按钮时用JavaScript函数调用服务器方法。

请不要更改此方案,也不要在回复时在aspx页面中使用任何asp.net contols。因为只允许HTML控件。谁可以帮我这个事 ?。提前致谢。急切地等待答案。

这是代码,

标记中的代码:

<script language="javascript" type="text/javascript">
    function btnAccept_onclick() {        
        var name;            
        name = document.getElementById('txtName').value;

        // Call Server side method SetName() by passing this parameter 'name'
</script>

<input type="button" id="btnAccept" value="Accept" onclick="return btnAccept_onclick()" />

代码隐藏:

public void SetName(string name)
{
    // Code for some functionality    
}

9 个答案:

答案 0 :(得分:40)

是的,你可以制作一个像...这样的网络方法。

[WebMethod]
public static String SetName(string name)
{
    return "Your String"
}

然后在JavaScript中调用它,

PageMethods.SetName(parameterValueIfAny, onSuccessMethod,onFailMethod);

这也是必需的:

<asp:ScriptManager ID="ScriptMgr" runat="server" EnablePageMethods="true"></asp:ScriptManager>

答案 1 :(得分:24)

在我的项目中,我们通常会调用服务器端方法:

JavaScript中的

document.getElementById("UploadButton").click();

服务器端控制:

<asp:Button runat="server" ID="UploadButton" Text="" style="display:none;" OnClick="UploadButton_Click" />

C#:

protected void Upload_Click(object sender, EventArgs e)
{

}

答案 2 :(得分:6)

如果你不想使用ajax而不是

Code behind 

void myBtn_Click(Object sender,EventArgs e)
{
   //SetName(name); your code
}


.aspx file

<script language="javascript" type="text/javascript">
    function btnAccept_onclick() {        
        var name;            
        name = document.getElementById('txtName').value;
        document.getElementById('callserver').click();
        // Call Server side method SetName() by passing this parameter 'name'
</script>


<div style="dispaly:none;">
  <input type="button" id="callserver" value="Accept" click="myBtn_Click" runat="server" />
</div>
<input type="button" id="btnAccept" value="Accept" onclick="return btnAccept_onclick()" />

或使用页面方法

.cs file
[ScriptMethod, WebMethod]

   public static string docall()
   {
      return "Hello";
   }

.aspx file

<script type="text/javascript">
      function btnAccept_onclic() {
          PageMethods.docall(onSuccess, onFailure);
      }

  function onSuccess(result) {
          alert(result);
      }


      function onFailure(error) {
          alert(error);
      } 

</script>

检查一下:http://blogs.microsoft.co.il/blogs/gilf/archive/2008/10/04/asp-net-ajax-pagemethods.aspx

答案 3 :(得分:1)

Ajax是要走的路。最简单(也可能是最好)的方法是jQuery ajax()

你最终会写这样的东西:

$.ajax({
  url: "test.html",
  context: document.body,
  success: function(){
    // do something when done
  }
});

答案 4 :(得分:1)

// include jquery.js
//javascript function
var a1="aaa";
var b1="bbb";
                         **pagename/methodname**     *parameters*
CallServerFunction("Default.aspx/FunPubGetTasks", "{a:'" + a1+ "',b:'" + b1+ "'}",
            function(result)
            {

            }
);
function CallServerFunction(StrPriUrl,ObjPriData,CallBackFunction)
 {

    $.ajax({
        type: "post",
        url: StrPriUrl,
        contentType: "application/json; charset=utf-8",
        data: ObjPriData,
        dataType: "json",
        success: function(result) 
        {
            if(CallBackFunction!=null && typeof CallBackFunction !='undefined')
            {
                CallBackFunction(result);
            }

        },
        error: function(result) 
        {
            alert('error occured');
            alert(result.responseText);
            window.location.href="FrmError.aspx?Exception="+result.responseText;
        },
        async: true
    });
 }

//page name is Default.aspx & FunPubGetTasks method
///your code behind function
     [System.Web.Services.WebMethod()]
        public static object FunPubGetTasks(string a, string b)
        {
            //return Ienumerable or array   
        }

答案 5 :(得分:1)

我必须将我的buttonid注册为postbacktrigger ...

RegisterPostbackTrigger(idOfButton)

答案 6 :(得分:1)

JS代码:

getcwd

HTML代码:

buf.len()

C#背后的代码

<script type="text/javascript">
         function ShowCurrentTime(name) {
         PageMethods.GetCurrentTime(name, OnSuccess);
         }
         function OnSuccess(response, userContext, methodName) {
          alert(response);
         }
</script>

答案 7 :(得分:0)

尝试创建新服务并调用它。处理可以在那里完成,然后返回。

http://code.msdn.microsoft.com/windowsazure/WCF-Azure-AJAX-Calculator-4cf3099e

function makeCall(operation){
    var n1 = document.getElementById("num1").value;
    var n2 = document.getElementById("num2").value;
if(n1 && n2){

        // Instantiate a service proxy
        var proxy = new Service();

        // Call correct operation on vf cproxy       
        switch(operation){

            case "gridOne":
                proxy.Calculate(AjaxService.Operation.getWeather, n1, n2,
 onSuccess, onFail, null);

****HTML CODE****
<p>Major City: <input type="text" id="num1" onclick="return num1_onclick()"
/></p>
<p>Country: <input type="text" id="num2" onclick="return num2_onclick()"
/></p> 
<input id="btnDivide" type="button" onclick="return makeCall('gridOne');" 

答案 8 :(得分:0)

在我看来,user1965719提出的解决方案非常优雅。在我的项目中,所有进入包含div的对象都是动态创建的,因此添加额外的隐藏按钮非常简单:

aspx代码:     

    <asp:Button runat="server" id="btnResponse1" Text="" 
    style="display: none; width:100%; height:100%"
    OnClick="btnResponses_Clicked" />

    <div class="circlebuttontext" id="calendarButtonText">Calendar</div>
</div>    

C#代码背后:

protected void btnResponses_Clicked(object sender, EventArgs e)
{
    if(sender == btnResponse1)
    {
        //Your code behind logic for that button goes here
    }
}