{var%20f='http://v.t.sina.com.cn/share/share.php?appkey=1515056452',u=z||d.location,p=['&url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=440,height=430,left=',(s.width-440)/2,',top=',(s.height-430)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','https://www.manongdao.com/data/attach/logo/logo.png', '推荐 手持菜刀，她持情操 的问题《How to create a download button for multiple files》','https://www.manongdao.com/q-236867.html','页面编码gb2312|utf-8默认gb2312'));){kind=link}
I am trying to make a button when clicking, it downloads the files in a zip file. I tried to load the files into the Zip from given url. I am using Liferay 6.1 .
Is the script declaration in the JSP file correct?
I have already specified jszip.js in liferay-portlet.xml.
<footer-portlet-javascript>/js/jszip.js</footer-portlet-javascript>
Do I have to use the Liferay AUI Taglib tag or a simple javaScript tag should do the work?
<aui:script></aui:script> or <script type="text/javascript"></script> or liferay-portlet.xml
Is my script to download multi-files correct?
<c:if test="<%= multi_files_urls != null && multi_files_urls.size() > 1 %>">
<aui:button onClick="downloadFiles(<%= multi_files_urls %>)" value="Download files"></aui:button>
</c:if>
<script type="text/javascript">
function downloadFiles(multi_files_urls) {
for (var url in multi_files_urls )
JSZipUtils.getBinaryContent(url, function(err, data) {
if(err) {
throw err;
}
JSZip.loadAsync(data).then(function () {
var zip = new JSZip(data);
});
});
zip.then(function(content) {
saveAs(content, "my_documents.zip");
});
}
</script>
I am getting the following error:
(index):1 Uncaught ReferenceError: zip is not defined at downloadFiles ((index):1) at HTMLInputElement.onclick ((index):1)
Update
I tried <header-portlet-javascript>/js/jszip.js</header-portlet-javascript> and <script type="text/javascript" src="<%=request.getContextPath()%>/js/jszip.js"></script> but it did not work.
I followed this link: Unable to include css and JS files in Liferay Portlet JSP Page
I didn't check, but it looks like this is completely independent of Liferay and how you embed the code: The error message says that
zip is not defined. The only place wherezipis being defined is within this function, and it immediately goes out of scope:Thus, it's not in scope when this code runs:
You'd have to declare zip further up, so that it's still in scope when you want to use it (but, most likely, initialize it where you currently initialize). As I have no experience with the JSZip library and the async keyword is used, I'm not sure if it's sufficient to just reorder, or if the timing will only initialize
zipafter its intended use - I'll leave this up to you.Try reproducing in a single HTML page, as I don't see the complication that Liferay would bring into the game to be the cause of your problem. This might make it easier to understand. When that runs, embed it in Liferay.
Update (The solution)
1- I added js files to liferay-portlet.xml file.
2- In my view.jsp
Everything works well !