Open dialog

paintitblack

Hello,

I'm trying to implement a dialog window (https://jqueryui.com/dialog/) which should shows PDF files in the dialog window.

In my example (-> http://wechselstube.host4free.de/editor/) it works without datatables pretty well (click on "Open Dialog").

I used a link with the class "example"

<a href="php/upload/1.pdf" class="example">Open Dialog</a>

in combination with this function:

    $('a.example').on('click', function(e){
        e.preventDefault();
        $('<div/>', {'class':'myDlgClass', 'id':'link-'+($(this).index()+1)})
        .html("<object data=\""+$(this).attr('href')+"\" type=\"application/pdf\" width=\"100%\" height=\"100%\">If you are unable to view file, you can download from <a href = \""+$(this).attr('href')+"\">here</a> or download <a target = \"_blank\" href = \"http://get.adobe.com/reader/\">Adobe PDF Reader</a> to view the file.</object>").appendTo('body')
        .dialog({
            'title' : $(this).text(),
            'width' : 600,
            'height' :600
        });
    });

But when using the "example" class in the datatables function like that:

                                                  for (i = 0; i < d.length; i++) {
                                                         html+= '<a href="'+usersEditor.file( 'files',row.files[i].id).web_path+'" class="example"><img src="images/file_types/pdf.png"/ width="32" height="32"></a>'
                                                  }

the PDF would be openes like a normal link without opening the dialog box.

Does anybody have an idea?

Thank you very much

pib

allan

Change:

$('a.example').on('click', function(e){

to be:

$('body').on('click', 'a.example', function(e){

You are running into the same as this faq.

Allan

paintitblack

Thank you very much for your support. As always it helped alot.