Marcel Epp

Hello, i need some help again. How can i put some text under the headline? I render the posts like this, with an option array and my page counter. $content = $blog->renderPosts($page, 0, $postoptions) . $page_counter . $blog->postAuthor() . $renderComments . $blog->renderNextPrevPosts($page);//with post author widget It is possible to have my page counter under the headline?

Hi, is this code posted from febuary now part of version 2.3.9? I can't find the code in the .module. /** * Return a date formatted as specified in the Blog post's 'blog_date' field. * * @access public * @param int|string $date If given a timestamp, it will be automatically formatted according to the 'blog_date' field in PW * If given a string, then whatever format it is in will be kept. * @param int $mode Date format to use. If for posts and similar, use blog_date (default). If for comments, use blog_comments dateFormat. * @return $date string * */ public function formatDate($date, $mode = 1) { if(is_int($date)) { // for posts, use date format specified in field 'blog_date' $dateFormat = $this->wire('fields')->get('blog_date')->dateOutputFormat; // for comments, if specified, use in-built date format in 'blog_comments' if($mode == 2 && $this->wire('fields')->get('blog_comments')->dateFormat) { $dateFormat = $this->wire('fields')->get('blog_comments')->dateFormat; } $date = FieldtypeDatetime::formatDate($date, $dateFormat); } return $date; } I still want to translate the last comments date. Second question for me is, how can i change or disable the "on" in the comments section.

...the next questions for me are how can i change the buttons into another language? I have edited the modules, but that is not the right way. For me padloper needs more options for translations at one point.

Hi, how can i add a quantity field? When i press my button add to cart i want a field where i can say 10 for example.

Thanks for your answers! The first think i had to do, was enable the url segments. That was unclear for me. I asked a colleague for help. We looked at the example above and get it to work. $download = ($input->urlSegment1 == 'download'); $file = $page->bildarchiv_images; $thumb = $page->bildarchiv_thumb; if ($download) { $downloadFilename = '';// ($page->title).'.'.substr(strrchr($file->$filename, "."), 1); wireSendFile($file->filename(), array('forceDownload' => true, 'exit' => true, 'downloadFilename' => $downloadFilename)); } else { echo '<div id="basic-site-text" class="row content-box">'; echo '<div class="medium-9 columns content-box-column-left">'; echo "<h2>$page->title</h2>"; if($thumb) echo "<a href=\"./download/\"><img src='$thumb->url'></a>"; else echo "<a href=\"./download/\"><img src='$file->url'></a>"; echo "<p><strong>Stichwörter:</strong><br>$page->stichwoerter</p>"; echo "<p><strong>Copyright:</strong><br>$page->copyright</p>"; echo "</div>"; echo '<div class="medium-3 columns content-box-column-right">'; echo "<a id='search_submit' class=\"expanded button\" href=\"./download/\">Download</a>"; echo "</div>"; echo "</div>"; }

Hello, i need some help. I have build a upload form which save an image into a site. How can the visitors of this site now download the uploaded image? I created a download button. When i click on that, the image shows. How can i force the browser to download the file? The html 5 download attribute is not an option. Is there a solution with gives me max browser compatibility?

It's working now! Thank you very much Can and LostKobrakai!!! I splited the form in two steps. That was easier for me. And i did not save the form to pages. The files are stored on the server and our workflow system can get it. Maybe it is not the best but for now it's working. I did a little start over. This is now my site. On the first step i only validate the email field. <!-- include head start --> <?php include('./_head_pluploadtest.php'); ?> <!-- include head end --> <!-- include header start --> <?php include('./_header.php'); ?> <!-- include header end --> <div id="basic-site-text" class="row content-box"> <div class="large-12 columns"></div> <div class="medium-9 columns content-box-column-left"> <?php /** * ### Example front-end form template with file upload and fields ### * * - with files (images) upload to page field * - adds new page on the fly and adds uploaded images * - prevents CRSF attacks, this also prevents double post by refresh page after submit * - has required fields with error messages inline * - sanitizing and saving values to a page * - jquery example with disabled submit button on form submit * * Edit add or remove form markup below and configure this section according to what you need. * */ // ------------------------------ FORM Configuration --------------------------------------- // --- Some default variables --- $success_message = "<div id='form-success-message' class='text-center'><i class='fi-check'></i><br><h4>Danke, Ihre Daten wurden übermittelt.</h4></div>"; // --- All form fields as nested array --- // using html form field name => template field nam, from the page you're going to create $form_fields = array( 'email' => array('type' => 'email', 'value' => '', 'required' => true) ); // --- Page creation settings --- $template = "service-upload-files"; // the template used to create the page $parent = $pages->get("/service/pluploadtest/"); $page_fields = array('email'); // $page_fields = define the fields (except file) you want to save value to a page // this is for the form process to populate page fields. // Your page template must have the same field names existent // ------------------------------ FORM Processing --------------------------------------- include("./form-plupload-test.php"); ?> <!-- ========================= FORM HTML markup ================================== --> <?php /** * Some vars used on the form markup for error and population of fields * * $errors[fieldname]; to get errors * $form_fields[fieldname]['value']; * * Some helper function to get error markup * echo showError(string); * * Prevent CSRF attacks by adding hidden field with name and value * you an get by using $session->CSRF * $session->CSRF->getTokenName(); * $session->CSRF->getTokenValue(); * * $errors['csrf']; used to check for CSRF error * */ ?> <?php if(!$success) : ?> <?php if(!empty($errors)) echo showError("Die Form enthält Fehler!"); ?> <?php if(!empty($errors['csrf'])) echo showError($errors['csrf']); ?> <form name="myform" class="myform" id="fileUploadForm" method="post" action="./" enctype="multipart/form-data"> <input type="hidden" name="<?php echo $session->CSRF->getTokenName(); ?>" value="<?php echo $session->CSRF->getTokenValue(); ?>"/> <div class=" <?php if(isset($errors['email'])) echo "error";?>"> <label for="email">Ihre E-Mail Adresse: * </label> <input type="text" name="email" id="email" placeholder='max.mustermann@email.de' value="<?php // zeigt die E-Mail Adresse des Users wenn eingeloggt. if($user->isLoggedin()) { if (empty($_POST["email"])) echo $user->email; } echo $sanitizer->entities($form_fields['email']['value']); ?>"/> <?php if(isset($errors['email'])) echo showError($errors['email']); ?> </div> <?php // if user is logged in... show some content specifically for logged-in users if ($user->isLoggedin()) { echo "<div class='callout secondary'>"; echo $page->service_email_info_logged_in; echo "</div>"; } else { echo "<div class='callout secondary'>"; echo $page->service_email_info_logged_out; echo "</div>"; } ?> <div> <!--<div id="fileList"></div><br><br>--> <input type="hidden" name="action" id="action" value="send"/> <input data-toggle="loadingModal" type="submit" name="submit" id="submit" value="nächster Schritt" class="button service_button float-right"/> </div> <!-- Fehlermeldung plupload <pre id="console"></pre>--> </form> <div class="full reveal" id="loadingModal" data-reveal> <div> <img src="<?php echo $config->urls->templates?>images/loading_circle.gif" alt="Intropsective Cage"><br> </div> </div> <?php else: ?> <!-- <p><?php echo $success_message; ?></p> <form id="fileUploadForm" method="post" action="./" enctype="multipart/form-data"> <div id="dropArea"> <input class="dragDropFileUploadField" type="file" name="file[]" accept="jpg,jpeg,png,gif,mpg,mpeg,mp4,avi,wmv,mov,zip" multiple> <button type="submit" name="action" value="submit">Upload</button> </div> </form> <div id="fileList"></div>--> <form method="post" action="./" enctype="multipart/form-data"> <div id="uploader"> <p>Your browser doesn't have Flash, Silverlight or HTML5 support.</p> </div> <input type="submit" name="submit" id="submit" value="Absenden" class="button service_button"/> </form> <!-- <?php echo $_POST['email']; ?> --> <!-- übergibt die E-Mail Adresse an die nächste Seite --> <?php $session->newemail = $_POST['email']; ?> <?php endif; ?> </div><!-- Ende Container --> <div class="medium-3 columns content-box-column-right"> </div> </div> <!-- include footer start --> <?php include('./_foot.php'); ?> <!-- include footer end --> <!-- include footer start --> <?php include('./_foot_service_pluploadtest.php'); ?> <!-- include footer end --> On the second site i used pluploader with queue widget When i now add some files... the get uploaded if i hit the submit button And my xml files get generated with the email adress inside Form validation: <?php // ------------------------------ FORM Processing --------------------------------------- $errors = null; $success = false; // helper function to format form errors function showError($e){ return "<div class='alert callout'><p class='error'>$e</p></div>"; } // dump some variables // var_dump($_FILES,$_POST,$_SESSION); /** * Cast and save field values in array $form_fields * this is also done even form not submited to make populating the form later easier. * * Also used for pupulating page when form was valid */ $required_fields = array(); foreach($form_fields as $key => $f){ if($f['type'] == 'email'){ $form_fields[$key]['value'] = $sanitizer->email($input->post->$key); } // store required fields in array if($f['required']) $required_fields[] = $key; } /** * form was submitted, start processing the form */ if($input->post->action == 'send'){ // validate CSRF token first to check if it's a valid request if(!$session->CSRF->hasValidToken()){ $errors['csrf'] = "Die Formulardaten wurden nicht richtig ausgefüllt. Bitte versuchen Sie es erneut."; } /** * Ceck for required fields and make sure they have a value */ foreach($required_fields as $req){ // reqired text fields } if($form_fields[$req]['type'] == 'email'){ if(!strlen($form_fields[$req]['value'])){ $errors[$req] = "Bitte geben Sie Ihre E-Mail Adresse an."; } } /* * if no required errors found yet continue file upload form processing * if(empty($errors)) { // create the new page to add field values and uploaded images $uploadpage = new Page(); $uploadpage->template = $template; $uploadpage->parent = $parent; // add title/name and make it unique with time and uniqid $uploadpage->title = date("d-m-Y H:i:s") . " - " . uniqid(); // populate page fields with values using $page_fields array foreach($page_fields as $pf){ if($templates->get($template)->hasField($pf)){ $uploadpage->$pf = $form_fields[$pf]['value']; } else { throw new WireException("Template '$template' has no field: $pf"); } } // RC: for safety, only add user uploaded files to an unpublished page, for later approval // RC: also ensure that using v2.3+, and $config->pagefileSecure=true; in your /site/config.php $uploadpage->addStatus(Page::statusUnpublished); $uploadpage->save(); */ // $success_message .= "<p>Page created: <a href='$uploadpage->url'>$uploadpage->title</a></p>"; $success = true; // reset the token so no double posts happen // also prevent submit button to from double clicking is a good pratice $session->CSRF->resetToken(); /* }*/} the upload handler for plupload: <?php // --- WireUpload settings --- $upload_path = $config->paths->assets . "files/service_upload_files/pluploadtest/"; // tmp upload folder $file_extensions = array('jpg', 'jpeg', 'gif', 'png', 'tif', 'tiff'); $max_files = 0; $max_upload_size = 1*14336*14336; // make sure PHP's upload and post max size is also set to a reasonable size 1*102400 = 100 MB $overwrite = false; $newemail = $session->newemail; // RC: create temp path if it isn't there already if(!is_dir($upload_path)) { if(!wireMkdir($upload_path)) throw new WireException("No upload path!"); } // setup new wire upload $u = new WireUpload('file'); $u->setMaxFiles($max_files); $u->setMaxFileSize($max_upload_size); $u->setOverwrite($overwrite); $u->setDestinationPath($upload_path); $u->setValidExtensions($file_extensions); // start the upload of the files $files = $u->execute(); // create XML files for switch // remove extension from files $withoutExt = preg_replace('/\\.[^.\\s]{3,4}$/', '', $files); foreach($withoutExt as $withoutExt_string) { $doc = new DOMDocument('1.0'); // we want a nice output $doc->formatOutput = true; $root = $doc->createElement('phpemail'); $root = $doc->appendChild($root); $email = $doc->createElement('email'); $email = $root->appendChild($email); $text = $doc->createTextNode($newemail); $text = $email->appendChild($text); $doc->save($upload_path . $withoutExt_string . ".xml"); } ?> And the plupload config in my footer: <!-- jQuery first, then foundation JS. --> <script src="<?php echo $config->urls->templates?>scripts/vendor/jquery.min.js"></script> <script src="<?php echo $config->urls->templates?>scripts/vendor/what-input.min.js"></script> <script src="<?php echo $config->urls->templates?>scripts/foundation.min.js"></script> <script src="<?php echo $config->urls->templates?>scripts/app.js"></script> <script src="<?php echo $config->urls->templates?>scripts/onchange_dropdown_service.js"></script> <script src="<?php echo $config->urls->templates?>scripts/email_service_validation.js"></script> <script src="<?php echo $config->urls->templates?>scripts/plupload.full.min.js"></script> <script src="<?php echo $config->urls->templates?>scripts/jquery.plupload.queue.js"></script> <script src="<?php echo $config->urls->templates?>langs/de.js"></script> <script type="text/javascript"> $(function() { // Setup html5 version $("#uploader").pluploadQueue({ // General settings runtimes : 'html5,flash,silverlight,html4', url : 'uploadplupload/', //chunk_size: '1mb', unique_names: false, rename : true, dragdrop: true, filters : { // Maximum file size max_file_size : '200mb', // Specify what files to browse for mime_types: [ {title : "Image files", extensions : "jpg,jpeg,gif,png,tif,tiff"} ] }, // max file restriction with errors init : { FilesAdded: function(up, files) { var max_files = 3; plupload.each(files, function(file) { if (up.files.length > max_files) { alert('Sie dürfen bei einem Durchgang nur ' + max_files + ' Dateien hochladen.'); up.removeFile(file); } }); if (up.files.length >= max_files) { $('#pickfiles').hide('slow'); } }, FilesRemoved: function(up, files) { if (up.files.length < max_files) { $('#pickfiles').fadeIn('slow'); } } }, // Resize images on clientside if we can //resize : {width : 320, height : 240, quality : 90}, flash_swf_url : '../../js/Moxie.swf', silverlight_xap_url : '../../js/Moxie.xap' }); // start file upload ob drop //var uploader = $("#uploader").pluploadQueue(); //uploader.bind('FilesAdded', function(up, files) { //uploader.start(); //}); // Client side form validation // uploads the files in queue and submits the form $("form").submit(function(e) { var uploader = $("#uploader").pluploadQueue(); // Validate number of uploaded files if (uploader.total.uploaded == 0) { // Files in queue upload them first if (uploader.files.length > 0) { // When all files are uploaded submit form uploader.bind("StateChanged", function() { if (uploader.total.uploaded == uploader.files.length) $("form").submit(); }); uploader.start(); } else alert("Sie müssen mindestens eine Datei auswählen."); e.preventDefault(); } }); }); </script> <noscript><p><img src="//piwik-gbd.de/piwik.php?idsite=5" style="border:0;" alt="" /></p></noscript> <!-- End Piwik Code --> </body> </html> I will made a step by step tutorial. This becomes too big. Maybe i can improve something. But for now it works! :)

Thank your for your answer. As far as i understand one solution would be to have a site with the email field and a submit button (next button). After i hit that, it must create a site and keep the email adress stored and sends me to another site. On the next site i can upload my files and attech them to the created site + generate my xml files from the filename with the stored email adress. Would that be a solution? I think using javascript to submit the form is to difficult for me.

I changed the name to images. After that i disabled plupload to see if my upload still works. I took away the id dropArea and on the input filed dragDropFileUploadField. Then without plupload the upload is fine. <label for="file">Ihre Bilddateien: * </label> <div id="dropArea" class=" <?php if(isset($errors['images'])) echo "error";?>"> <input class="dragDropFileUploadField" type="file" name="images[]" accept="image/jpg,image/jpeg,image/gif,image/png" multiple="multiple" /> <!--<button type="submit" name="action" value="submit">Upload</button>--> <?php // show upload errors if(isset($errors['images'])){ // if multiple errors if(is_array($errors['images'])){ foreach($errors['images'] as $e){ echo showError($e); } } else { // if single error echo showError($errors['images']); } } ?> </div> Without plupload the input field looks like this: With plupload the file list looks like this: here on the second picture with plupload the input type says that no files are selected. I think the input type get no files. I enabled/disabled the auto upload function to see if there is a difference. The ideal way for me would be that i press submit button the uploader starts the upload and the form gets submitted.

Here is my code. Hope it is not to messy.... This is the site where the form is on: <!-- include head start --> <?php include('./_head_jquery_upload.php'); ?> <!-- include head end --> <!-- include header start --> <?php include('./_header.php'); ?> <!-- include header end --> <div id="basic-site-text" class="row content-box"> <div class="large-12 columns"></div> <div class="medium-9 columns content-box-column-left"> <?php /** * ### Example front-end form template with file upload and fields ### * * - with files (images) upload to page field * - adds new page on the fly and adds uploaded images * - prevents CRSF attacks, this also prevents double post by refresh page after submit * - has required fields with error messages inline * - sanitizing and saving values to a page * - jquery example with disabled submit button on form submit * * Edit add or remove form markup below and configure this section according to what you need. * */ // ------------------------------ FORM Processing --------------------------------------- include("./form-process-sw.php"); ?> <!-- ========================= FORM HTML markup ================================== --> <?php /** * Some vars used on the form markup for error and population of fields * * $errors[fieldname]; to get errors * $form_fields[fieldname]['value']; * * Some helper function to get error markup * echo showError(string); * * Prevent CSRF attacks by adding hidden field with name and value * you an get by using $session->CSRF * $session->CSRF->getTokenName(); * $session->CSRF->getTokenValue(); * * $errors['csrf']; used to check for CSRF error * */ ?> <?php if(!$success) : ?> <?php if(!empty($errors)) echo showError("Die Form enthält Fehler!"); ?> <?php if(!empty($errors['csrf'])) echo showError($errors['csrf']); ?> <form name="myform" class="myform" id="fileUploadForm" method="post" action="./" enctype="multipart/form-data"> <input type="hidden" name="<?php echo $session->CSRF->getTokenName(); ?>" value="<?php echo $session->CSRF->getTokenValue(); ?>"/> <label>Bitte Service auswählen: <select name="select_service" id="select-service-dropdown" onChange="window.location.href=this.value"> <option selected="selected" value="/service/bilder-in-sw/">Farbbilder in Schwarzweiß umwandeln</option> <option value="/service/bildoptimierung/">Bilder optimieren</option> <option value="/service/portrait-optimierung/">Portraitbilder optimieren</option> <option value="/service/pdf-zu-jpg-umwandeln/">PDF-Dateien zu JPG-Dateien umwandeln</option> <option value="/service/datencheck/">PDF-Prüfbericht anfordern</option> </select> </label> <div class=" <?php if(isset($errors['email'])) echo "error";?>"> <label for="email">Ihre E-Mail Adresse: * </label> <input type="text" name="email" id="email" placeholder='max.mustermann@email.de' value="<?php // zeigt die E-Mail Adresse des Users wenn eingeloggt. if($user->isLoggedin()) { if (empty($_POST["email"])) echo $user->email; } echo $sanitizer->entities($form_fields['email']['value']); ?>"/> <?php if(isset($errors['email'])) echo showError($errors['email']); ?> </div> <?php // if user is logged in... show some content specifically for logged-in users if ($user->isLoggedin()) { echo "<div class='callout secondary'>"; echo $page->service_email_info_logged_in; echo "</div>"; } else { echo "<div class='callout secondary'>"; echo $page->service_email_info_logged_out; echo "</div>"; } ?> <div id="dropArea" class=" <?php if(isset($errors['file'])) echo "error";?>"> <label for="file">Ihre Bilddateien: * </label> <input class="dragDropFileUploadField" type="file" name="file[]" accept="image/jpg,image/jpeg,image/gif,image/png" multiple /> <!--<button type="submit" name="action" value="submit">Upload</button>--> <?php // show upload errors if(isset($errors['file'])){ // if multiple errors if(is_array($errors['file'])){ foreach($errors['file'] as $e){ echo showError($e); } } else { // if single error echo showError($errors['file']); } } ?> </div> <!--<div class=" <?php if(isset($errors['images'])) echo "error";?>"> <label for="images">Ihre Bilddateien: * </label> <input type="file" name="images[]" id="file_upload" multiple="multiple" size="40" accept="image/jpg,image/jpeg,image/gif,image/png"/> </div>--> <div> <div id="fileList"></div><br><br> <input type="hidden" name="action" id="action" value="send"/> <input data-toggle="loadingModal" type="submit" name="submit" id="submit" value="Absenden" class="button service_button"/> </div> <br /> <!-- Fehlermeldung plupload --> <pre id="console"></pre> </form> <div class="full reveal" id="loadingModal" data-reveal> <div> <img src="<?php echo $config->urls->templates?>images/loading_circle.gif" alt="Intropsective Cage"><br> </div> </div> <?php else: ?> <p><?php echo $success_message; ?></p> <!--<p><?php var_dump($files) ?></p> <p><?php var_dump($form_fields ["email"]["value"]) ?></p> <p><?php echo ($form_fields ["email"]["value"]); ?></p> <p><?php var_dump($withoutExt)?></p>--> <?php endif; ?> </div><!-- Ende Container --> <div class="medium-3 columns content-box-column-right"> <!--<div id="info_text"><?php echo $page->service_info_headline; ?></div> <div id="info_general"><?php echo $page->service_info_text_general; ?></div>--> <div id="info_sw_image"><?php foreach($page->service_info_image_sw as $image) { echo "<img src='$image->url'>"; } ?></div> <div id="info_sw"><?php echo $page->service_info_text_sw; ?></div> </div> </div> <!-- include footer start --> <?php include('./_foot.php'); ?> <!-- include footer end --> <!-- include footer start --> <?php include('./_foot_service_sw.php'); ?> <!-- include footer end --> This is the form_process that handles the upload and creates a xml from every file and stores them into pages. <?php // ------------------------------ FORM Configuration --------------------------------------- // --- Some default variables --- $success_message = "<div id='form-success-message' class='text-center'><i class='fi-check'></i><br><h4>Danke, Ihre Daten wurden übermittelt.</h4></div>"; // --- All form fields as nested array --- // using html form field name => template field nam, from the page you're going to create $form_fields = array( 'email' => array('type' => 'email', 'value' => '', 'required' => true), 'file' => array('type' => 'file', 'required' => true) ); // --- WireUpload settings --- $upload_path = $config->paths->assets . "files/service_upload_files/service1/"; // tmp upload folder $file_extensions = array('jpg', 'jpeg', 'gif', 'png', 'tif', 'tiff'); $max_files = 3; $max_upload_size = 1*14336*14336; // make sure PHP's upload and post max size is also set to a reasonable size 1*102400 = 100 MB $overwrite = false; // --- Page creation settings --- $template = "service-upload-files"; // the template used to create the page $parent = $pages->get("/service/bilder-in-sw/"); $file_field = "images"; $page_fields = array('email'); // $page_fields = define the fields (except file) you want to save value to a page // this is for the form process to populate page fields. // Your page template must have the same field names existent // ------------------------------ FORM Processing --------------------------------------- $errors = null; $success = false; // helper function to format form errors function showError($e){ return "<div class='alert callout'><p class='error'>$e</p></div>"; } // dump some variables // var_dump($_FILES,$_POST,$_SESSION); /** * Cast and save field values in array $form_fields * this is also done even form not submited to make populating the form later easier. * * Also used for pupulating page when form was valid */ $required_fields = array(); foreach($form_fields as $key => $f){ if($f['type'] == 'email'){ $form_fields[$key]['value'] = $sanitizer->email($input->post->$key); } // store required fields in array if($f['required']) $required_fields[] = $key; } /** * form was submitted, start processing the form */ if($input->post->action == 'send'){ // validate CSRF token first to check if it's a valid request if(!$session->CSRF->hasValidToken()){ $errors['csrf'] = "Die Formulardaten wurden nicht richtig ausgefüllt. Bitte versuchen Sie es erneut."; } /** * Ceck for required fields and make sure they have a value */ foreach($required_fields as $req){ // required upload file field if($form_fields[$req]['type'] == 'file'){ if(empty($_FILES[$req]['name'][0])){ $errors[$req] = "Bitte wählen Sie mindestens 1 Datei für den Upload aus."; } // reqired text fields } else if($form_fields[$req]['type'] == 'email'){ if(!strlen($form_fields[$req]['value'])){ $errors[$req] = "Dieses Feld muss ausgefüllt sein."; } // reqired email fields if($form_fields[$req]['type'] == 'email'){ if($form_fields[$req]['value'] != $input->post->$req){ $errors[$req] = "Bitte geben Sie Ihre E-Mail Adresse an."; } } } } /** * if no required errors found yet continue file upload form processing */ if(empty($errors)) { // RC: create temp path if it isn't there already if(!is_dir($upload_path)) { if(!wireMkdir($upload_path)) throw new WireException("No upload path!"); } // setup new wire upload $u = new WireUpload($file_field); $u->setMaxFiles($max_files); $u->setMaxFileSize($max_upload_size); $u->setOverwrite($overwrite); $u->setDestinationPath($upload_path); $u->setValidExtensions($file_extensions); // start the upload of the files $files = $u->execute(); // if no errors when uploading files if(!$u->getErrors()){ // create the new page to add field values and uploaded images $uploadpage = new Page(); $uploadpage->template = $template; $uploadpage->parent = $parent; // add title/name and make it unique with time and uniqid $uploadpage->title = date("d-m-Y H:i:s") . " - " . uniqid(); // populate page fields with values using $page_fields array foreach($page_fields as $pf){ if($templates->get($template)->hasField($pf)){ $uploadpage->$pf = $form_fields[$pf]['value']; } else { throw new WireException("Template '$template' has no field: $pf"); } } // RC: for safety, only add user uploaded files to an unpublished page, for later approval // RC: also ensure that using v2.3+, and $config->pagefileSecure=true; in your /site/config.php $uploadpage->addStatus(Page::statusUnpublished); $uploadpage->save(); // Now page is created we can add images upload to the page file field foreach($files as $filename) { $uploadpage->$file_field = $upload_path . $filename; // remove tmp file uploaded //unlink($upload_path . $filename); } $uploadpage->save(); // create XML files for switch // remove extension from files $withoutExt = preg_replace('/\\.[^.\\s]{3,4}$/', '', $files); foreach($withoutExt as $withoutExt_string) { $doc = new DOMDocument('1.0'); // we want a nice output $doc->formatOutput = true; $root = $doc->createElement('phpemail'); $root = $doc->appendChild($root); $email = $doc->createElement('email'); $email = $root->appendChild($email); $text = $doc->createTextNode(($form_fields ["email"]["value"])); $text = $email->appendChild($text); $doc->save($upload_path . $withoutExt_string . ".xml"); } // $success_message .= "<p>Page created: <a href='$uploadpage->url'>$uploadpage->title</a></p>"; $success = true; // reset the token so no double posts happen // also prevent submit button to from double clicking is a good pratice $session->CSRF->resetToken(); } else { // errors found $success = false; // remove files uploaded foreach($files as $filename) unlink($upload_path . $filename); // get the errors if(count($u->getErrors()) > 1){ // if multiple error foreach($u->getErrors() as $e) { $errors[$file_field][] = $e; } } else { // if single error $errors[$file_field] = $u->getErrors(); } } } } And this is the footer where i put your plupload code: <!-- jQuery first, then foundation JS. --> <script src="<?php echo $config->urls->templates?>scripts/vendor/jquery.min.js"></script> <script src="<?php echo $config->urls->templates?>scripts/vendor/what-input.min.js"></script> <script src="<?php echo $config->urls->templates?>scripts/foundation.min.js"></script> <script src="<?php echo $config->urls->templates?>scripts/app.js"></script> <script src="<?php echo $config->urls->templates?>scripts/onchange_dropdown_service.js"></script> <script src="<?php echo $config->urls->templates?>scripts/email_service_validation.js"></script> <script src="<?php echo $config->urls->templates?>scripts/plupload.full.min.js"></script> <script src="<?php echo $config->urls->templates?>scripts/jquery.plupload.queue.js"></script> <script src="<?php echo $config->urls->templates?>langs/de.js"></script> <script type="text/javascript"> // so we only initiate plupload if a form with id fileUploadForm is present on the page // you can change it to look for a class name if you prefer.. var filesUpload = document.getElementById("fileUploadForm"); if (typeof fileUploadForm !== 'undefined') { // this is the part of the form where people can drag and drop files into // if it should be the whole form you can strip the next line and change all dropArea vars to filesUpload var dropArea = document.getElementById("dropArea"); // the next 3 events are only to visualize drag and drop // they're basically just adding/removing the dragOver class to dropArea dropArea.addEventListener('dragover', function(e) { this.classList.add("dragOver"); e.preventDefault(); e.stopPropagation(); }, false); dropArea.addEventListener('dragleave', function(e) { this.classList.remove("dragOver"); e.preventDefault(); e.stopPropagation(); }, false); dropArea.addEventListener("drop", function(e) { this.classList.remove("dragOver"); e.preventDefault(); e.stopPropagation(); }, false); // here we actually initiate pluploader var uploader = new plupload.Uploader({ browse_button: dropArea, // this can be an id of a DOM element or the DOM element itself drop_element: dropArea, url: './', resize: {width: 3000, height: 3000}, headers: { "X-Requested-With": "XMLHttpRequest" // without this Processwire's $config->ajax won't work }, filters: { mime_types : [ { title : "Image files", extensions : "jpg,jpeg,gif,png" }, { title : "Video files", extensions : "mpg,mpeg,mp4,mov,avi,wmv" }, { title : "Zip files", extensions : "zip" } ] }, runtimes: 'html5,flash,silverlight,html4', flash_swf_url: 'plupload/Moxie.swf', required_features: true }); uploader.init(); // here you can show a preview of each file (before actual upload) uploader.bind('FilesAdded', function(up, files) { var html = ''; plupload.each(files, function(file) { /* check file.size, remove if exceeds limit */ html += '<li id="' + file.id + '">' + file.name + ' (' + plupload.formatSize(file.size) + ') <b></b></li>'; }); document.getElementById('fileList').innerHTML += html; uploader.start(); }); /* this one handles the actual progress, I'm currently just showing in percents (without progress bar) // but you can use file.percent for whatever you like (e.g. changing the width of an element with it) uploader.bind('UploadProgress', function(up, file) { if(file.percent == 100 && file.status != plupload.DONE) { file.percent = 100; } document.getElementById(file.id).getElementsByTagName('b')[0].innerHTML = '<span>' + file.percent + "%</span>"; }); /* after a file is ready, my PHP script is responding with the pageimage file, so I'm swapping the preview with the response uploader.bind('FileUploaded', function(up, file, result) { // remove upload progress for this file var progressElement = document.getElementById(file.id); progressElement.parentNode.remove(progressElement); // prepend uploaded files to gallery var gallery = document.getElementById('groupGallery'); gallery.insertAdjacentHTML('afterbegin', result.response); });*/ // error handler.. uploader.bind('Error', function(up, err) { // document.getElementById('console').innerHTML += "\nError #" + err.code + ": " + err.message; console.log("Error #" + err.code + ": " + err.message); }); } </script> </body> </html>

Again thank you very much for your help! I have tried the above code. When i choose a file it get listed, but the input file says that i don't have choosen any file. So i can't upload a file.

I think the first problem for me is to initate plupload like you described above. On my site i have for testing only: <form id="fileUploadForm" method="post" action="./"> </form> after that in my footer and your code: <script src="<?php echo $config->urls->templates?>scripts/vendor/jquery.min.js"></script> <script src="<?php echo $config->urls->templates?>scripts/plupload.full.min.js"></script> <script src="<?php echo $config->urls->templates?>scripts/jquery.plupload.queue.js"></script> <script type="text/javascript"> // so we only initiate plupload if a form with id fileUploadForm is present on the page // you can change it to look for a class name if you prefer.. var filesUpload = document.getElementById("fileUploadForm"); if (typeof fileUploadForm !== 'undefined') { // this is the part of the form where people can drag and drop files into // if it should be the whole form you can strip the next line and change all dropArea vars to filesUpload var dropArea = document.getElementById("dropArea"); // the next 3 events are only to visualize drag and drop // they're basically just adding/removing the dragOver class to dropArea dropArea.addEventListener('dragover', function(e) { this.classList.add("dragOver"); e.preventDefault(); e.stopPropagation(); }, false); dropArea.addEventListener('dragleave', function(e) { this.classList.remove("dragOver"); e.preventDefault(); e.stopPropagation(); }, false); dropArea.addEventListener("drop", function(e) { this.classList.remove("dragOver"); e.preventDefault(); e.stopPropagation(); }, false); // here we actually initiate pluploader var uploader = new plupload.Uploader({ browse_button: dropArea, // this can be an id of a DOM element or the DOM element itself drop_element: dropArea, url: './', resize: {width: 3000, height: 3000}, headers: { "X-Requested-With": "XMLHttpRequest" // without this Processwire's $config->ajax won't work }, filters: { mime_types : [ { title : "Image files", extensions : "jpg,jpeg,gif,png" }, { title : "Video files", extensions : "mpg,mpeg,mp4,mov,avi,wmv" }, { title : "Zip files", extensions : "zip" } ] }, runtimes: 'html5,flash,silverlight,html4', flash_swf_url: 'plupload/Moxie.swf', required_features: true }); uploader.init(); // here you can show a preview of each file (before actual upload) uploader.bind('FilesAdded', function(up, files) { var html = ''; plupload.each(files, function(file) { /* check file.size, remove if exceeds limit */ html += '<li id="' + file.id + '">' + file.name + ' (' + plupload.formatSize(file.size) + ') <b></b></li>'; }); document.getElementById('fileList').innerHTML += html; uploader.start(); }); // this one handles the actual progress, I'm currently just showing in percents (without progress bar) // but you can use file.percent for whatever you like (e.g. changing the width of an element with it) uploader.bind('UploadProgress', function(up, file) { if(file.percent == 100 && file.status != plupload.DONE) { file.percent = 99; } document.getElementById(file.id).getElementsByTagName('b')[0].innerHTML = '<span>' + file.percent + "%</span>"; }); // after a file is ready, my PHP script is responding with the pageimage file, so I'm swapping the preview with the response uploader.bind('FileUploaded', function(up, file, result) { // remove upload progress for this file var progressElement = document.getElementById(file.id); progressElement.parentNode.remove(progressElement); // prepend uploaded files to gallery var gallery = document.getElementById('groupGallery'); gallery.insertAdjacentHTML('afterbegin', result.response); }); // error handler.. uploader.bind('Error', function(up, err) { // document.getElementById('console').innerHTML += "\nError #" + err.code + ": " + err.message; console.log("Error #" + err.code + ": " + err.message); }); } </script> Did i now should see some plupload window? My site is empty. As far i understand you initiate plupload with a the id FileUploadForm.

When i used plupload as stand alone, there are 3 files. The index.php where pluploader is inside + options for pluploader itself. The upload.php where i can change the configuration for the upload. And a dump.php that is showed after the file upload. The upload.php is the file that is in the form action. I tried to do the same in Processwire. But i think, that didn't work. Did you connect plupload with wireupload?

@can how did configure the path for the upload? In plupload ther is $targetDir I tried plupload as stand alone. Now in Processwire i can't upload any file. I get a http error.

Thank you for answers!!! This helps me a lot. I played with plupload today. I think i must now discover to implement plupload into my form upload field.

Can you give me an example how you implement plupload? Somas form has already an input field for files. Can I use the standard input field?

Hi, i have build a form with somas excellent example. I have a field for email and one field for file upload. The files get uploaded to pages. How can i get a file progressbar to work? Or put something like dropzone in it? Has anyone an idea how to do that?

Hello dragan, thanks for your answer. It sound silly, but sometimes all i need is little help. You are right. I removed the extension and did a foreach on that array. This works for me: // create XML files for switch // remove extension from files $withoutExt = preg_replace('/\\.[^.\\s]{3,4}$/', '', $files); foreach($withoutExt as $withoutExt_string) { $doc = new DOMDocument('1.0'); // we want a nice output $doc->formatOutput = true; $root = $doc->createElement('phpemail'); $root = $doc->appendChild($root); $email = $doc->createElement('email'); $email = $root->appendChild($email); $text = $doc->createTextNode(($form_fields ["email"]["value"])); $text = $email->appendChild($text); $doc->save($upload_path . $withoutExt_string . ".xml"); } To get the email value i used var_dump to go trough the array. $text = $doc->createTextNode(($form_fields ["email"]["value"]));

Hi, it's been a while since you posted this. Can you give me an example how you put that dropzone thing in an existing wire upload?

Hi, i need some help to create xml files from my upload form. For the form i used Soma's excellent example: https://gist.github.com/somatonic/5233338 i modified it. I only have an email field and the upload. I don't erase the files in my tmp folder. What i want is to create xml files with the same name. The same name that my files have. Example: photo1.png photo2.png photo1.xml photo2.xml .... i tried this code but i get stuck where i have to submit the entry from my email field. // remove extension from filename $withoutExt = preg_replace('/\\.[^.\\s]{3,4}$/', '', $files); // create xml for switch $doc = new DOMDocument('1.0'); $doc->formatOutput = true; $root = $doc->createElement('phpemail'); $root = $doc->appendChild($root); $email = $doc->createElement('email'); $email = $root->appendChild($email); $text = $doc->createTextNode($form_fields); $text = $email->appendChild($text); $doc->save($upload_path . $withoutExt . ".xml");

Hello, does anybody know how can i get the filenames from wireupload? In my frontend form is a wireupload. // New wire upload $service_upload = new WireUpload('service_file_upload_sw'); // References the name of the field in the HTML form that uploads the photo $service_upload->setMaxFiles(5); $service_upload->setOverwrite(false); $service_upload->setDestinationPath($upload_path); $service_upload->setValidExtensions(array('jpg', 'jpeg', 'png', 'tif', 'tiff', 'gif')); When i dump $service_upload i get an huge array with $completedFilenames array. What i'm trying to do is to take the filenames and generate xml files from my input field (email). This works for one file now, but not for more then one. $withoutExt = preg_replace('/\\.[^.\\s]{3,4}$/', '', $filename); // create xml for switch $doc = new DOMDocument('1.0'); // we want a nice output $doc->formatOutput = true; $root = $doc->createElement('phpemail'); $root = $doc->appendChild($root); $email = $doc->createElement('email'); $email = $root->appendChild($email); $text = $doc->createTextNode($np->email); $text = $email->appendChild($text); $doc->save($upload_path . $withoutExt . ".xml");

I used the code from here and modified it. And i have this: // New wire upload $service_upload = new WireUpload('service_file_upload_sw'); // References the name of the field in the HTML form that uploads the photo $service_upload->setMaxFiles(5); $service_upload->setOverwrite(false); $service_upload->setDestinationPath($upload_path); $service_upload->setValidExtensions(array('jpg', 'jpeg', 'png', 'tif', 'tiff', 'gif')); When i now choose a pdf file and hit the submit button then there is no wrong file message.

How can i check if the user has choosen a valid file? For example: User choose pdf but allowed is only jpg.

Greetings Matthew, thank you for your help. i got the basics done. I now have a form where i can upload one file and this file got saved into a page. How can i hide this pages by default (published and hide)? And how can i store more than one file?

Hello Matthew, thanks for your answer. i have tried your suggestion https://processwire.com/talk/topic/3105-create-pages-with-file-upload-field-via-api/ But for now i can't get it to work. It always says that my file upload was not sucessfull. Even when i didn't choose any file. Maybe i am doing something wrong.