Click here to Skip to main content
15,074,987 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
Hi friends,
i need to show the aspx page in Modal jquery window.
in aspx page, it contains iframe which display pdf preview by using PDF.js viewer.
here my code:

function opendialog(url) {
            var h = $(window).height();
            var w = $(window).width();

            $('#PreviewCV').load('Admin/PreviewCV.aspx?URL=' + url, function () {
                return true;
            var $dialog = $('#PreviewCV')
                  autoOpen: false,
                  modal: false,
                  height: h-(h*25/100),
                  width: w-(w*25/100),
                  open: function (type, data) {
                  close: function (type, data) {
                          location.href = $(location).attr('href');



        function PDFViewTemplate(item) {
            if (item.GetMember('PDFPath').Value != null && item.GetMember('PDFPath').Value.length >= 3) {
                return "<a onclick='javascript:opendialog(\"viewer.html?file=PDFCV/" + item.GetMember('PDFPath').Value + "\");'><img src='../images/preview_logo.png'></img></a>";


below my aspx page(need to display inside dialog window):

    <form id="form1" runat="server">
    <iframe id="iframeCV" runat="server" style="border:0"></iframe>

my problem is, the iframe not display in full modal dialog window.(it display in left corner as small box).
also i need to add two buttons as select and reject in this aspx page with this pdf preview.

is there anything wrong in my code?


Updated 9-Sep-14 4:28am
ZurdoDev 9-Sep-14 11:16am
Sounds like you need to add height and width to your iframe.
V. 10-Sep-14 9:09am
try simpler showing a simple html into the modal dialog. Boost it with an aspx instead and then add an iframe. If all that works you can try to show the pdf.

1 solution

Just fix your HTML, no body tags and some styling:

<script type="text/javascript">
function doSubmit(){
    //perform form submit operation

function closeThis(caller){
    return false;
<div style="width:100%;height:100%">
    <form id="form1" runat="server" style="display:block;">
        <iframe id="iframeCV" runat="server" width="100%" height="100%" style="border:0;width:100%;height:100%"></iframe>
        <button onclick="doSubmit();">Submit</button>
        <button onclick="closeThis(this);">Cancel</button>
lalitha19 10-Sep-14 2:52am
Hi nathan,
thanks for reply.
but still iframe is display in left corner of modal window.
i need to display it in full modal window.
Nathan Minier 10-Sep-14 9:06am
A couple of typo fixes and minor changes mande.

Make sure that in your main css you have :

html body { height:100%; }

Also in your main page:

<!DOCTYPE html>

Finally put a test src onto the iframe.
lalitha19 12-Sep-14 3:59am
my page is working fine now. i set width and height of the frame by passing values from jquery via querystring.
but this page is working fine in local.but when i host this page on server, it redirect to default error page. not shows original aspx page.
did you know what is the reason?
Nathan Minier 12-Sep-14 8:44am
I see some mixing of back and forward slashes in your JS methods. Backslahes will often work locally but not remotely. Have you tried normalizing those to forward slashes?

Also, are you using System.Web.Routing for RouteConfig in your global.asax?

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900