弹出选择编辑风格(SmartWeb:RefColumn)
需要指定EditorClientScriptUrl(htc文件名称)和ExtendedProperties(通常指定要赋值的栏位、来源栏位、数据源页面)属性
例:
<SmartWeb:RefColumn ColumnName="Creator" HeaderText="Creator" EditorClientScriptUrl="MyRef.htc" ExtendedProperties = "<?xml version='1.0'? ><Info idColumn='Creator' ><RefInfo idColumn='UserID' nameColumn='UserID' url='SelectUser.aspx' ></RefInfo ></Info >" / >
在数据源页面中检索出可供弹出选择的数据,并在窗口关闭时返回数据。
MyRef.htc代码示例:
<PUBLIC:COMPONENT >
<PUBLIC:PROPERTY NAME="grid"/ ><!--返回当前的Grid,通过该属性,可以访问当前Grid的相关信息-- >
<!--和.Net中的DataColumn的定义类似-- >
<PUBLIC:PROPERTY NAME="columnName"/ > <!--列名-- >
<PUBLIC:PROPERTY NAME="dataType"/ ><!--数据类型,如System.String,和SmartGridColumn上的DataType的值保持一致-- >
<PUBLIC:PROPERTY NAME="allowNull"/ ><!--是否允许为空-- >
<PUBLIC:PROPERTY NAME="scale"/ >
<PUBLIC:PROPERTY NAME="precision"/ ><!--精度,主要用于数字型-- >
<PUBLIC:PROPERTY NAME="maxLength"/ ><!--最大长度,主要用于文本-- >
<PUBLIC:PROPERTY NAME="extendedProperties"/ ><!--一般用xml串,因为在存储很多信息时,解析非常方便-- >
<PUBLIC:METHOD NAME="select"/ ><!--全选。由于参照编辑框由INPUT、IMG组成,所以需要改写(重载)select方法-- >
<PUBLIC:METHOD NAME="focus" ><!--置焦点。由于参照编辑框由INPUT、IMG组成,所以需要改写(重载)focus方法-- >
<PUBLIC:PROPERTY NAME="input" GET="getInput"/ >
<PUBLIC:PROPERTY NAME="value" GET="getValue" PUT="setValue"/ >
<PUBLIC:METHOD NAME="cellDataCheck"/ >
</PUBLIC:COMPONENT >
<script language="javascript" >
var id = null;
//参照一般有两个值,一个是显示的Text,一个是id。idColumn指明id的Grid列
var idColumn = null;
var refUrl = null;
var refIdColumn = null;
var refNameColumn = null;
var extendedProp = element.extendedProperties;
if(extendedProp!= null && typeof(extendedProp) != "undefined")
{
var dom = new ActiveXObject("MSXML.DOMDocument");
dom.loadXML(extendedProp);
idColumn = dom.documentElement.getAttribute("idColumn");
var refInfo = dom.documentElement.firstChild;
refIdColumn = refInfo.getAttribute("idColumn");
refNameColumn = refInfo.getAttribute("nameColumn");
refUrl = refInfo.getAttribute("url");
}
var btn = element.getElementsByTagName("IMG")[0];
btn.onclick = btnClick;
function btnClick()
{
var ret = window.showModalDialog(refUrl,self,'scrolling:no;resizable:no;status:no;dialogWidth:550px;dialogHeight:450px;center:1');
if(ret != null)
{
var el = ret.documentElement.firstChild;
if(el != null)
{
input.value = el.getAttribute(refNameColumn);
if(idColumn != null && idColumn!="")
{
id = el.getAttribute(refIdColumn);
grid.setCellValue(grid.row,idColumn,id);
}
}
}
}
var statusText = "";
var input = element.getElementsByTagName("INPUT")[0];
input.onblur = inputOnBlur;
function inputOnBlur()
{
grid.status = statusText; //可以通过grid.status来修改Grid状态条的状态。
}
function getInput()
{
return input;
}
//该方法由SmartGrid在显示编辑器时调用。由于参照编辑器由INPUT、IMG等元素组成,所以需要告知SmartGrid在设置编辑器焦点时,应该让哪个元素获得焦点!
function focus()
{
input.focus();
}
//该方法由SmartGrid在对编辑器全选时调用。由于参照编辑器由INPUT、IMG等元素组成,所以需要告知SmartGrid在全选编辑器的内容时,应该怎样进行全选!
function select()
{
input.select();
}
function setValue(val)
{
input.value = val;
if(idColumn != null)
{
var r = grid.row;
id = grid.getCellValue(r,idColumn);
}
}
function getValue()
{
return input.value ;
}
function cellDataCheck(args)
{
return ;
}
</script >
数据源页面前台示例代码:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="SelectUser.aspx.cs" Inherits="SmartGrid.SelectUser" % >
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server" >
<title >选择用户</title >
<script type="text/javascript" >
function fn_RowDbClicked(grid, ev) {
window.returnValue = grid.getSelectedData(); //返回用户选择的值xml
window.close();
}
</script >
</head >
<body >
<form id="form1" runat="server" >
<div >
<SmartWeb:SmartGrid ID="SmartGrid1" runat="server" ColumnSizeable="true" ReadOnly="True" RowHeaderVisible="True" Width="100%" Height="500px"
OnRowDblClicked="fn_RowDbClicked" >
<Columns >
<SmartWeb:TextBoxColumn ColumnName="UserID" HeaderText="用户编号" / >
<SmartWeb:TextBoxColumn ColumnName="UserName" HeaderText="用户名称" / >
</Columns >
</SmartWeb:SmartGrid >
</div >
</form >
</body >
</html >
数据源页面后台示例代码:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;
namespace SmartGrid
{
public partial class SelectUser : System.Web.UI.Page
{
string _connectionstring = "Data Source=xxx;Initial Catalog=xxx;UID=xxx;Password=xxx";
protected void Page_Load(object sender, EventArgs e)
{
if (!this.IsPostBack)
{
DataSet currentDs = new DataSet();
using (SqlConnection currentConn = new SqlConnection(_connectionstring))
{
//获取数据
currentConn.Open();
SqlDataAdapter currentSda = new SqlDataAdapter("select UID,UName from SUsers", currentConn);
currentSda.Fill(currentDs, "SUsers");
this.SmartGrid1.DataSource = currentDs.Tables["SUsers"];
this.SmartGrid1.DataBind();
currentConn.Close();
}
}
}
}
}
N