今天在做一个jsp的页面,然后又弹出一个对话框,并且把输入框的值返回到文本中。具体代码如下:
1 父页面
<%
...
request.setCharacterEncoding ( " GBK " ) ;
%>
<%
...
@page contentType = " text/html; charset=gb2312 "
%>
<!
DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
>
<
html
>
<
script
type
="text/javascript"
>
...
function openwindow() ... { var temp = window.showModalDialog( " NewBox.jsp " ,window, " status:no;scroll:no;dialogWidth:235px;dialogHeight:150px " ); if (temp != undefined) document.all.phone_number.value += temp + " , " ; }
</
script
>
<
head
>
<
title
>
欢迎您!
</
title
>
<
script
language
="Javascript"
src
="/js/validate.js"
></
script
>
</
head
>
<
body
>
<
form
name
="form"
method
="post"
action
="RegisterAction.jsp"
onSubmit
="return Validator.Validate(this,2);"
>
<
table
table width
="50%"
border
="1"
align
="center"
cellpadding
="4"
bordercolor
="#C0C0C0"
bordercolorlight
="#C0C0C0"
bordercolordark
="#FFFFFF"
bgcolor
="#EEEEEE"
>
<
tr
>
<
td
align
="right"
>
请输入手机号码:
</
td
>
<
td
align
="left"
>
<
label
><
font
size
="3"
color
="red"
>
<
input
type
="text"
dataType
="Mobile"
msg
="手机号码不正确"
name
="phone_number"
id
="phone_number"
/>
<
input
type
="button"
name
="add"
value
="添加"
onclick
="openwindow()"
/>
* 必填
</
font
>
[多个号码以“,”分割]
</
label
>
</
td
>
</
tr
>
<
tr
>
<
td
align
="right"
>
请输入短信内容:
</
td
>
<
td
align
="left"
>
<
textarea
name
="contents"
cols
="30"
rows
="5"
></
textarea
>
</
td
>
</
tr
>
<
tr
>
<
td
align
="right"
>
<
label
>
<
input
type
="submit"
name
="Submit"
value
="提 交"
/>
</
label
>
</
td
>
<
td
align
="left"
>
<
label
>
<
input
type
="reset"
name
="Reset"
value
="重 置"
/>
</
label
>
</
td
>
</
tr
>
</
table
>
</
form
>
</
body
>
</
html
>
2 子对话框页面
<%
...
request.setCharacterEncoding ( " GBK " ) ;
%>
<%
...
@page contentType = " text/html; charset=gb2312 "
%>
<
html
>
<
head
>
<
title
>
手机号码输入框
</
title
>
<
script
language
="Javascript"
src
="/js/validate.js"
></
script
>
</
head
>
<
body
>
<
FORM
method
=post
name
=form1
action
=""
onSubmit
="return Validator.Validate(this,2);"
>
请输入手机号码:
<
INPUT
type
=text
name
=inboxname
dataType
="Mobile"
msg
="手机号码不正确"
><
br
>
<
INPUT
type
="button"
name
=inputboxbt
value
=确定
onclick
="window.returnValue=document.all.inboxname.value;window.close();"
>
</
FORM
>
</
body
>
3 在这里要注意的是,如果弹出的对话框内容比较多涉及到翻页则不能用showModalDialog了,因为里面翻页时会弹出新的页面。所以在这里我又用了window.open(),可是又有新的情况了,就是参数传回来不方便。但网上高手毕竟还是多,今天看到别人的一个例子受到了点启发,现在把我自己写的帖出来,以供大家参考。
mobieList.jsp里的js代码如下:
function
openListwindow()
...
{ window.open( " mobieSelect.jsp " , ' newwindow ' , ' height=500, width=700, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no ' ); }
mobieList.jsp里的文本代码如下:
<
table
table width
="60%"
border
="1"
align
="center"
cellpadding
="4"
bordercolor
="#C0C0C0"
bordercolorlight
="#C0C0C0"
bordercolordark
="#FFFFFF"
bgcolor
="#EEEEEE"
>
<
tr
>
<
td
align
="right"
>
请输入手机号码:
</
td
>
<
td
align
="left"
>
<
label
><
font
size
="3"
color
="red"
>
<
input
name
="phnumber"
type
="text"
id
="phnumber"
size
="35"
/>
<
img
name
="imageField"
src
="/image/mnu_filter.gif"
width
="16"
height
="16"
border
="0"
alt
="添加"
onclick
="openListwindow()"
>
* 必填
</
font
>
[多个号码以“,”分割]
</
label
>
</
td
>
</
tr
>
<
tr
>
<
td
align
="right"
>
请输入短信内容:
</
td
>
<
td
align
="left"
>
<
textarea
name
="contents"
cols
="35"
rows
="5"
></
textarea
>
[200个汉字以内]
</
td
>
</
tr
>
<
tr
>
<
td
align
="right"
>
<
label
>
<
input
type
="submit"
name
="Submit"
value
="提 交"
/>
</
label
>
</
td
>
<
td
align
="left"
>
<
label
>
<
input
type
="reset"
name
="Reset"
value
="重 置"
/>
</
label
>
</
td
>
</
tr
>
</
table
>
mobieSelect.jsp代码如下:
<
script
language
="javascript"
type
="text/javascript"
>
...
function getSelect(oSrc) ... { var boxes = document.getElementsByName( " rowId " ); var str = "" ; isCheck = isChecked(oSrc); if (isCheck == true ) ... { for ( var i = 0 ; i < boxes.length; i ++ ) ... { if (boxes[i].checked) ... { str += boxes[i].value + " , " ; } } var str_2 = str.substr( 0 ,str.length - 1 ); window.opener.form.phnumber.value = str_2; // return str_2; } else ... { alert( " 请选择要发短信的手机号码! " ); } }function isChecked(oSrc) ... { oSrc = eval(oSrc).rowId; if (oSrc != null ) ... { for (i = oSrc.length - 1 ;i >= 0 ;i -- ) ... { if (oSrc[i].checked) ... { return true ;} } if (oSrc.checked) ... { return true ;} } return false ; }
</
script
>
<
html
>
<
head
>
<
title
>
手机号码选择页面!
</
title
>
</
head
>
<
body
>
<
form
name
="handle"
method
="post"
action
=""
>
<
table
width
="80%"
border
="1"
align
="center"
cellpadding
="4"
bordercolor
="#C0C0C0"
bordercolorlight
="#C0C0C0"
bordercolordark
="#FFFFFF"
bgcolor
="#EEEEEE"
>
<
tr
>
<
td
align
="center"
><
font
style
="font-size:16px"
>
全
<
input
type
="checkbox"
name
="all"
value
="checkbox"
onclick
="chkClick(this , handle)"
>
选
</
font
></
td
>
<
td
align
="center"
><
font
style
="font-size:16px"
>
手机号码
</
font
></
td
>
<
td
align
="center"
><
font
style
="font-size:16px"
>
手机用户
</
font
></
td
>
</
tr
>
<%
...
// 声明分页变量并初始化 // 当前页码值,最小索引值: 1 int pageNo = 1 ; // 每页面显示的资讯条数(行数) int row = 10 ; // 最大显示页数 int MAX_PAGE_NUM = 0 ; // 最大每页显示条数 int MAX_ROWCOUNT = 15 ; // 总记录数 int COUNT = 0 ; // 从请求中获取分页变量的值 String reqNo = request.getParameter( " pageNo " ); String reqRow = request.getParameter( " row " ); MobieNumberService mns = new MobieNumberService(); MAX_PAGE_NUM = mns.getPageMobieInfor(row); if (!StringUtils.isEmpty(reqNo) && NumberUtils.isNumber(reqNo) && Integer .parseInt(reqNo) > 1 ){ // 分页数不超过 MAX_PAGE_NUM 页,若需要超过 MAX_PAGE_NUM 页,则修改 MAX_PAGE_NUM if ( Integer .parseInt(reqNo) <= MAX_PAGE_NUM) pageNo = Integer .parseInt(reqNo); else pageNo= MAX_PAGE_NUM; } if (!StringUtils.isEmpty(reqRow) && NumberUtils.isNumber(reqRow) && Integer .parseInt(reqRow) > 1 ){ // 每页显示的条目在 MAX_ROWCOUNT 行以内,若需要超过 MAX_ROWCOUNT 行,则修改 MAX_ROWCOUNT if ( Integer .parseInt(reqRow) <= MAX_ROWCOUNT) row = Integer .parseInt(reqRow); else row= MAX_ROWCOUNT; } int startNum = (pageNo - 1 ) * row; /** 以上为翻页程序 **/ List li = new ArrayList(); try { li = mns.selectMobieInfor(startNum,row); COUNT = mns.getCountMobieInfor(); } catch(Exception exp ) { // exp .printStackTrace(); } Iterator it = li.iterator(); while (it.hasNext()) { MobieNumber mn = (MobieNumber) it.next();
%>
<
tr
>
<
td
align
="center"
><
input
type
="checkbox"
name
=rowId
value
="<%=mn.getMobie_number()%>"
></
td
>
<
td
align
="center"
>
<%
=
mn.getMobie_number()
%>
</
td
>
<
td
align
="center"
>
<%
=
mn.getMobie_user()
%>
</
td
>
</
tr
>
<%
...
}
%>
<
tr
>
<
td
colspan
="3"
><
label
>
<
input
type
="button"
name
="Submit3"
value
="确 定"
onclick
="getSelect(handle);window.close();"
>
</
label
>
<%
...
// 处理分页链接 out.println( " 共计: " + COUNT + " " ); if (pageNo < MAX_PAGE_NUM) out.println( " <a href='mobieSelect.jsp?pageNo= " + (pageNo + 1 ) + " &row= " + row + " '>下页</a> " ); if (pageNo > 1 ) out.println( " <a href='mobieSelect.jsp?pageNo= " + (pageNo - 1 ) + " &row= " + row + " '>上页</a> " ); out.println( " <a href='mobieSelect.jsp?pageNo=1&row= " + row + " '>首页</a> " ); out.println( " <a href='mobieSelect.jsp?pageNo= " + MAX_PAGE_NUM + " &row= " + row + " '>末页</a> " ); out.println( " 第 " + pageNo + " / " + MAX_PAGE_NUM + " 页<br/> " );
%>
</
td
>
</
tr
>
</
table
>
</
form
>
</
body
>
</
html
>
两种方法适合在不同的情况下运用。在此记录下来。算是一点总结吧,呵呵。