Select items and create a new page

Kirby 2 Solved ✅
1

Hi there,

i’d like to add a feature to my site where you can select several images and view them on a seperate page (like on https://gebhart.dk/ )
How should I start this?

32
Bildschirmfoto 2018-11-08 um 14.32.32.jpg3104×1978 535 KB
44
Bildschirmfoto 2018-11-08 um 14.32.44.jpg3104×1978 543 KB

2

This is nothing Kirby related. You need some Javascript that stores the images somewhere on click (session, local storage), like in a shop basket. Then on the download page show these images and then either a JS solution or some PHP library that creates the PDF file from it.

If you check out the JavaScript on the page where you can add to PDF, you can see how they do it (functions.js)

On the pfd-dl page, they call a PHP script via Ajax (functions-dl.js):


            $("#downloadPdf").click(function(e) {
                e.preventDefault();

                var list = store.get( "lightbox" );
                var names = jQuery.parseJSON(localStorage.getItem("lightbox"));
                // console.log(list);
                // console.log(names);
                var listArray = JSON.stringify(names);
                //console.log(listArray);
                $.ajax({
                    type: "POST",
                    url: "../gdk15/wp-content/uploads/tcpdf/print_pdf.php",
                    data: { data: listArray },
                    success: function(data) {
                        //window.open('../wp-content/uploads/tcpdf/print_pdf.php?data=' + listArray + '', 'Gebhart de Koekkoek: PDF', 'window settings');
                        var iframe = $("<iframe width='0' height='0'>");
                        iframe.attr('src','../gdk15/wp-content/uploads/tcpdf/print_pdf.php?data=' + listArray + '');
                        $('#output').append(iframe);
                    }
                });
            });

As you can see from the link, they are using the tcpdf library to create the PDF file.

3

aah thanks, i’m trying to work me through this.