首页 > 程序开发 > Web开发 > ASP.Net > 正文
浅谈ASP.NET客户端回调
2011-10-25 14:38:53     我来说两句      
收藏    我要投稿

最近同学要做一个项目,需求是:音乐播放器。大致UI如图:

K[N%[)FM3WENIZLLX0P@63V

点击右边的“X”图标,可以删除当前选定的这首歌。因为现实界面的代码是复制过来的,并且前辈使用的是拼接字符串,然后绑定到页面的。没有使用ASP.NET服务器控件,所以要做点击图标,然后删除的事件,与我们平时开发有所不同了。我觉得有3中方案可以解决这个问题。

1.最坏的办法,把这个UI界面使用GridView呈现,GridView是服务器控件,所以最后一列可以是ImageButton,然后就有了服务器控件事件。解决起来就是,之前的原生态的HTML代码都删除掉,然后重新写代码。同学自己就是用的这种方式,这种方法便于理解,容易修改出来。

2.使用AJAX+Handler,就是用Ajax调用一个asp.net handler处理,handler处理的好处是,结构和代码进行了分离,这种方式也是容易接受。

3.使用ASP.NET自身的回调函数。具体参考:客户端回调实现 (C#) 示例  http://msdn.microsoft.com/zh-cn/library/ms178210.aspx

     在MSDN实例中,客户端回调给出了一个解决方案:项目中需要在客户端使用JavaScr操作后台的C#代码,然后它底层实现这些原理,而这些原理都封装好了,我们按照它提供的接口和结构去实现就好了。

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Client Callback Demo</title>
    <script type="text/javascript">
        function deleteIt(_this) {
            var item = _this.parentNode.parentNode.firstChild.innerText;
            //alert(item);
            //alert("确定删除第 "+item+" 条记录吗?");
            CallServer(item,"");
        }
        function ReceiveServerData(rValue) {
            //document.getElementById("ResultSpan").innerHTML = rValue;
            alert(rValue + "页面重新加载中");
            //将页面刷新,重新读取数据库数据
            window.location.href = window.location.href
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <%= result%>
    </div>
    </form>
</body>
</html>
result是后台生成的HTML代码段。
后台实例代码:
public partial class TestPage : System.Web.UI.Page,System.Web.UI.ICallbackEventHandler
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            String cbReference = Page.ClientScript.GetCallbackEventReference(this,"arg","ReceiveServerData","context");
            //回调的JavaScript
            String callbackScript;
            callbackScript = "function CallServer(arg,context)"+
                "{"+cbReference+";}";
            //向页面添加javas代码段
            Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "CallServer", callbackScript, true);
            BindData();
        }
        protected string returnValue;
        public String result = "<table>";
        private void BindData()
        {
            DataTable mytable=new DataTable();
            mytable=GenerateData();
            for(int i=0;i<mytable.Rows.Count;i++)
            {
                //第i行第0列的值
                //result = mytable.Rows[i][0].ToString();
                
                result += "<tr><td>" + mytable.Rows[i][0].ToString() + "</td>";
                result += "<td>" + mytable.Rows[i][1].ToString() + "</td>";
                result += "<td>" + mytable.Rows[i][2].ToString() + "</td>";
                result += "<td>" + mytable.Rows[i][3].ToString() + "</td>";
                result += "<td><input type='button' onclick='deleteIt(this);' value='Delete'/></td></tr>";
            }
            result += "</table>";
        }
        //Generate the data in memory.
        protected DataTable GenerateData()
        {
……
        }
        public void RaiseCallbackEvent(String eventArgument)
        {
            //实际情况上执行数据库删除操作,此处为了演示直接返回一个字符串。
            returnValue="删除第"+eventArgument+"记录成功!";
        }

        public string GetCallbackResult()
        {
            return returnValue;
        }
   }
RaiseCallbackEvent(String eventArgumnet)和GetCallbackResult()方法是实现ICallbackEventHandler接口。
    通过这中方法,可以完成客户端和服务器端之间的交互。当然这个实例中,页面最后还是要重新刷新的,以便重新render页面。
    这是我个人的想法,不知道有没有地方理解错了,还请前辈指点。谢谢。
实例代码:http://up.2cto.com/2011/1025/20111025024028619.zip

作者:快乐八哥

点击复制链接 与好友分享!回本站首页
分享到: 更多
您对本文章有什么意见或着疑问吗?请到论坛讨论您的关注和建议是我们前行的参考和动力  
上一篇:使用ASP.NET MVC3+EF+Jquery制作文字直播系统(四)——完成篇
下一篇:asp.net带附件功能的简单发送邮件
相关文章
图文推荐
排行
热门
文章
下载
读书

关于我们 | 联系我们 | 广告服务 | 投资合作 | 版权申明 | 在线帮助 | 网站地图 | 作品发布 | Vip技术培训
版权所有: 红黑联盟--致力于做最好的IT技术学习网站