场景：要从一个列表中选择信息，填写入父页面的表单中，但是字段非常多。。。

后台查询，得到结果，放在列表中。

效果：点击选择产品。。

弹出页面：点击后面的选择产品

选择产品后：信息自动填充。。

实现：点击选择产品，js页面，查询具体的数据信息，弹出产品列表框来。。

// 选择产品信息

var choose_productInfo_listForm=null;

//选择保险公司

function choose_productInfo_list(patch){

    if(choose_productInfo_listForm&&choose_productInfo_listForm.open&&!choose_productInfo_listForm.closed) {

        choose_productInfo_listForm.focus();

        return false;

    }else{

        choose_productInfo_listForm = window.open(patch+'/product/productType/choose_productInfo_list.do','','status,scrollbars,resizable,left=10,top=0,width=900,height=700');

        choose_productInfo_listForm.focus();

    }

}

选择产品列表页面：

<html xmlns="http://www.w3.org/1999/xhtml">

<jsp:useBean id="jsonObject" class="net.sf.json.JSONObject"/>

<head>

<%@include file="/common/include.jsp" %>

<script type="text/javascript" src="${pageContext.request.contextPath }/resourcesStyle/adminjs/product/productType/product_type.js"></script>

</head>

<table class="table table-bordered">

         <tr>

           <td align="center" nowrap="nowrap" bgcolor="#f1f1f1"><strong>产品编号</strong></td>

           <td align="center" nowrap="nowrap" bgcolor="#f1f1f1"><strong>产品名称</strong></td>

           <td align="center" nowrap="nowrap" bgcolor="#f1f1f1"><strong>产品类型</strong></td>

           <td align="center" nowrap="nowrap" bgcolor="#f1f1f1"><strong>资产类型</strong></td>

           <td align="center" nowrap="nowrap" bgcolor="#f1f1f1"><strong>操作</strong></td>

         </tr>

             <c:if test="${empty pageResultVo.resultList }">

                 <tr>

                     <td align="center" colspan="9">暂无数据</td>

                </tr>

             </c:if>

             <c:if test="${not empty pageResultVo.resultList }">

                <c:forEach var="bean" items="${pageResultVo.resultList}" varStatus="i">

                     <tr ${i.count%2==1?"":"bgcolor='#f2f2f2'" }>

                       <td align="center">${bean.productNo}</td>

                       <td align="center">${bean.productName}</td>

                       <td align="center"><iaf:show typeId="053" value="${bean.productTypeNew}" /></td>

                       <td align="center"><iaf:show typeId="047" value="${bean.productType}" /></td>

                       <td align="center">

                               <a href="#" onclick="postPlatformFeeInof('${bean.productNo }')">平台费用</a>

                               &nbsp;&nbsp;

                               <input type="button" value="选择产品" onclick="chooseProduct('${bean.productNo}')" />

                               <span id="span${bean.productNo}" style="display: none;">${jsonObject.fromObject(bean)}</span>

                       </td>

                     </tr>

                 </c:forEach>

             </c:if>

       </table>

       <%@include file="/common/page_plug_in.jsp" %>

点击选择产品按钮触发js：

// 弹出框选择产品

function chooseProduct(productNo){

      var productInfoStr = $("#span"+productNo).html(); // 获取字符串信息内容。

      var productInfo =  eval('(' + productInfoStr + ')');// 将字符串内容转换为js的json对象。

      $("#productNo",window.opener.document).val(productInfo.productNo);// 产品编号

      $("#productName",window.opener.document).val(productInfo.productName);// 产品名称

      $("#rateWaitDay",window.opener.document).val(productInfo.rateWaitDay);// 最长起息日延长天数

      $("#paymentMethod",window.opener.document).val(productInfo.paymentMethod); //还款方式

      $("#pMethodShow",window.opener.document).val(productInfo.paymentMethod); //还款方式

      $("#commutingWaitDay",window.opener.document).val(productInfo.commutingWaitDay);

      $("#rateType",window.opener.document).val(productInfo.rateType);//利息利率类型0日1月2年

      $("#rateTypeShow",window.opener.document).val(productInfo.rateType);//利息利率类型0日1月2年

      $("#loanPeriodFlag",window.opener.document).val(productInfo.loanPeriodFlag);// 还款周期

      $("#lFlagShow",window.opener.document).val(productInfo.loanPeriodFlag);// 还款周期

      $("#paybackDay",window.opener.document).val(productInfo.paybackDay);// 宽限天数

      $("#fineRate",window.opener.document).val(productInfo.fineRate);// 固定罚息利率

      // $("#inPolicyFlag",window.opener.document).val(productInfo.inPolicyFlag);//是否收取保费

      $("#policyCustId",window.opener.document).val(productInfo.policyCustId);//保险公司ID

      $("#policyCustName",window.opener.document).val(productInfo.policyCustName);//保险公司名称

      $("#inPolicyId",window.opener.document).val(productInfo.inPolicyId);//保费账户

      $("#inPolicyName",window.opener.document).val(productInfo.inPolicyName);//保费账户名称

      $("#outPolicyId",window.opener.document).val(productInfo.outPolicyId);//理赔账户

      $("#outPolicyName",window.opener.document).val(productInfo.outPolicyName);//理赔账户名称

      $("#bb",window.opener.document).val(productInfo.businessContracttemplate);//合同模板

      $("#bbShow",window.opener.document).val(productInfo.businessContracttemplate);//合同模板

      $("#inPolicyFlagShow",window.opener.document).val(productInfo.inPolicyFlag);//收取保费

      $("#inPolicyFlag",window.opener.document).val(productInfo.inPolicyFlag);//收取保费

      $("#pcTypeShow",window.opener.document).val(productInfo.policyCompanyType);//保险公司类型

      $("#assignmentDays",window.opener.document).val(productInfo.assignmentDays);//转让持有天数

      $("#productType",window.opener.document).val(productInfo.productType); //资产类型

      $("#productTypeName",window.opener.document).val(productInfo.productType); //资产类型名称

      $("#productTypeNew",window.opener.document).val(productInfo.productTypeNew); //产品类型

      $("#productTypeNewName",window.opener.document).val(productInfo.productTypeNew); //产品类型名称

      $("#compensateOverDay",window.opener.document).val(productInfo.compensateOverDay);//赔付延迟天数

      window.close();// 关闭窗口

}

就这样大功告成。。

类对象传输到jsp页面。需要转换为js的json对象时，这么做。的更多相关文章

  1. 12月6日 被引入的jsp 页面，引入 js 要注意结束符 要用 </script> 而不是 />

    12月6日  被引入的jsp 页面,引入 js 要注意结束符 要用  </script> 而不是 />

  2. js中JSON对象和字符串对象相互转化

    JSON.stringify(value [, replacer] [, space]) //作用,将json数据转化为字符串value:是必须要的字段.就是你输入的对象,比如数组啊,类啊等等. re ...

  3. 原生JS：JSON对象详解

    JSON对象 支持到IE8,旧版的IE需要Polyfill 本文参考MDN做的详细整理,方便大家参考[MDN](https://developer.mozilla.org/zh-CN/docs/Web ...

  4. Js拼Json对象

     我们通常会拼字符串,但是拼字符串的话,遇见占位符会出错.  下面分享一个拼js拼json对象的方法:          var jsonArr = [];                     $ ...

  5. js遍历json对象

    原生js遍历json对象 遍历json对象: 无规律: <script> var json = [ {dd:'SB',AA:'东东',re1:123}, {cccc:'dd',lk:'1q ...

  6. js 替换json对象中的键名

      js 替换json对象中的键名 CreateTime--2018年3月30日15:38:50 Author:Marydon 情景描述: 有个json数组,现在需要将json对象中的key替换掉,值 ...

  7. js中 json对象与json字符串相互转换的几种方式

    以下总结js中 json对象与json字符串相互转换的几种方式: 一.JSON对象转化为JSON字符串 1.使用JSON.stringify()方法进行转换 该方法不支持较老版本的IE浏览器,比如:i ...

  8. jsp页面时间戳转换为时间格式

    jstl中格式化时间戳   在jsp页面中使用jstl标签将long型的时间戳转换为格式化后的时间字符串 1.通过<jsp:useBean /> 导入java.util.Date类2.通过 ...

  9. JSP如何在servlet将一个数据模型对象传递给jsp页面

    在servlet把对象放到request里,然后jsp里直接通过request取值如 在servlet:(简写了)public void doGet(request,response){UserInf ...

随机推荐

  1. 【转帖】Linux 内核系统架构

    Linux 内核系统架构   描述Linux内核的文章已经有上亿字了 但是对于初学者,还是应该多学习多看,毕竟上亿字不能一下子就明白的. 即使看了所有的Linux 内核文章,估计也还不是很明白,这时候 ...

  2. python3 爬虫利用Requests 实现下载进度条

    一.编写代码 from datetime import datetime,date,timedelta from contextlib import closing import urllib,url ...

  3. php之简单算法

    选择排序 方式:先让第一位与其他位比较大小找到最小的数字,然后是第二位与除第一位的其他位比较大小找出第二位,依此类推 $arr = [2,45,12,67,33,5,23,132,46]; for ( ...

  4. LIUNX随堂学习-3 权限

    1.权限分为三类:读r,写w,执行x 2.读r:可以ls改目录下的子文件名,子目录名 写w:可以在该目录下创建.删除.重命名 执行x:可以cd到该目录下 3. ll  (ls -l) 下详细信息的意义 ...

  5. （三）springmvc之注解的基本使用

    一.@Controller @Controller 标记一个类是Controller 二.RequestMapping  地址映射 2.1 Value的操作. 注解在类上面    (父)       ...

  6. T4模板使用笔记

    路径获取 ① 获取当前解决方案路径 string solutionsPath = Host.ResolveAssemblyReference("$(SolutionDir)"); ...

  7. Abp 添加权限项<一>

    1.下载代码,数据库迁移,npm install 2.添加权限项: public static class PermissionNames { public const string Pages_Te ...

  8. 关于mysql 自增长 主键

    我遇到过 我这样建表 ![](http://images2017.cnblogs.com/blog/1128666/201709/1128666-20170917222547078-151122413 ...

  9. c#基础知识梳理（四）

    上期回顾 - https://www.cnblogs.com/liu-jinxin/p/10826971.html 一.类 当你定义一个类时,你定义了一个数据类型的蓝图.这实际上并没有定义任何的数据, ...

  10. JS基础_函数作用域练习

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...