帆软报表（finereport）图表钻取详细类别当前页对话框展示 | V2AS - 问路

帆软报表（finereport）图表钻取详细类别当前页对话框展示

阅读原文时间：2023年07月09日阅读：1

添加参数栏，季度下拉框的控件命名为 jd

这里添加雷达图做案例

编辑→特效→ 添加JavaScript

参数：wd 值：分类名 #取雷达图所点击的点

参数：jd 值：公式$jd #取参数下拉所选参数

JavaScript详细:

var iframe = $("") // iframe参数的命名及宽高等 <br /> if (wd == '纬度1') { //判断点击到的点，根据所选纬度弹出明细对话框 <br /> iframe.attr("src", "report?viewlet=/test/明细1.cpt&op=view&jd=" + jd + "") <br /> } else if (wd == '纬度2') { <br /> iframe.attr("src", "report?viewlet=/test/明细2.cpt&op=view&jd=" + jd + "") <br /> } else if (wd == '纬度3') { <br /> iframe.attr("src", "report?viewlet=/test/明细3.cpt&op=view&jd=" + jd + "") <br /> } else if (wd == '纬度4') { <br /> iframe.attr("src", "report?viewlet=/test/明细4.cpt&op=view&jd=" + jd + "") <br /> } else if (wd == '纬度5') { <br /> iframe.attr("src", "report?viewlet=/test/明细5.cpt&op=view&jd=" + jd + "") <br /> } else if (wd == '纬度6') { <br /> iframe.attr("src", "report?viewlet=/test/明细6.cpt&op=view&jd=" + jd + "") <br /> } else if (wd == '纬度7') { <br /> iframe.attr("src", "report?viewlet=/test/明细7.cpt&op=view&jd=" + jd + "") <br /> } else if (wd == '纬度8') { <br /> iframe.attr("src", "report?viewlet=/test/明细8.cpt&op=view&jd=" + jd + "") <br /> } else if (wd == '纬度9') { <br /> iframe.attr("src", "report?viewlet=/test/明细9.cpt&op=view&jd=" + jd + "") <br /> } <br /> var o = { <br /> title: wd, //对话框标题(这里取雷达图纬度名作弹出框标题) <br /> width: 1265, //宽统一宽高 <br /> height: 370 //高 <br /> } <br /> FR.showDialog(o.title, o.width, o.height, iframe, o) //弹出对话框</p> <p>或者：*可单独定义每个弹出框的宽高</p> <p>var url = "";</p> <p>var title = ""</p> <p>var o = ""</p> <p>if(wd=="纬度1"){</p> <pre><code>url = "report?viewlet=/test/纬度1详细.cpt&op=view&jd=" + jd + ""; title = wd; o = { width : 1265, //对话框宽度 height: 370 //对话框高度 }; </code></pre> <p>}else if(wd=="纬度2"){</p> <pre><code>url = "report?viewlet=/test/纬度2详细.cpt&op=view&jd=" + jd + ""; title = wd; o = { width : 1265, //对话框宽度 height: 370 //对话框高度 }; </code></pre> <p>}</p> <p>var iframe = $("<iframe id='inp' name='inp' width='100%' height='100%' scrolling='yes' frameborder='0'>"); // 对话框内iframe参数的命名，默认宽高占比是100%，可向下滚动 </p> <p>iframe.attr("src", url); // 给iframe添加src属性 </p> <p>//弹出对话框</p> <p>FR.showDialog(title, o.width, o.height, iframe,o);</p> <p>发现在决策系统里打开弹出框报错，首次访问时跳转到明细的链接不正确</p> <p><img class='lazyload' data-src="https://article.cdnof.com/2307/4e2e0c60-6bf4-4b24-a983-298f1589ff7d.png" alt="" /></p> <p>修改JavaScript</p> <p><img class='lazyload' data-src="https://article.cdnof.com/2307/90340885-bc6f-42ff-a87d-09ad733f5ff5.png" alt="" /></p> <p>添加url参数:</p> <p>公式= "http://"+serverName+":"+serverPort+servletURL+"?viewlet="</p> <p>修改链接：</p> <p>iframe.attr("src", url"+/test/明细1.cpt&op=view&jd=" + jd + "")</p> <p>预览效果:</p> <p><img class='lazyload' data-src="https://article.cdnof.com/2307/95e35ad3-da7f-4678-851d-913cf56a402c.gif" alt="" /></p></div></div><div class="MuiGrid-root jss8 MuiGrid-item MuiGrid-grid-xs-true MuiGrid-grid-md-3"><div class="MuiTypography-root jss26 MuiTypography-body1"><div class="MuiTypography-root jss27 MuiTypography-body1"><canvas style="height:108px;width:108px" height="108" width="108"></canvas><div class="MuiTypography-root jss28 MuiTypography-body1"><p class="MuiTypography-root jss29 MuiTypography-body1">手机扫一扫</p><p class="MuiTypography-root jss29 MuiTypography-body1">移动阅读更方便</p></div></div></div><div class="MuiTypography-root jss9 MuiTypography-body1"><div class="MuiTypography-root jss30 MuiTypography-body1" style="height:150px"><div class="swiper-container jss32"><div class="swiper-pagination"></div><div class="swiper-wrapper"><div class="swiper-slide jss32"><a class="MuiTypography-root MuiLink-root MuiLink-underlineHover jss32 MuiTypography-colorInherit" target="_blank" rel="nofollow noopener noreferrer" href="https://qd.rs/aliyun"><img alt="阿里云服务器" class="jss31" src="https://article.cdnof.com/promotion/aliyun.jpg"/></a></div><div class="swiper-slide jss32"><a class="MuiTypography-root MuiLink-root MuiLink-underlineHover jss32 MuiTypography-colorInherit" target="_blank" rel="nofollow noopener noreferrer" href="https://qd.rs/tencent"><img alt="腾讯云服务器" class="jss31" src="https://article.cdnof.com/promotion/tencent.jpg"/></a></div><div class="swiper-slide jss32"><a class="MuiTypography-root MuiLink-root MuiLink-underlineHover jss32 MuiTypography-colorInherit" target="_blank" rel="nofollow noopener noreferrer" href="https://qd.rs/qiniu"><img alt="七牛云服务器" class="jss31" src="https://article.cdnof.com/promotion/qiniu.png"/></a></div></div></div></div></div><div class="MuiTypography-root MuiTypography-body1"><div class="MuiTypography-root jss33 MuiTypography-body1"><p class="MuiTypography-root jss34 MuiTypography-body1">你可能感兴趣的文章</p><div class="MuiList-root MuiList-padding" aria-label="main mailbox folders"></div></div></div></div></div></div><footer style="margin-top:30px"><p class="MuiTypography-root MuiTypography-body2 MuiTypography-colorTextSecondary MuiTypography-alignCenter">Copyright © <a class="MuiTypography-root MuiLink-root MuiLink-underlineHover MuiTypography-colorInherit" href="https://v2as.com" title="哇哦，有大量工具等你探索">V2AS | 问路</a> 2024 .</p><p class="MuiTypography-root MuiTypography-body2 MuiTypography-colorTextSecondary MuiTypography-alignCenter"><a class="MuiTypography-root MuiLink-root MuiLink-underlineHover MuiTypography-colorInherit" rel="nofollow noopener noreferrer" href="https://beian.miit.gov.cn/">浙ICP备15029886号</a></p></footer></div></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{"article":{"article_id":"d746e000-3a59-41ee-9586-62764899e0b3","title":"帆软报表（finereport）图表钻取详细类别当前页对话框展示","link":"","description":"添加参数栏，季度下拉框的控件命名为 jd\n\n这里添加雷达图做案例\n\n编辑→特效→ 添加JavaScript\n参数：wd 值：分类名 #取雷达图所点击的点\n参数：jd 值：公式$jd #取参数下拉所选参数\n\nJavaScript详细:\n\nvar iframe = $(\"\u003ciframe id='001' name='001' width='100%' height='1","image":"https://article.cdnof.com/2307/e7401fbf-ac80-49db-a69e-f307df0332e4.png","keywords":["jd","iframe","FineReport","报表","wd","帆软","连接","op","对话框","cpt"],"created_at":"2023-07-08T21:46:40.164Z","html":"\u003cp\u003e添加参数栏，季度下拉框的控件命名为 jd\u003c/p\u003e\n\u003cp\u003e\u003cimg class='lazyload' data-src=\"https://article.cdnof.com/2307/e7401fbf-ac80-49db-a69e-f307df0332e4.png\" alt=\"\" /\u003e\u003c/p\u003e\n\u003cp\u003e这里添加雷达图做案例\u003c/p\u003e\n\u003cp\u003e\u003cimg class='lazyload' data-src=\"https://article.cdnof.com/2307/e88a2fd6-aa91-4722-bcbf-d9d3000dea76.png\" alt=\"\" /\u003e\u003c/p\u003e\n\u003cp\u003e编辑→特效→ 添加JavaScript\u003c/p\u003e\n\u003cp\u003e参数：wd\u0026nbsp; \u0026nbsp; 值：分类名\u0026nbsp; \u0026nbsp; \u0026nbsp; #取雷达图所点击的点\u003c/p\u003e\n\u003cp\u003e参数：jd\u0026nbsp; \u0026nbsp; \u0026nbsp; 值：公式$jd\u0026nbsp; \u0026nbsp; #取参数下拉所选参数\u003c/p\u003e\n\u003cp\u003e\u003cimg class='lazyload' data-src=\"https://article.cdnof.com/2307/408bec84-8d3f-4de2-b622-5d5f136668e8.png\" alt=\"\" /\u003e\u003c/p\u003e\n\u003cp\u003eJavaScript详细:\u003c/p\u003e\n\u003cp\u003evar iframe = $(\"\u003ciframe id='001' name='001' width='100%' height='100%' scrolling='yes' frameborder='0'\u003e\") // iframe参数的命名及宽高等 \u003cbr /\u003e\nif (wd == '纬度1') { //判断点击到的点，根据所选纬度弹出明细对话框 \u003cbr /\u003e\n iframe.attr(\"src\", \"report?viewlet=/test/明细1.cpt\u0026amp;op=view\u0026amp;jd=\" + jd + \"\") \u003cbr /\u003e\n} else if (wd == '纬度2') { \u003cbr /\u003e\n iframe.attr(\"src\", \"report?viewlet=/test/明细2.cpt\u0026amp;op=view\u0026amp;jd=\" + jd + \"\") \u003cbr /\u003e\n} else if (wd == '纬度3') { \u003cbr /\u003e\n iframe.attr(\"src\", \"report?viewlet=/test/明细3.cpt\u0026amp;op=view\u0026amp;jd=\" + jd + \"\") \u003cbr /\u003e\n} else if (wd == '纬度4') { \u003cbr /\u003e\n iframe.attr(\"src\", \"report?viewlet=/test/明细4.cpt\u0026amp;op=view\u0026amp;jd=\" + jd + \"\") \u003cbr /\u003e\n} else if (wd == '纬度5') { \u003cbr /\u003e\n iframe.attr(\"src\", \"report?viewlet=/test/明细5.cpt\u0026amp;op=view\u0026amp;jd=\" + jd + \"\") \u003cbr /\u003e\n} else if (wd == '纬度6') { \u003cbr /\u003e\n iframe.attr(\"src\", \"report?viewlet=/test/明细6.cpt\u0026amp;op=view\u0026amp;jd=\" + jd + \"\") \u003cbr /\u003e\n} else if (wd == '纬度7') { \u003cbr /\u003e\n iframe.attr(\"src\", \"report?viewlet=/test/明细7.cpt\u0026amp;op=view\u0026amp;jd=\" + jd + \"\") \u003cbr /\u003e\n} else if (wd == '纬度8') { \u003cbr /\u003e\n iframe.attr(\"src\", \"report?viewlet=/test/明细8.cpt\u0026amp;op=view\u0026amp;jd=\" + jd + \"\") \u003cbr /\u003e\n} else if (wd == '纬度9') { \u003cbr /\u003e\n iframe.attr(\"src\", \"report?viewlet=/test/明细9.cpt\u0026amp;op=view\u0026amp;jd=\" + jd + \"\") \u003cbr /\u003e\n} \u003cbr /\u003e\nvar o = { \u003cbr /\u003e\n title: wd, //对话框标题(这里取雷达图纬度名作弹出框标题) \u003cbr /\u003e\n width: 1265, //宽统一宽高 \u003cbr /\u003e\n height: 370 //高 \u003cbr /\u003e\n} \u003cbr /\u003e\nFR.showDialog(o.title, o.width, o.height, iframe, o) //弹出对话框\u003c/p\u003e\n\u003cp\u003e或者：*可单独定义每个弹出框的宽高\u003c/p\u003e\n\u003cp\u003evar url = \"\";\u003c/p\u003e\n\u003cp\u003evar title = \"\"\u003c/p\u003e\n\u003cp\u003evar o = \"\"\u003c/p\u003e\n\u003cp\u003eif(wd==\"纬度1\"){\u003c/p\u003e\n\u003cpre\u003e\u003ccode\u003eurl = \"report?viewlet=/test/纬度1详细.cpt\u0026amp;op=view\u0026amp;jd=\" + jd + \"\";\n\ntitle = wd;\n\no = { \n\nwidth : 1265, //对话框宽度 \n\nheight: 370 //对话框高度 \n\n}; \u003c/code\u003e\u003c/pre\u003e\n\u003cp\u003e}else if(wd==\"纬度2\"){\u003c/p\u003e\n\u003cpre\u003e\u003ccode\u003eurl = \"report?viewlet=/test/纬度2详细.cpt\u0026amp;op=view\u0026amp;jd=\" + jd + \"\";\n\ntitle = wd;\n\no = { \n\nwidth : 1265, //对话框宽度 \n\nheight: 370 //对话框高度 \n\n}; \u003c/code\u003e\u003c/pre\u003e\n\u003cp\u003e}\u003c/p\u003e\n\u003cp\u003evar iframe = $(\"\u003ciframe id='inp' name='inp' width='100%' height='100%' scrolling='yes' frameborder='0'\u003e\"); // 对话框内iframe参数的命名，默认宽高占比是100%，可向下滚动 \u003c/p\u003e\n\u003cp\u003eiframe.attr(\"src\", url); // 给iframe添加src属性 \u003c/p\u003e\n\u003cp\u003e//弹出对话框\u003c/p\u003e\n\u003cp\u003eFR.showDialog(title, o.width, o.height, iframe,o);\u003c/p\u003e\n\u003cp\u003e发现在决策系统里打开弹出框报错，首次访问时跳转到明细的链接不正确\u003c/p\u003e\n\u003cp\u003e\u003cimg class='lazyload' data-src=\"https://article.cdnof.com/2307/4e2e0c60-6bf4-4b24-a983-298f1589ff7d.png\" alt=\"\" /\u003e\u003c/p\u003e\n\u003cp\u003e修改JavaScript\u003c/p\u003e\n\u003cp\u003e\u003cimg class='lazyload' data-src=\"https://article.cdnof.com/2307/90340885-bc6f-42ff-a87d-09ad733f5ff5.png\" alt=\"\" /\u003e\u003c/p\u003e\n\u003cp\u003e添加url参数:\u003c/p\u003e\n\u003cp\u003e公式= \"http://\"+serverName+\":\"+serverPort+servletURL+\"?viewlet=\"\u003c/p\u003e\n\u003cp\u003e修改链接：\u003c/p\u003e\n\u003cp\u003eiframe.attr(\"src\", url\"+/test/明细1.cpt\u0026amp;op=view\u0026amp;jd=\" + jd + \"\")\u003c/p\u003e\n\u003cp\u003e预览效果:\u003c/p\u003e\n\u003cp\u003e\u003cimg class='lazyload' data-src=\"https://article.cdnof.com/2307/95e35ad3-da7f-4678-851d-913cf56a402c.gif\" alt=\"\" /\u003e\u003c/p\u003e"},"seo":{"title":"帆软报表（finereport）图表钻取详细类别当前页对话框展示","description":"添加参数栏，季度下拉框的控件命名为 jd\n\n这里添加雷达图做案例\n\n编辑→特效→ 添加JavaScript\n参数：wd 值：分类名 #取雷达图所点击的点\n参数：jd 值：公式$jd #取参数下拉所选参数\n\nJavaScript详细:\n\nvar iframe = $(\"\u003ciframe id='001' name='001' width='100%' height='1","image":"https://article.cdnof.com/2307/e7401fbf-ac80-49db-a69e-f307df0332e4.png","url":"https://v2as.com/article/d746e000-3a59-41ee-9586-62764899e0b3","keywords":["jd","iframe","FineReport","报表","wd","帆软","连接","op","对话框","cpt"]},"viewsCount":1,"promotionList":[{"title":"阿里云服务器","image":"https://article.cdnof.com/promotion/aliyun.jpg","link":"https://qd.rs/aliyun"},{"title":"腾讯云服务器","image":"https://article.cdnof.com/promotion/tencent.jpg","link":"https://qd.rs/tencent"},{"title":"七牛云服务器","image":"https://article.cdnof.com/promotion/qiniu.png","link":"https://qd.rs/qiniu"}],"similarKeywordsList":null},"__N_SSG":true},"page":"/article/[article_id]","query":{"article_id":"d746e000-3a59-41ee-9586-62764899e0b3"},"buildId":"7EtL49Y65E8zx1NwcIC_o","isFallback":false,"gsp":true,"scriptLoader":[]}</script></body></html>