jquery для печати из модального окна

У меня есть пара модальных окон, и я пытаюсь добавить функцию «распечатать это». Я нашел скрипт, и я пытаюсь изменить это. Он создает iframe, загружает html, печатает и затем закрывает фрейм. Я собираюсь вставить мой html-ответ ajax на этот div. По какой-то причине мой ответ ajax не загружается в div, который я хочу распечатать. Это то, что у меня есть:jquery для печати из модального окна

// Create a jquery plugin that prints the given element. 
jQuery.fn.print = function(){ 
// NOTE: We are trimming the jQuery collection down to the 
// first element in the collection. 
if (this.size() > 1){ 
    this.eq(0).print(); 
    return; 
} else if (!this.size()){ 
    return; 
} 

// ASSERT: At this point, we know that the current jQuery 
// collection (as defined by THIS), contains only one 
// printable element. 

// Create a random name for the print frame. 
var strFrameName = ("printer-" + (new Date()).getTime()); 

// Create an iFrame with the new name. 
var jFrame = $("<iframe name='" + strFrameName + "'>"); 

// Hide the frame (sort of) and attach to the body. 
jFrame 
    .css("width", "1px") 
    .css("height", "1px") 
    .css("position", "absolute") 
    .css("left", "-9999px") 
    .appendTo($("body:first")) 
; 

// Get a FRAMES reference to the new frame. 
var objFrame = window.frames[ strFrameName ]; 

// Get a reference to the DOM in the new frame. 
var objDoc = objFrame.document; 

// Write the HTML for the document. In this, we will 
// write out the HTML of the current element. 
objDoc.open(); 
objDoc.write("<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">"); 
objDoc.write("<html>"); 
objDoc.write("<body>"); 
objDoc.write("<head>"); 
objDoc.write("<title>"); 
objDoc.write(document.title); 
objDoc.write("</title>"); 
objDoc.write("<div id='viewNotes'></div>"); 
objDoc.write("</head>"); 
//objDoc.write(this.html()); 
objDoc.write("</body>"); 
objDoc.write("</html>"); 
//objDoc.close(); 

formData = 'cmid=C93F52DCE21ABBD5'; 
$.ajax({ 
    url: 'ajax/ajax_get_notes.cfm', 
    type: 'GET', 
    data: formData, 
    cache: false, 
    success: function(result) { 
     $('#viewNotes').html(result); 
    }, 
    error: function(xmlHttpRequest, status, err) { 
     $('#viewNotes').html('error:'+err); 
    } 
});  

// Print the document. 
objFrame.focus(); 
//objFrame.print(); 

// Have the frame remove itself in about a minute so that 
// we don't build up too many of these frames. 
setTimeout(
    function(){ 
     jFrame.remove(); 
    }, 
    (60 * 1000) 
    ); 

alert('i am here'); 
}

Что я делаю неправильно? Есть ли лучший способ сделать это?

источник

2010-05-19 CFNinja

Я вижу пару вещей не так.

Во-первых, iFrame не создается, потому что нет закрывающего тега. Во-вторых, iFrame никогда не добавляется на страницу. В-третьих, CSS-код jFrame не объявлен правильно (должен быть «#frame»). В-четвертых, теги html находятся в неправильном порядке.

Я думаю, что вы можете пойти с чем-то вроде этого:

var strFrameName = ("printer-" + (new Date()).getTime()); 

// Create an iFrame with the new name. 
var jFrame = $("<iframe name='" + strFrameName + "'><div id='viewNotes'></div></iframe>"); 

// Get a FRAMES reference to the new frame. 
var objFrame = window.frames[ strFrameName ]; 

// Get a reference to the DOM in the new frame. 
var objDoc = objFrame.document; 

// Write the HTML for the document. In this, we will 
// write out the HTML of the current element. 
objDoc.open(); 
objDoc.write("<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">"); 
objDoc.write("<html>"); 
objDoc.write("<head>"); 
objDoc.write("<title>"); 
objDoc.write(document.title); 
objDoc.write("</title>"); 
objDoc.write("</head>"); 
objDoc.write("<body>"); 
objDoc.write(jframe); 
objDoc.write("</body>"); 
objDoc.write("</html>"); 
//objDoc.close(); 

formData = 'cmid=C93F52DCE21ABBD5'; 
$.ajax({ 
    url: 'ajax/ajax_get_notes.cfm', 
    type: 'GET', 
    data: formData, 
    cache: false, 
    success: function(result) { 
     $('#viewNotes').html(result); 
    }, 
    error: function(xmlHttpRequest, status, err) { 
     $('#viewNotes').html('error:'+err); 
    } 
});  
//print

источник

2010-05-19 16:32:28 Dave

hi dave. спасибо за ваш ответ, но я получаю: objFrame - неопределенная ошибка в firebug. – CFNinja

я в конечном итоге реализации что-то другое. Я создал еще одну страницу с именем printNotes.cfm, которая напоминает текстовое окно заметок. Я прикрепил событие window.open к кнопке «версия для печати» в модальном окне. При нажатии этой кнопки запускается printNotes.cfm, и эта страница загружает записи через ajax. В printNotes.cfm появляется кнопка принтера и запускается однократное событие window.print().

Он работает как шарм.

thanks

источник

2010-05-19 20:21:36 CFNinja

jquery для печати из модального окна

ответ

Смежные вопросы