2017-01-06 2 views
0

Я создаю форму для публикации на моем WP сайте. Упрощенный код моей формы выглядит следующим образом:Dropzone.js не работает в wordpress postend

<form id="new_post" name="new_post" method="post" action="/add-property-query/" enctype="multipart/form-data"> 
 
\t \t \t \t \t \t \t \t <!-- post name --> 
 
\t \t \t \t \t \t \t \t <fieldset name="name"> 
 
\t \t \t \t \t \t \t \t \t <label for="title">Name:</label> 
 
\t \t \t \t \t \t \t \t \t <input type="text" id="title" value="TestName" tabindex="5" name="title" /> 
 
\t \t \t \t \t \t \t \t </fieldset> 
 
\t \t \t \t \t 
 
\t \t \t \t \t \t \t \t <!-- images - _thumbnail_id --> 
 
\t \t \t \t \t \t \t \t <div class="images"> 
 
\t \t \t \t \t \t \t <label for="boss_thumbnail">Front of the Bottle</label> 
 
\t \t \t \t \t \t \t \t \t \t <input type="file" name="boss_thumbnail" id="boss_thumbnail" tabindex="25" /> 
 
\t \t \t \t \t \t \t \t </div> 
 
\t \t \t \t 
 
\t \t \t \t \t 
 
\t \t \t \t \t \t \t \t <fieldset class="submit"> 
 
\t \t \t \t \t \t \t \t \t <button type="submit" value="Post Review" tabindex="40" id="submit" name="submit">Submit data and files!</button> 
 
\t \t \t \t \t \t \t \t </fieldset> 
 
\t \t \t \t \t 
 
\t \t \t \t \t \t \t \t <input type="hidden" name="action" value="new_post" /> 
 
\t \t \t \t \t \t \t \t <?php wp_nonce_field('new-post'); ?> 
 
\t \t \t \t \t \t \t </form>

Я использую вход загрузки изображения, который работает отлично. То есть часть кода на стороне сервера, который обрабатывает загрузки изображения:

//INSERT OUR MEDIA ATTACHMENTS 
 
\t   if (!function_exists('wp_generate_attachment_metadata')){ 
 
\t    require_once(ABSPATH . "wp-admin" . '/includes/image.php'); 
 
\t    require_once(ABSPATH . "wp-admin" . '/includes/file.php'); 
 
\t    require_once(ABSPATH . "wp-admin" . '/includes/media.php'); 
 
\t   } 
 
\t   if ($_FILES) { 
 
\t    foreach ($_FILES as $file => $array) { 
 
\t     if ($_FILES[$file]['error'] !== UPLOAD_ERR_OK) { 
 
\t      return "upload error : " . $_FILES[$file]['error']; 
 
\t     } 
 
\t    } 
 
\t    $boss_thumbnail = media_handle_upload('boss_thumbnail', $pid); // set cover 
 
\t   } 
 
\t   if ($boss_thumbnail > 0){ 
 
\t    //set the image as thumbnail: 
 
\t    update_post_meta($pid,'_thumbnail_id',$boss_thumbnail); 
 
\t   }// END SAVING FILE

мне нужен точно такой же механизм UPLOADING с другим моим поля формы работают с использованием dropzone.js. Поскольку они требуют на своем сайте (dropzonejs.com), я включил <script src="./path/to/dropzone.js"></script> и добавил dropzone класс в форму. Мой HTML теперь следующее:

<script src="./path/to/dropzone.js"></script> 
 
<form id="new_post" name="new_post" method="post" action="/add-property-query/" class="dropzone" enctype="multipart/form-data"> 
 
\t \t \t \t \t \t \t \t <!-- post name --> 
 
\t \t \t \t \t \t \t \t <fieldset name="name"> 
 
\t \t \t \t \t \t \t \t \t <label for="title">Name:</label> 
 
\t \t \t \t \t \t \t \t \t <input type="text" id="title" value="TestName" tabindex="5" name="title" /> 
 
\t \t \t \t \t \t \t \t </fieldset> 
 
\t \t \t \t \t 
 
\t \t \t \t \t \t \t \t <!-- images - _thumbnail_id --> 
 
\t \t \t \t \t \t \t \t <div class="images"> 
 
\t \t \t \t \t \t \t <label for="boss_thumbnail">Front of the Bottle</label> 
 
\t \t \t \t \t \t \t \t \t \t <input type="file" name="boss_thumbnail" id="boss_thumbnail" tabindex="25" /> 
 
\t \t \t \t \t \t \t \t </div> 
 
\t \t \t \t 
 
\t \t \t \t \t 
 
\t \t \t \t \t \t \t \t <fieldset class="submit"> 
 
\t \t \t \t \t \t \t \t \t <button type="submit" value="Post Review" tabindex="40" id="submit" name="submit">Submit data and files!</button> 
 
\t \t \t \t \t \t \t \t </fieldset> 
 
\t \t \t \t \t 
 
\t \t \t \t \t \t \t \t <input type="hidden" name="action" value="new_post" /> 
 
\t \t \t \t \t \t \t \t <?php wp_nonce_field('new-post'); ?> 
 
\t \t \t \t \t \t \t </form>

Dropzone нашел элемент формы с классом DropZone, автоматически подключился к нему. На интерфейсе все работает нормально. На сайте говорится, что загруженные файлы могут быть обработаны так же, как если бы вход HTML, как это:

<input type="file" name="file" /> 

Таким образом, на сервере я изменить $boss_thumbnail = media_handle_upload('boss_thumbnail', $pid); к $boss_thumbnail = media_handle_upload('file', $pid); но WP возвращает следующее сообщение об ошибке : Catchable fatal error: Object of class WP_Error could not be converted to string in formatting.php on line 1025.

Я даже использовал эту статью (https://github.com/enyo/dropzone/wiki/Combine-normal-form-with-Dropzone), чтобы «Объединить нормальную форму с Dropzone», но это мне не помогло. Окончательный HTML-код выглядит следующим образом:

<link rel="stylesheet" href="http://eventboss.org/wp-content/themes/Travelo/css/dropzone.css"> 
 
\t <script src="http://eventboss.org/wp-content/themes/Travelo/js/dropzone.js"></script> 
 
\t <script> 
 
\t \t jQuery(document).ready(function() { 
 
\t \t \t \t Dropzone.options.new_post = { // The camelized version of the ID of the form element 
 
\t \t \t 
 
\t \t \t // The configuration we've talked about above 
 
\t \t \t autoProcessQueue: false, 
 
\t \t \t uploadMultiple: false, 
 
\t \t \t parallelUploads: 100, 
 
\t \t \t maxFiles: 100, 
 
\t \t \t 
 
\t \t \t // The setting up of the dropzone 
 
\t \t \t init: function() { 
 
\t \t \t  var myDropzone = this; 
 
\t \t \t 
 
\t \t \t  // First change the button to actually tell Dropzone to process the queue. 
 
\t \t \t  this.element.querySelector("button[type=submit]").addEventListener("click", function(e) { 
 
\t \t \t  // Make sure that the form isn't actually being sent. 
 
\t \t \t  e.preventDefault(); 
 
\t \t \t  e.stopPropagation(); 
 
\t \t \t  myDropzone.processQueue(); 
 
\t \t \t  }); 
 
\t \t \t 
 
\t \t \t  // Listen to the sendingmultiple event. In this case, it's the sendingmultiple event instead 
 
\t \t \t  // of the sending event because uploadMultiple is set to true. 
 
\t \t \t  this.on("sendingmultiple", function() { 
 
\t \t \t  // Gets triggered when the form is actually being sent. 
 
\t \t \t  // Hide the success button or the complete form. 
 
\t \t \t  }); 
 
\t \t \t  this.on("successmultiple", function(files, response) { 
 
\t \t \t  // Gets triggered when the files have successfully been sent. 
 
\t \t \t  // Redirect user or notify of success. 
 
\t \t \t  }); 
 
\t \t \t  this.on("errormultiple", function(files, response) { 
 
\t \t \t  // Gets triggered when there was an error sending the files. 
 
\t \t \t  // Maybe show form again, and notify user of error 
 
\t \t \t  }); 
 
\t \t \t } 
 
\t \t \t 
 
\t \t \t } 
 
\t \t }) 
 
\t </script> 
 

 
<form id="new_post" name="new_post" method="post" action="/add-property-query/" class="dropzone" enctype="multipart/form-data"> 
 
\t \t \t \t \t \t \t <!-- post name --> 
 
\t \t \t \t \t \t \t <fieldset name="name"> 
 
\t \t \t \t \t \t \t \t <label for="title">Name:</label> 
 
\t \t \t \t \t \t \t \t <input type="text" id="title" value="TestName" tabindex="5" name="title" /> 
 
\t \t \t \t \t \t \t </fieldset> 
 
\t \t \t 
 
\t \t \t \t 
 
\t \t \t \t \t \t \t <fieldset class="submit"> 
 
\t \t \t \t \t \t \t \t <button type="submit" value="Post Review" tabindex="40" id="submit" name="submit">Submit data and files!</button> 
 
\t \t \t \t \t \t \t </fieldset> 
 
\t \t \t \t 
 
\t \t \t \t \t \t \t <input type="hidden" name="action" value="new_post" /> 
 
\t \t \t \t \t \t \t <?php wp_nonce_field('new-post'); ?> 
 
\t \t \t \t \t \t </form>

На стороне сервера я сделал только одно изменение, упомянутых выше. Как я могу правильно загружать изображение сценария с использованием сценария dropzone.js?

+0

Что этот код: formatting.php на линии 1025 – jonmrich

+1

Я думаю, что эта строка '<входной тип = "файл" имя = "boss_thumbnail" ID = "boss_thumbnail" tabindex = "25" /> 'должно быть' ' – jonmrich

+0

Что сказал @jonmrich. – Will

ответ

0

Изменить

<input type="file" name="boss_thumbnail" id="boss_thumbnail" tabindex="25" /> 

в

<input type="file" name="file" id="boss_thumbnail" tabindex="25" /> 
+0

Я так не думаю. На самом деле я даже удалил из HTML поле '', потому что согласно инструкции на их сайте, когда dropzone присоединяется к форма, которая ведет себя так, как если бы было ''. –

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