ASP.NET一对一聊天应用程序

时间:2011-08-03 12:02:43

标签: javascript jquery asp.net

我开发了一个简单的ASP.NET Ajax聊天应用程序。我想升级它。在我的项目中,我有一个在线用户列表,我点击其中一个打开一个新的Web浏览器窗口(我正在这样做javascript window.open())。现在我想改进我的项目。

我想打开动态div而不是新窗口。这也可以是一个jquery聊天框。所以我的问题是:

我将如何打开div或jquery框以及如何将我的asp.net控件(更新面板,计时器等)导入到该动态div中?

2 个答案:

答案 0 :(得分:0)

您可以使用dynamic loader plugin执行此操作(您可以在那里找到完整的示例) 首先使用ajax来调用用户控件:

$(function() {
        var content = $('#content');
        var btnAddCell = $('#btn-add-table');
        var tableid = 1
        //dynamically add a new table to the page when the add button is clicked
        btnAddCell.click(function() {
            $.dynamicLoader.loadUC({
                ucName: 'UserControls/TableWidget.ascx',
                queryString: 'tableid=' + tableid++,
                eventBindings: {
                    ready: function(wrappedData) {
                        content.append(wrappedData);
                    } //here is where we get the rendered html and attach to the row
                }
            });
            return false;
        });
    });

定义一个为控件提供服务的服务(svc),以便你的jquery可以调用它们:

    namespace DynamicLoader
{
    [ServiceContract(Namespace = "")]
    [AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]
    public class Ajax
    {
        // Add [WebGet] attribute to use HTTP GET
        [WebGet]
        [OperationContract]
        public Stream RenderUC(string path)
        {
            Page pageHolder = new Page();
            UserControl viewControl = (UserControl)pageHolder.LoadControl(path);
            pageHolder.Controls.Add(viewControl);
            StringWriter output = new StringWriter();
            HttpContext.Current.Server.Execute(pageHolder, output, true);

            //trick to output exactly what you want (without wcf wrapping it)
            return new MemoryStream(Encoding.UTF8.GetBytes(output.ToString()));
        }

        // Add more operations here and mark them with [OperationContract]
    }
}

答案 1 :(得分:0)

创建的最佳方法是在单击在线用户的链接时创建一个dnymic表格结构。 这可以使用javascript和jquery ..以及window.load()

来完成

您可以参考以下链接 它显示了像facebook和gmail这样的聊天窗口

http://20fingers2brains.blogspot.com/2013/03/gmail-facebook-style-online-chat.html