为什么在打印对话框中的页面时数据未加载到表中
[英]why the data not loaded in the table when the page in the print dialog
问题描述
i have a problem here i make a page that have function for print page that contain of dynamic table. 
我在这里有一个问题，我制作的页面具有用于包含动态表的打印页面的功能。 the print function method is open the page html that contain the dynamic table in the new tab then open the print dialog. 打印功能方法是在新选项卡中打开包含动态表的页面html，然后打开打印对话框。 the process going well but when i add the ajax call for displaying the data in the dynamic table. 该过程进行得很好，但是当我添加ajax调用以在动态表中显示数据时。 the data not displayed at the table in the print dialog..but when i cancel the print dialog and the page that must be printed show off the data is displaying there... 数据未显示在打印对话框的表中。但是当我取消打印对话框并且必须打印的页面显示数据时，该数据将显示在此处...
how to fix it. 如何解决。
this the picture of the page 这是页面的图片
i use this code for print that 我使用此代码进行打印
<script> function myFunction() { window.open('SPL.html','','height=650,width=1200').print(); } </script>
2 个解决方案
解决方案1
0 2017-07-24 07:16:01
This issue is caused because the page is not completely loaded before calling the print function. 出现此问题的原因是，在调用打印功能之前，页面未完全加载。
Update: Using jQuery 更新：使用jQuery
index.html index.html
<html>
<head>
<script src="http://code.jquery.com/jquery-1.4.3.min.js"></script>
<script>
$(document).ready(function(){
$('#loaderFrame').load(function(){
var w = (this.contentWindow || this.contentDocument.defaultView);
w.print();
});
$('#loaderFrame').attr('src', 'SPL.html');
});
});
</script>
<style>
#loaderFrame{
visibility: hidden;
height: 1px;
width: 1px;
}
</style>
</head>
<body>
<iframe id="loaderFrame" ></iframe>
</body>
</html>
解决方案2
0 已采纳 2017-07-25 05:13:40
You didnt provided yet the code of your generator, so I simply explain you why its not working and what you can do. 您尚未提供生成器的代码，所以我只向您解释为什么它不起作用以及您可以做什么。
A good reference for window Mozilla Window Open 窗口Mozilla窗口打开的良好参考
You can read there more details about possible functions and more. 您可以在此处阅读更多有关可能功能的详细信息。 Your problem is, with: 您的问题是：
window.open('SPL.html','','height=650,width=1200').print();
Directly after opening the file you call the print function, at this moment your script and ajax request don´t have finished yet. 打开文件后，立即调用打印功能，此时您的脚本和Ajax请求尚未完成。 Thats why it just shows you the current state with the predefined html and css code. 这就是为什么它仅使用预定义的html和css代码向您显示当前状态的原因。
So what you have to do is simply call print after it has finished. 因此，您要做的只是在完成后调用print。 There are tons of ways to achieve this. 有很多方法可以实现这一目标。
The simplest way would it to open it like this: 最简单的方法是这样打开它：
window.open('SPL.html','','height=650,width=1200')
Inside your SPL.html you stack your js script inside: 在您的SPL.html中，您将js脚本堆叠在其中：
$(document).ready() {
//Your Generator
}
This little piece keeps safe that all dependencys (external scripts and dom elements) are created before your generator runs and it gives us the possibility for the next function: 这小块代码可以确保在生成器运行之前创建所有依赖项（外部脚本和dom元素），这为我们提供了下一个功能的可能性：
$(window).load(function(){
window.print()
});
This one is a version of the globalEventHandler window.onload . 这是globalEventHandler window.onload的版本。 It basicly ,if you read the documentation, fires after everything is loaded, including images, frames, objects and so on. 从根本上讲，如果您阅读文档，则在加载所有内容（包括图像，框架，对象等）后触发。 And the tricky part also after document.ready , this makes it sure that our generator is finished before we run the print command. 还有棘手的部分也位于document.ready之后，这可以确保在运行print命令之前，生成器已经完成。
I hope this helps, If you really want to stick the print command inside your first page I can give you an example of this too. 希望对您有所帮助，如果您真的想将打印命令放在第一页中，我也可以举一个例子。 But it is not as bullet prove as this solution. 但这还不能像这种解决方案那样证明。 Ah and if you want to stick with @Saurabh solution you have to use allow-modals for your Iframe, if not it wouldn´t be possible to print. 嗯，如果您要坚持使用@Saurabh解决方案，则必须为iframe使用allow-modals modals，否则将无法打印。 Is also mentioned in the official documentation. 官方文档中也有提及。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.