Jquery弹出层 提交数据

欢迎转载，请注明出处。

 

因项目需要,应桂总要求，做了一个弹出层的效果。本例使用的是Lee dialog 1.0。

原来的Lee dialog中没有提交数据，我自己修改了一下。

 

关于Lee dialog如何使用就不多说了，这里就说一下Jquery中提交数据和返回值回调。

 

点击按钮后提交数据的function

 

function jump_code() { $.ajax({ //调用jquery的ajax方法 type: "POST", //设置ajax方法提交数据的形式 url: "Add.aspx", //数据处理页面 data: "fund_code="+$("#fund_code").val(), //输入框fund_code中的值作为提交的数据;如有多个数据，则可拼接成字符串，#fund_code为输入框ID error: function(ewr){$("#error").show().html(ewr.responseText);}, //"#error"为页面中的一个div，将错误信息以Html的形式在div中展现 success: function(msg){ //提交成功后的回调，msg变量是输出的内容。 // if(msg=="") // alert("TEST"); //如果有必要，可以把msg变量的值显示到某个DIV元素中 $("#floatBoxBg").animate({opacity:"-2"},"normal",function(){$(this).hide();}); $("#floatBox").animate({top:($(document).scrollTop()-(dialogHeight=="auto"?300:parseInt(dialogHeight)))+"px"},"normal",function(){$(this).hide();}); dialogFirst=false; } }); }

 

数据处理页面Add.aspx中，只需要留下

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Add.aspx.cs" Inherits="Add" %>

其他的Html元素都可以删除掉。

在Add.aspx.cs的Ispostback中写数据处理方法。如下：

protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack)//所有数据处理必须写在IspostBack中,测试用，在C盘创建一个txt文件，将数据写人txt文件 { string strGet = Request.Params["fund_code"].ToString(); if (!string.IsNullOrEmpty(strGet)) { FileStream fs = new FileStream(@"c:/LayoutTest.txt", FileMode.OpenOrCreate, FileAccess.Write); StreamWriter m_streamWriter = new StreamWriter(fs); m_streamWriter.BaseStream.Seek(0, SeekOrigin.End); m_streamWriter.WriteLine(DateTime.Now.ToString() + "/r/n" + "内容：" + strGet + "/r/n"); m_streamWriter.Flush(); m_streamWriter.Close(); fs.Close(); } Response.Write(strGet);//返回的数据 } }

 

 进行数据处理的文件可以是.ashx 和WebService ，不过这两个还没研究过。

 

另：如果在项目中，最好使用.ashx，使用aspx，返回的是错误数据，至于原因，还不知道。(开始的时候放到项目里,把Add.aspx中的Html元素都删了，结果一直有错误。后来改用.ashx，一切OK了)

 效果图片：

 

Demo下载：http://download.youkuaiyun.com/source/1666572