当前位置: 首页 > 图文教程 > 网络编程 > ASP.NET > 结合ASP.NET与JavaScript开发电子沙盘

ASP.NET
asp.net GridView控件中模板列CheckBox全选、反选、取消
asp.net GridView 删除时弹出确认对话框(包括内容提示)
asp.net DropDownList 三级联动下拉菜单实现代码
asp DataTable添加列和行的三种方法
Asp.net 页面调用javascript变量的值
asp.net 长文章通过设定的行数分页
asp.net 定时间点执行任务的简易解决办法
asp.net 页面延时五秒,跳转到另外的页面
asp.net 动态输出透明gif图片
asp.net DataList与Repeater用法区别
asp.net Javascript获取CheckBoxList的value
asp.net程序在调式和发布之间图片路径问题的解决方法
asp.net下生成英文字符数字验证码的代码
asp.net 页面版文本框智能提示JSCode (升级版)
ASP.NET URL伪静态重写实现方法
ASP.NET 2.0 中Forms安全认证
asp.net 动态添加多个用户控件
asp.net Repeater显示父子表数据,无闪烁
asp.net 无法获取的内部内容,因为该内容不是文本 的解决方法
asp.net GridView排序简单实现

结合ASP.NET与JavaScript开发电子沙盘


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-03   浏览: 82 ::
收藏到网摘: n/a

 摘 要 在基于B/S结构的网络信息系统开发中,结合ASP.NET与客户端的javascript脚本, 开发能与数据库进行交互的电子沙盘。沙盘中图标的参数存取由客户端与服务器交互完成,图标的移动和图标的信息浏览依靠客户端实现。文章结合系统开发实例,详细阐述了这一方法的实现过程。

  关键词 ASP.NET JavaScript 电子沙盘

  引 言

  ASP.NET技术是用于Web开发的全新框架,它完全基于模块与组件,给Web开发人员提供更多的灵活性,是创建Web应用程序的有效工具。ASP.NET特别适用于开发动态的Web站点,使网页与用户之间不仅仅是显示和浏览的关系,而且还是动态交互的关系。大部份的交互任务都可由ASP.NET的服务器端代码来完成。笔者为某单位开发的B/S结构网络信息系统,除一般功能外,还需要特别设计地理模块。因其众多的下属子单位的地理位置会比较频繁地发生变动,而业务工作与地理位置的配置又有着重要关系,为此,要在系统中引入基于数据库支持的电子沙盘。使各级用户按权限查看和配置子单位在地图上分布。

  电子沙盘的基本原理是在以地图为背景的网页中生成多个可以移动的图标,每一个图标代表一个子单位。但在Web上仅靠ASP.NET来实现沙盘功能是比较困难的,因为它对交互性提出了更高的要求。这主要体现在两个方面:一是沙盘与数据库服务器的交互,这主要体现在沙盘数据在数据库中的存取;二是沙盘与用户的交互,这主要体现在用户在地图中移动图标(鼠标拖动动作)以及浏览图标的信息(鼠标点击动作)两个方面。在实际操作中,沙盘与用户的交互是比较频繁的,如果每一次动作都要求浏览器和服务器建立一次往返行程,必然会受到网速、服务器性能等因素的制约,从而延长用户操作的等待时间,降低沙盘的实用性。

  为此,要引入JavaScript技术,来满足这种实时交互的需求。JavaScript是一种基于对象(Object)和事件驱动(Event Driven)并具有安全性能的脚本语言。JavaScript脚本嵌入在网页中,运行时JavaScript代码和网页一起下载到浏览器。当用户的一些操作不涉及到数据存取时,如移动图标与浏览图标信息这两项主要的沙盘操作,就可以由JavaScript脚本来实现,从而使用户、浏览器、服务器之间的三层交互变成了用户、浏览器之间的两层交互,有效提高网页反应的快速性和灵活性。

  设计思路

  本文所述的信息系统,以Windows 2000 Server+IIS5.0+.NET作为平台,采用ASP.NET+C#.NET构造程序框架, SQL Server 2000为后台数据库。针对该单位分为总部—分区—子单位三层结构,按行政级别规定了不同的权限:总部级用户具有对全部子单位的浏览权和调配权,分区级用户具有对本分区子单位的浏览权和调配权,子单位具有地理配置权。

  为尽量减少客户端与服务器的交互次数,电子沙盘的运行过程应分为三个步骤进行:第一步是在网页加载时,Web服务器从数据库服务器中提取图标参数(坐标值与基本信息),将JavaScript代码和网页一起下载到客户端;第二步是由JavaScript脚本负责执行沙盘与用户的交互(配置图标与浏览图标信息);第三步是在用户选择保存设置时,Web服务器接收来自客户端的坐标值等参数,并赋值给数据库服务器的存储过程,由存储过程执行数据的保存。

  程序设计

  1、网页加载

  Web服务器根据用户ID从数据库中提取其所属的图标参数(坐标值和基本信息),再根据坐标值将图标定位在地图中,同时将图标基本信息写入网页代码。在网页加载完毕以后,生成的图标会配置在地图上的指定位置,且附带了基本信息。节选程序如下:

private void Page_Load(object sender, System.EventArgs e) //初始化
{
if (!IsPostBack) //程序是否是第一次执行
{
string strConn=ConfigurationSettings.AppSettings["ConnectionString"];
SqlConnection cn=new SqlConnection(strConn);
SqlCommand cm9=new SqlCommand("sp_sketchmap",cn); //提取子单位名称及坐标值


cm9.CommandType=CommandType.StoredProcedure;
cm9.Parameters.Add("@unitid",SqlDbType.VarChar,50); //使用者单位编码
cm9.Parameters["@unitid"].Value=Session["unitid"].ToString();
cm9.Parameters.Add("@D1",SqlDbType.VarChar,50); //1号子单位名称
cm9.Parameters["@D1"].Direction=ParameterDirection.Output;
cm9.Parameters.Add("@D1A",SqlDbType.Int); //1号子单位横坐标
cm9.Parameters["@D1A"].Direction=ParameterDirection.Output;
cm9.Parameters.Add("@D1B",SqlDbType.Int); //1号子单位纵坐标
cm9.Parameters["@D1B"].Direction=ParameterDirection.Output;
cm9.Parameters.Add("@D1C",SqlDbType.VarChar