论文摘要:为了使DropDownList能够动态显示多列数据,需要通过三个步骤:一是通过语句读取相关列数据,二是通过语句合成各列定长的多列项,三是为DropDownList设置特定的字体字号。
论文关键词:动态显示,多列数据
一、引言
一般情况下,DropDownList/ListBox仅显示一列数据。但在某些特殊场合,如果一个选项能够同时显示若干列相关数据,则会使数据更直观、选择更方便、能更好的满足用户的使用需要。
以图1为例,这是一个本科生毕业(设计)论文选题页面。在此页面中,有三个DropDownList控件,它们可以动态的显示多列数据。通过多列相关数据的同时显示,学生在做出选择前,可以动态的了解到某一选题当前已被其它同学选择的情况,从而更合理的进行“预选”à“终选”,较好的避免了学生选题的“扎堆”现象。
图1在DropDownList中动态显示多列数据示例
在桌面程序设计语言中,PowerBuilder通过DataWindow控件实现了此种功能,但目前常用的网页设计语言中,尚未发现可供使用的此类控件。可以通过一个DropDownList再配合一个表格类控件实现和选项相关的多项信息的同时显示,虽然这样可以“曲线救国”,但应用效果却会大打折扣。
因此,在动态网页设计时,研究如何使DropDownList中完美实现动态显示多列数据很有必要。本文以图1所示网页为例,介绍在ASP.NET的DropDownList中完美实现动态显示多列数据的方法。
二、数据准备
本例程序为一个学生选题网页,在此网页中,列出了所有指导教师的所有研究方向,供学生选择,所有学生填写志愿完毕,教师才可以根据学生选题情况,确定要指导的学生。类似的例子有于高考网上填写志愿、网上投票等。
图2列出了三个与本网页相关的数据表:题目表用于存储所有教师的所有选题,选题表用于存储所有学生的选题结果,每人限选三个,教师表用于存储所有教师的相关情况。

图2网页相关数据表
在显示选题数据前,首先需要通过SQL语句从三个数据表中生成相关数据,具体的SQL语句比较复杂,也是编写本网页的关键语句之一,故在此给出,以供参考(见图3)。
SELECT 导师姓名, 题目, 要求,
SUM(IIF(志愿号 = 1, 人数, 0)) AS 第一志愿人数,
SUM(IIF(志愿号 = 2, 人数, 0)) AS 第二志愿人数,
SUM(IIF(志愿号 = 3, 人数, 0)) AS 第三志愿人数
FROM (SELECT 题目表.编号, 教师表.姓名 AS 导师姓名, 题目表.题目, 题目表.要求, 选题表.志愿号, COUNT(*) AS 人数
FROM ((题目表 LEFT OUTER JOIN 教师表 ON 题目表.导师编号 = 教师表.编号)
LEFT OUTER JOIN 选题表 ON 题目表.编号 = 选题表.题目号)
GROUP BY 题目表.编号, 教师表.姓名, 题目表.题目, 题目表.要求, 选题表.志愿号) T GROUP BY 编号, 导师姓名, 题目, 要求
ORDER BY 导师姓名, 题目
|
图3生成显示数据的SQL语句
三、数据读取方法
通过互联网搜索,对DropDownList中实现显示多列数据的解决方案大致有两种,第一方法是通过修改图3所示的SQL语句,将DropDownList要显示的各列合成一列,然后令DropDownList绑定到生成表的指定列中。通过实验,证明这种方法在ASP.Net中是不可取的,通过图4所示的结果可知,DropDownList会将字段中的所有英文空格舍弃,这会导致列出的结果无法对齐、无法辩认。

图4数据绑定结果
第二种方法是通过ASP.Net后台程序,读取图3所示的SQL语句生成的表中的各列数据,合成DropDownList项,然后添加到DropDownList中,其结果同样为图4所示。但这种方法和第一种方法不同,我们可以通过修改语句,为每列文字后补充空格,从而使各列对齐提供了可能,而第一种方法则无法介入。
本例借鉴第二种方法,采用通过AccessDataSource与GridView结合,通过可视操作,使要添加到DropDownList中的数据直接填入GridView中(见图5),然后设GridView的Visible属性为False。再通过程序从GridView中读取数据。这种改进尽管损失了一些网页反应速度,但在较大程度上降低了程序编写难度、提高了程序的可靠性和编写效率。

图5GridView数据显示结果
通过这一改进,所需编写的向DropDownList中添加数据的程序变得非常简单(见图6)。
Protected void Page_Load(object sender, EventArgs e)
{ if (!Page.IsPostBack)
{ FillList(DropDownList1);
FillList(DropDownList2);
FillList(DropDownList3);
}
}
private void FillList(DropDownList myList) //向列表框中添加列表字符串/值
{
myList.Items.Clear(); //清空列表框中的列表值
myList.Items.Add('. 无 '); //添加一个空选列表字符串
myList.Items[0].Value = '0'; //指定本列表项的值
for (int i = 0; i < GridView1.Rows.Count; i++)
{ //生成列表字符串s,列表字符串s由以下六列组成
string s = FixString( GridView1.Rows[i].Cells[0.Text, 5) //导师姓名
+ FixString( GridView1.Rows[i].Cells[1].Text,25) //题目
+ FixString( GridView1.Rows[i].Cells[2].Text,15) //要求
+ FixString( GridView1.Rows[i].Cells[3].Text, 4) //已将本列表项选为第1志愿人数
+ FixString( GridView1.Rows[i].Cells[4].Text, 4) //已将本列表项选为第2志愿人数
+ FixString( GridView1.Rows[i].Cells[5].Text, 4); //已将本列表项选为第3志愿人数
myList.Items.Add(s); //将字符串s添加到列表中
myList.Items[i + 1].Value = GridView1.Rows[i].Cells[0].Text; //指定本列表项的值
}
}
|
图6向DropDownList中添加数据的程序
四、附加空格方法
如何为各列添加定长空格,使得各列最终对齐显示是本文的关键步骤。对于网页,只能添加中文空格,否则,即使添加再多英文空格,网页控件和网页元素都会将所有连续空格视为一个空格并合并为一个空格显示。
通过实验发现,要为某列文字后添加适当数量的中文空格,使其定长,需要的计算公式为:
整个列的规定长度+(本列字符数×2-本列字节数)/2
另外需要说明的是:计算一个字符串字节数的方法为GetByteCount();为字符串右侧添加字符(包括空格)的方法为PadRight(字符数,字符);
最后,本公式中的除以2为整除。对于包含偶数个英文字符的字符串,正好补充n/2个中文空格,对于包含奇数个个英文字符的字符串,则需在补充(int)n/2个中文空格后,还需要再增加一个英文空格。完整的附加空格程序如图7所示。附加空格后的数据对齐效果如图8所示。
private string FixString(string myText, int myLen)
{
int strLen = myText.Length; //字符串的字数(1个汉字计为1个字)
int bitLen = System.Text.Encoding.Default.GetByteCount(myText); //字符串的字节数(1个汉字计为2个字节)
if ((strLen * 2 - bitLen) % 2 == 0) //如果字符串中有偶数个英文字符,则
return myText.PadRight(myLen + (strLen * 2 - bitLen) / 2, ' ');
//返回一个添加了半数中文空格的字符串
else //否则
return myText.PadRight(myLen + (strLen * 2 - bitLen) / 2, ' ') + ' ';
//返回值时,多添加一个英文空格
}
|
图7添加空格使字符串定长程序
五、各列精确对齐方法
首先通过语句读取相关列数据时,只能用中文空格填充。在合成各列定长的多列项操作时,除了填充外,还要正确设置字体字号(字体必须是中文字体,即中文字库)。
除此之外,还有一个关键设置。 1/2 1 2 下一页 尾页 |