iReport整合web（Struts2）后台开发

上一篇我们大概讲了一下iReport设计器的使用——如何生存模板文件并编译。这次来好好讲下如何整合web环境来进行报表的开发。

开发之前你需要注意的一点是：既然通过web后台来动态绑定数据源，那么，你就必须要意识到，产生模板文件时，不能通过Launch report wizard来产生报表模板，因为在这个向导中，你已经绑定过数据源了，所以这次必须直接透过左边的open this template按钮来修改模板，并自己加上一些Fields和Parameters了。。——这是我做分组得到的惨痛教训！！！

步骤：

1）前端：

<div class="date_select"><font>请选择日期：</font><@s.textfield label="请选择日期" name="transDateFrom" id="date" class="date" theme="simple" placeholder="点击选择日期"/></div>
</div>
<div style="text-align:center">
   <button id="btn_query" class="btn btn-primary">查询</button> 
   <button id="btn_download"  class="btn btn-primary">导出</button> 
</div>
<br/>
 <div id="report" style="text-align:center">
</div>

 其中id为report的div即是呈现报表的区域，之前这个也是困惑我的难点之一：如何把报表渲染到指定区域？

页面上有2个按钮——查询和导出；还有一个输入查询指定日期的数据的日期选择插件，这个插件所产生的值将会作为参数传递到后台。这里又出现了难点之二——如何把参数传给报表？解决方案是把参数值作为后台产生数据源的条件就ok了。。

对应的js为：

$('#btn_query').click(function(){
	  var transDate=$("[name='transDate']").eq(0).val();
	  /*if(transDate==''){
	  		   alert('请选择日期');return;
      }*/
     var url="${request.contextPath}/report/jasper?type=reportSnap&format=HTML&snapDate="+$("[name='transDate']").eq(0).val();
     $.ajax({ 
	 url: url, dataType:"html",headers:{"X-Fragment":"_"},
	 cache:false,success: function(html) { 
		$("#report").empty();
		$("#report").html(html);
	   
	 } 
	}); 
      
  });

 这里的js告诉我们解决第一个困惑的办法，通过ajax请求把报表渲染到指定区域，同时，ajax的dataType为html而不再是典型的json了。

加一个导出成excel的代码吧：

 var transDate=$("[name='transDate']").eq(0).val();
	  if(transDate==''){
	  		   a