前后台相互调用

前后台相互调用

 

目录

一、前台调用后台... 1

1.1  JS调用后台变量... 1

1.2 JS调用后台方法... 1

1.3 JS取服务器控件值... 1

1.4 JS取用户自定义控件值  (**.ascx)  如用户控件名为ucPage.asxc. 1

1.5  JS doPostBack方式用前台控件提交事件到后台... 2

二、后台调用前台... 2

2.1 服务器调用JS. 2

2.2 后台调用前台已有变量... 3

2.3  后台访问JavaScript函数一... 3

2.4  后台访问JavaScript函数二... 3

2.5  在后台给服务器控件增加JS方法... 3

 

 

 

 

一、前台调用后台

1.1  JS调用后台变量

<td><%=str%></td>

 

1.2 JS调用后台方法

函数声明为public 后台代码(把public改成protected也可以)

public string ss()

{

return("a");

}

在html里用 <%=fucntion()% >可以调用前台脚本

<script language=javascript >

var a = " <%=ss()% >";

alert(a);

</script >

 

1.3 JS取服务器控件值

document.getElementById(‘<%=txtName.ClientID%>’).value;     //js写法

$(“#<%=txtName.ClientID%>”).val();                        //jQuery写法

 

1.4 JS取用户自定义控件值  (**.ascx)  如用户控件名为ucPage.asxc

//.ascx用户控件在本页面上的id,即<uc>标签中的ID名称

//再加上.ascx页面里面的服务器控件ID

//并用"_"连接

document.getElementById(‘<%=ucPage.ClientID%>’+”_txtID”).value;

$(“#<%=txtName.ClientID%>”+”_txtID”).val();

 

1.5  JS doPostBack方式用前台控件提交事件到后台

<script language="javascript" >

var theForm = document.forms['form1'];

 if (!theForm) {

        theForm = document.form1;

 }

function __doPostBack(eventTarget, eventArgument) {

        if (!theForm.onsubmit || (theForm.onsubmit() != false)) {

            theForm.__EVENTTARGET.value = eventTarget;

            theForm.__EVENTARGUMENT.value = eventArgument;

            theForm.submit();

        }

}

</script >

 

<input id="Button1" type="button" name="Button1" value="按钮" onclick="javascript:__doPostBack( 'Button1 ', ' ')" >

 

在.NET中，所有的服务器控件提交到服务器的时候，都会调用__doPostBack这个函数，

写程序的时候经常会需要动态的生成一些控件，比如string strButton = <input type =”button” ID=”button1”>,然后输出到页面，但是如果我们需要这个控件来执行一些服务器的功能，就比较困难了.这里我们就可以用过借用 __doPostBack这个函数来完成.

__doPostBack 是通过__EVENTTARGET,__EVENTARGUMENT两个隐藏控件向服务端发送控制信息的，__EVENTTARGET为要调用控件的名称，如果要调用的控件是子控件，用''$'或':'分割父控件:子控件, __EVENTARGUMENT是调用事件时的参数

 

 

二、后台调用前台

2.1 服务器调用JS

对于服务器端控件里调用js,不可以直接绑后台变量,要先声明一下js变量,赋值为后台变量

<script>

    var testTxt=" <%=stetValue %>";

</script>

<div>

<input type="button" onclick="return confirm('<%=stetValue %>')" value="测试" /> //客户端控件可以直接用

      <asp:Button ID="Button1" runat="server" Text="测试" OnClientClick="return confirm(testTxt)" />

</div>

 

2.2 后台调用前台已有变量

前台使用静态文本控件隐藏域，将js变量值写入其中；

后台用request["id"]来获取值；

如：

前台

<input type="hidden" name="UserName" value="xiaowang"/>
提交给后台接收
string UserName=Request["UserName"];

 

2.3  后台访问JavaScript函数一

Page.RegisterStartupScript("ggg"," <script >SetVisible(1); </script >");

 

2.4  后台访问JavaScript函数二

使用Literal类，然后

private void Button2_Click(object sender, System.EventArgs e)

{

string str;

str=" <script language= 'javascript ' >";

str+="selectRange()";

str+=" </script >";

Literal1.Text=str;

}

或

        StringBuilder map = new StringBuilder();

        map.Append("<script src=\"");

        map.Append(ConfigurationManager.AppSettings["mapAbcKey"].ToString());

        map.Append("\"  type=\"text/javascript\" charset=\"utf-8\"></script>");

        Literal js = new Literal();

        js.Text = map.ToString();

        Page.Header.Controls.Add(js);

2.5  在后台给服务器控件增加JS方法

Step1：

ddlThisTime.Attributes.Add("onchange","ddlChange('"+this.ddlThisTime.ClientID+"')");

step2:

前台增加方法ddlChange就可以了