最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - How can I set the default filename for the Chrome print dialog from within an iframe? - Stack Overflow

programmeradmin7浏览0评论

I'm working on a project where my part of the project is a dashboard within an iframe. I have a request to make just the iframe I'm working on exportable as a PDF (that is, only show the iframe contents and not the wrapper stuff around it). I've gotten that to work using some jQuery, but I'm now stumped at setting a default filename for saving as PDF. This SO answer was helpful (setting document.title works when the page is not in an iframe), but it doesn't work when the export button is clicked when it is in the iframe view. Here's an example of what I've tried:

$('#export-button').click(function() {
    $('#iframe-contents').show();
    document.title = 'default_filename';
    window.print();
});

Does anyone know how to set the default filename in the Chrome print dialog when calling on window.print() from within an iframe?

I'm working on a project where my part of the project is a dashboard within an iframe. I have a request to make just the iframe I'm working on exportable as a PDF (that is, only show the iframe contents and not the wrapper stuff around it). I've gotten that to work using some jQuery, but I'm now stumped at setting a default filename for saving as PDF. This SO answer was helpful (setting document.title works when the page is not in an iframe), but it doesn't work when the export button is clicked when it is in the iframe view. Here's an example of what I've tried:

$('#export-button').click(function() {
    $('#iframe-contents').show();
    document.title = 'default_filename';
    window.print();
});

Does anyone know how to set the default filename in the Chrome print dialog when calling on window.print() from within an iframe?

Share edited May 23, 2017 at 12:09 CommunityBot 11 silver badge asked Feb 2, 2017 at 23:53 mgigmgig 2,9255 gold badges23 silver badges36 bronze badges 3
  • Why do you need a filename in a print dialog? Windows (not sure about other OS) doesn't even show a filename in a print dialog – Jaromanda X Commented Feb 3, 2017 at 0:07
  • 2 For a better customer experience. When people export my report as a PDF, I want the default filename to include the report number and the date because the report contents will change over time. In Mac OS X (and I assume on other OSes) Chrome sets the default filename to the document title. For example, if you try to print this page and save as PDF, Chrome on OS X sets the default filename to "javascript - How can I set the default filename for the Chrome print dialog from within an iframe_ - Stack Overflow.pdf". – mgig Commented Feb 3, 2017 at 0:45
  • When people export my report ... oh, I misread the default filename for the Chrome print dialog to mean you want a filename in the print dialog - didn't realise the question was about exporting to PDF – Jaromanda X Commented Feb 3, 2017 at 1:02
Add a ment  | 

1 Answer 1

Reset to default 5

Firefox does set the pdf name directly to the iframe's document's name, weird that chrome doesn't.

For a workaround, if your iframe shares the same origin as your parent page, you can use :

document.title = window.parent.document.title = "yourTitle";

If they don't share the same origin, you're stuck.

Actually there is an hack, even for cross-origin frames involving window.open(), hence not working in sand-boxed iframes without 'allow-popups' permission.

function renameIframedPrint(title) {
  var title = "myFile";
  try {
    // same-origin frame
    document.title = window.parent.document.title = title;
    print();
  } catch (e) { // cross-origin frame

    // we could instead grab the current content of the page
    // but for the demo, location.href will do
    var p = window.open(location.href);
    p.onload = function() {
      // no more frame so we don't care ;-)
      p.document.title = "myFile";
      // a bit more hack to close the popup once printed...
      function closePopup() {
        p.close();
      }
      if ('onafterprint' in p) {
        // FF and IE
        p.onafterprint = closePopup
      } else {
        // webkit don't support onafterprint
        var mediaQueryList = p.matchMedia('print');
        mediaQueryList.addListener(mqlListener);

        function mqlListener(mql) {
          if (!mql.matches) {
            closePopup();
            mediaQueryList.removeListener(mqlListener);
          }
        }
      }
    }
    // we're ready
    p.print();
  };
}

External Live Demo, since open() won't work in stack-snippet's sand-boxed iframe.

与本文相关的文章

发布评论

评论列表(0)

  1. 暂无评论