在我的示例项目中，我的webform1包含一个用户控件和一个webservice - Service1。用户控件包含一个gridview，我在应用启动时填充了5行测试数据（5列并在每个需求的gridview中使用boundfields）。我还在gridview rowdatabound事件中填充一个列表，该列表将作为gridview boundfields之一（第二个字段/列）的工具提示列表。
在webservice（Service1）中，我创建了一个（虚拟）列表，用于在webform1中的用户控件中设置工具提示列表。该虚拟列表包含测试数据。当页面加载时，我使用Jquery从Service1中的列表加载虚假工具提示。然后我可以将鼠标悬停在第[1]列的gridview中的单元格上，并查看这些示例工具提示。一切正常。
我需要的是能够使用用户控件中的工具提示列表 - 在Service1 webservice中使用该列表。我怎么能做到这一点？下面列出了整个示例项目：
- webform1标记并调用用户控件
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="ws_JQueryAjax_sample.WebForm1" %>
<%@ Register TagPrefix="uc" TagName="ucWF" Src="ucWF1.ascx" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>WebForm1</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<uc:ucWF ID="ucWFa" runat="server" />
</div>
</form>
</body>
</html>
- 用户控制标记和脚本
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="ucWF1.ascx.cs" Inherits="ws_JQueryAjax_sample.ucWF1" %>
<script type="text/javascript" src="/Scripts/jquery.min.js"></script>
<script src="/Scripts/jquery-1.11.3.js"></script>
<link rel="stylesheet" href="/Content/bootstrap.min.css" />
<script src="/Scripts/bootstrap.min.js"></script>
<script type="text/javascript">
$(function () {
$.ajax({
type: "POST",
url: "Service1.asmx/GetMyStuff_M",
contentType: "application/json;charset=utf-8",
data: {},
dataType: "json",
success: function (data) {
$('[id*=GridViewA] tr').each(function (n) {
$(this).find("td:eq(1)").each(function () {
var titel = typeof (data.d[n - 1]) === 'undefined' ? "" : data.d[n - 1].firstN + "<br />" + data.d[n - 1].lastN;
$(this).tooltip({ title: $(this).addClass("colr-tooltip"), title: titel, html: true, placement: "bottom" });
});
});
},
error: function (err) {
alert("ucWF2 -- error " + JSON.stringify(err, null, 2));
console.log("AJAX error in request: " + JSON.stringify(err, null, 2));
}
});
});
</script>
<style type="text/css">
.colr-tooltip + .tooltip > .tooltip-inner
{
width: 200px;
max-width: 600px !important;
background-color: gainsboro;
color: blue;
text-align: left;
opacity: 1;
filter: alpha(opacity=100);
-moz-box-shadow: 0 0 5px 2px black;
-webkit-box-shadow: 0 0 5px 2px black;
box-shadow: 0 0 5px 2px black;
}
</style>
<div>
<asp:GridView ID="GridViewA" runat="server" AutoGenerateColumns="false" OnRowDataBound="GridViewA_RowDataBound" ShowFooter="true" AllowPaging="true" PageSize="10">
<Columns>
<asp:BoundField DataField="itm0" HeaderText="itm0A" />
<asp:BoundField DataField="itm1" HeaderText="itm1B" />
<asp:BoundField DataField="itm2" HeaderText="itm2C" />
<asp:BoundField DataField="itm3" HeaderText="itm3D" />
<asp:BoundField DataField="itm4" HeaderText="itm4E" />
</Columns>
</asp:GridView>
</div>
- 背后的用户控制代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Drawing;
namespace ws_JQueryAjax_sample
{
public partial class ucWF1 : System.Web.UI.UserControl
{
stuffB1 ttl;
public List<stuffB1> toolTipLst;
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
toolTipLst = new List<stuffB1>();
List<stuffA1> lstA = new List<stuffA1>()
{
new stuffA1{itm0="a1", itm1="111", itm2="apple", itm3="anna smith", itm4="aaa"},
new stuffA1{itm0="b1", itm1="222", itm2="banana", itm3="charlie sheen", itm4="ccc"},
new stuffA1{itm0="c1", itm1="333", itm2="cow", itm3="charlie sheen", itm4="ccc"},
new stuffA1{itm0="d1", itm1="444", itm2="donut", itm3="danielle monet", itm4="ddd"},
new stuffA1{itm0="e1", itm1="555", itm2="egret", itm3="emelio esteban", itm4="eee"}
};
GridViewA.DataSource = lstA;
GridViewA.DataBind();
}
}
protected void GridViewA_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
e.Row.Cells[1].ForeColor = Color.Red;
ttl = new stuffB1() { firstN = e.Row.Cells[2].ToString(), lastN = e.Row.Cells[3].ToString() };
toolTipLst.Add(ttl);
}
}
}
public class stuffA1
{
public string itm0 { get; set; }
public string itm1 { get; set; }
public string itm2 { get; set; }
public string itm3 { get; set; }
public string itm4 { get; set; }
}
public class stuffB1
{
public string firstN { get; set; }
public string lastN { get; set; }
}
}
- 后面的Service1代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
namespace ws_JQueryAjax_sample
{
/// <summary>
/// Summary description for Service1
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line.
[System.Web.Script.Services.ScriptService]
public class Service1 : System.Web.Services.WebService
{
List<stuffC> lstX = new List<stuffC>() {
new stuffC{firstN="a1",lastN="b1" },
new stuffC{firstN="a2",lastN = "b2"},
new stuffC{firstN="a3",lastN="b3" },
new stuffC{firstN="a4",lastN = "b4"},
new stuffC{firstN="a5",lastN = "b5"}
};
[WebMethod()]
public stuffC[] GetMyStuff_M()
{
return lstX.ToArray();
}
}
public class stuffC
{
public string firstN { get; set; }
public string lastN { get; set; }
}
}