2016-04-23 4 views
0

Ich versuche, den blueimp jquery fileUploader auf dem Postform meiner Site zu mySQL-Datenbank zu verbinden, wenn Dateien für Post auf die Clients auf dem Profil meiner Site hochgeladen werden. Ich folgte den Anweisungen auf mehreren Stack-Flow-Threads sowie Bluetims Github SQL-Datenbank-Integrationsanweisungen verwendet.Verbinden Sie Jquery FileUploader mit meiner MySQL-Datenbank

Ich bekomme die Dateien in den angegebenen Dateipfad auf meinem GoDaddy-Server hochgeladen und die Datei erscheint auf der Liste, aber die Dateieigenschaften nicht in der Datenbank-Dateien-Tabelle gespeichert. Wenn ich den Post abschicke, speichert alles in meiner Datenbank mit Ausnahme von Details für die Datei (en), die mit dem Post hochgeladen werden.

Mein aktueller Code. (index.php von Fileuploader-Datei, die in Standard-Server/php Pfad befindet)

<?php 
 
$options = array(
 
    'delete_type' => 'POST', 
 
    'db_host' => 'localhost', 
 
    'db_user' => 'my database user', 
 
    'db_pass' => 'my database password', 
 
    'db_name' => 'my database name', 
 
    'db_table' => 'files' 
 
); 
 
error_reporting(E_ALL | E_STRICT); 
 
require('UploadHandler.php'); 
 
class CustomUploadHandler extends UploadHandler { 
 
    protected function initialize() { 
 
     $this->db = new mysqli(
 
      $this->options['db_host'], 
 
      $this->options['db_user'], 
 
      $this->options['db_pass'], 
 
      $this->options['db_name'] 
 
     ); 
 
     parent::initialize(); 
 
     $this->db->close(); 
 
    } 
 
    protected function handle_form_data($file, $index) { 
 
     $file->title = @$_REQUEST['title'][$index]; 
 
     $file->description = @$_REQUEST['description'][$index]; 
 
    } 
 
    protected function handle_file_upload($uploaded_file, $name, $size, $type, $error, 
 
      $index = null, $content_range = null) { 
 
     $file = parent::handle_file_upload(
 
      $uploaded_file, $name, $size, $type, $error, $index, $content_range 
 
     ); 
 
     if (empty($file->error)) { 
 
      $sql = 'INSERT INTO `'.$this->options['db_table'] 
 
       .'` (`name`, `size`, `type`, `title`, `description`)' 
 
       .' VALUES (?, ?, ?, ?, ?)'; 
 
      $query = $this->db->prepare($sql); 
 
      $query->bind_param(
 
       'sisss', 
 
       $file->name, 
 
       $file->size, 
 
       $file->type, 
 
       $file->title, 
 
       $file->description 
 
      ); 
 
      $query->execute(); 
 
      $file->id = $this->db->insert_id; 
 
     } 
 
     return $file; 
 
    } 
 
    protected function set_additional_file_properties($file) { 
 
     parent::set_additional_file_properties($file); 
 
     if ($_SERVER['REQUEST_METHOD'] === 'GET') { 
 
      $sql = 'SELECT `id`, `type`, `title`, `description` FROM `' 
 
       .$this->options['db_table'].'` WHERE `name`=?'; 
 
      $query = $this->db->prepare($sql); 
 
      $query->bind_param('s', $file->name); 
 
      $query->execute(); 
 
      $query->bind_result(
 
       $id, 
 
       $type, 
 
       $title, 
 
       $description 
 
      ); 
 
      while ($query->fetch()) { 
 
       $file->id = $id; 
 
       $file->type = $type; 
 
       $file->title = $title; 
 
       $file->description = $description; 
 
      } 
 
     } 
 
    } 
 
    public function delete($print_response = true) { 
 
     $response = parent::delete(false); 
 
     foreach ($response as $name => $deleted) { 
 
      if ($deleted) { 
 
       $sql = 'DELETE FROM `' 
 
        .$this->options['db_table'].'` WHERE `name`=?'; 
 
       $query = $this->db->prepare($sql); 
 
       $query->bind_param('s', $name); 
 
       $query->execute(); 
 
      } 
 
     } 
 
     return $this->generate_response($response, $print_response); 
 
    } 
 

 
} 
 
$upload_handler = new UploadHandler();

(uploadhandler.php Datei aus Uploader änderte ich den Server-Port als von GoDaddy vorgeschlagen)

protected function get_full_url() { 
 
     $https = !empty($_SERVER['HTTPS']) && strcasecmp($_SERVER['HTTPS'], 'on') === 0 || 
 
      !empty($_SERVER['HTTP_X_FORWARDED_PROTO']) && 
 
       strcasecmp($_SERVER['HTTP_X_FORWARDED_PROTO'], 'https') === 0; 
 
     return 
 
      ($https ? 'https://' : 'http://'). 
 
      (!empty($_SERVER['REMOTE_USER']) ? $_SERVER['REMOTE_USER'].'@' : ''). 
 
      (isset($_SERVER['HTTP_HOST']) ? $_SERVER['HTTP_HOST'] : ($_SERVER['SERVER_NAME']. 
 
      ($https && $_SERVER['SERVER_PORT'] === 443 || 
 
      $_SERVER['SERVER_PORT'] === 22 ? '' : ':'.$_SERVER['SERVER_PORT']))). 
 
      substr($_SERVER['SCRIPT_NAME'],0, strrpos($_SERVER['SCRIPT_NAME'], '/')); 
 
    }

(main.js Datei aus Uploader I cha nged url von server/php zu server/php/index.php wie ich es in einem thread gesehen habe, und hostname zum hosting meiner seite, auf der ich auch die IP für mein server-hosting ausprobiert habe.

/* global $, window */ 
 
$(function() { 
 
    'use strict'; 
 
    // Initialize the jQuery File Upload widget: 
 
    $('#fileupload').fileupload({ 
 
     url: 'server/php/index.php' 
 
     }).on('fileuploadsubmit', function (e, data) { 
 
     data.formData = data.context.find(':input').serializeArray(); 
 
    }); 
 
    // Enable iframe cross-domain access via redirect option: 
 
    $('#fileupload').fileupload(
 
     'option', 
 
     'redirect', 
 
     window.location.href.replace(
 
      /\/[^\/]*$/, 
 
      '/cors/result.html?%s' 
 
     ) 
 
    ); 
 
    if (window.location.hostname === 'wmlmusicguide.com') { 
 
     // Demo settings: 
 
     $('#fileupload').fileupload('option', { 
 
      url: '//wmlmusicguide.com/admin/master_admin/server/php/index.php', 
 
      // Enable image resizing, except for Android and Opera, 
 
      // which actually support image resizing, but fail to 
 
      // send Blob objects via XHR requests: 
 
      disableImageResize: /Android(?!.*Chrome)|Opera/ 
 
       .test(window.navigator.userAgent), 
 
      maxFileSize: 999000, 
 
      acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i 
 
     }); 
 
     // Upload server status check for browsers with CORS support: 
 
     if ($.support.cors) { 
 
      $.ajax({ 
 
       url: '//wmlmusicguide.com/admin/master_admin/server/php/index.php', 
 
       type: 'HEAD' 
 
      }).fail(function() { 
 
       $('<div class="alert alert-danger"/>') 
 
        .text('Upload server currently unavailable - ' + 
 
          new Date()) 
 
        .appendTo('#fileupload'); 
 
      }); 
 
     } 
 
    } else { 
 
     // Load existing files: 
 
     $('#fileupload').addClass('fileupload-processing'); 
 
     $.ajax({ 
 
      // Uncomment the following to send cross-domain cookies: 
 
      //xhrFields: {withCredentials: true}, 
 
      url: $('#fileupload').fileupload('option', 'url'), 
 
      dataType: 'json', 
 
      context: $('#fileupload')[0] 
 
     }).always(function() { 
 
      $(this).removeClass('fileupload-processing'); 
 
     }).done(function (result) { 
 
      $(this).fileupload('option', 'done') 
 
       .call(this, $.Event('done'), {result: result}); 
 
     }); 
 
    } 
 
});

(auch in Kombination von einem anderen Thread und Unterstützung von einem Entwickler versucht)

/* global $, window */ 
 
/*jslint unparam: true, regexp: true */ 
 
/*global window, $ */ 
 
$(function() { 
 
    'use strict'; 
 
    // Initialize the jQuery File Upload widget: 
 
    $('#fileupload').fileupload({ 
 
     // Uncomment the following to send cross-domain cookies: 
 
     //xhrFields: {withCredentials: true}, 
 
     url: 'server/php/index.php' 
 
    }); 
 
    // Enable iframe cross-domain access via redirect option: 
 
    $('#fileupload').fileupload(
 
     'option', 
 
     'redirect', 
 
     window.location.href.replace(
 
      /\/[^\/]*$/, 
 
      '/cors/result.html?%s' 
 
     ) 
 
    );  \t 
 
\t $('#fileupload').fileupload({ 
 
\t \t url: 'server/php/index.php' 
 
\t \t }).on('fileuploadsubmit', function (e, data) { 
 
\t \t data.formData = data.context.find(':input').serializeArray(); 
 
\t });  \t 
 
    // Change this to the location of your server-side upload handler: 
 
    var url = window.location.hostname === 'GoDaddy server IP' ?     '//wmlmusicguide.com/admin/master_admin/server/php/index.php' : '../../server/php/', 
 
     uploadButton = $('<button/>') 
 
      .addClass('btn btn-primary') 
 
      .prop('disabled', true) 
 
      .text('Processing...') 
 
      .on('click', function() { 
 
       var $this = $(this), 
 
        data = $this.data(); 
 
       $this 
 
        .off('click') 
 
        .text('Abort') 
 
        .on('click', function() { 
 
         $this.remove(); 
 
         data.abort(); 
 
        }); 
 
       data.submit().always(function() { 
 
        $this.remove(); 
 
       }); 
 
      }); 
 
    $('#fileupload').fileupload({ 
 
     url: url, 
 
     dataType: 'json', 
 
     autoUpload: false, 
 
     acceptFileTypes: /(\.|\/)(gif|jpe?g|png|mp3|ogg|mp4)$/i, \t \t 
 
     maxFileSize: 26214400, 
 
     // Enable image resizing, except for Android and Opera, 
 
     // which actually support image resizing, but fail to 
 
     // send Blob objects via XHR requests: 
 
     disableImageResize: /Android(?!.*Chrome)|Opera/ 
 
      .test(window.navigator.userAgent), 
 
     previewMaxWidth: 100, 
 
     previewMaxHeight: 100, 
 
     previewCrop: true 
 
    }).on('fileuploadadd', function (e, data) { 
 
     data.context = $('<div/>').appendTo('#files'); 
 
     $.each(data.files, function (index, file) { 
 
      var node = $('<p/>') 
 
        .append($('<span/>').text(file.name)); 
 
      if (!index) { 
 
       node 
 
        .append('<br>') 
 
        .append(uploadButton.clone(true).data(data)); 
 
      } 
 
      node.appendTo(data.context); 
 
     }); 
 
    }).on('fileuploadprocessalways', function (e, data) { 
 
     var index = data.index, 
 
      file = data.files[index], 
 
      node = $(data.context.children()[index]); 
 
     if (file.preview) { 
 
      node 
 
       .prepend('<br>') 
 
       .prepend(file.preview); 
 
     } 
 
     if (file.error) { 
 
      node 
 
       .append('<br>') 
 
       .append($('<span class="text-danger"/>').text(file.error)); 
 
     } 
 
     if (index + 1 === data.files.length) { 
 
      data.context.find('button') 
 
       .text('Upload') 
 
       .prop('disabled', !!data.files.error); 
 
     } 
 
    }).on('fileuploadprogressall', function (e, data) { 
 
     var progress = parseInt(data.loaded/data.total * 100, 10); 
 
     $('#progress .progress-bar').css(
 
      'width', 
 
      progress + '%' 
 
     ); 
 
    }).on('fileuploaddone', function (e, data) { 
 
     $.each(data.result.files, function (index, file) { 
 
      if (file.url) { 
 
       var link = $('<a>') 
 
        .attr('target', '_blank') 
 
        .prop('href', file.url); 
 
       $(data.context.children()[index]) 
 
        .wrap(link); 
 
      } else if (file.error) { 
 
       var error = $('<span class="text-danger"/>').text(file.error); 
 
       $(data.context.children()[index]) 
 
        .append('<br>') 
 
        .append(error); 
 
      } 
 
     }); 
 
    }).on('fileuploadfail', function (e, data) { 
 
     $.each(data.files, function (index) { 
 
      var error = $('<span class="text-danger"/>').text('File upload failed.'); 
 
      $(data.context.children()[index]) 
 
       .append('<br>') 
 
       .append(error); 
 
     }); 
 
    }).prop('disabled', !$.support.fileInput) 
 
     .parent().addClass($.support.fileInput ? undefined : 'disabled'); 
 
});

(Backend für meine Post-Seite, wo der Uploader ist)

... 
 
<!-- The file upload form used as target for the file upload widget --> 
 
<form id="fileupload" action="//jquery-file-upload.appspot.com/" method="POST" enctype="multipart/form-data"> 
 
    <!-- Redirect browsers with JavaScript disabled to the origin page --> 
 
    <noscript><input type="hidden" name="redirect" value="https://blueimp.github.io/jQuery-File-Upload/"></noscript> 
 
    <!-- The fileupload-buttonbar contains buttons to add/delete files and start/cancel the upload --> 
 
    <div class="fileupload-buttonbar"> 
 
     <div class="fileupload-buttons"> 
 
      <!-- The fileinput-button span is used to style the file input field as button --> 
 
      <span class="fileinput-button"> 
 
       <span>Add files...</span> 
 
       <input type="file" name="files[]" multiple> 
 
      </span> 
 
      <button type="submit" class="start">Start upload</button> 
 
      <button type="reset" class="cancel">Cancel upload</button> 
 
      <button type="button" class="delete">Delete</button> 
 
      <input type="checkbox" class="toggle"> 
 
      <!-- The global file processing state --> 
 
      <span class="fileupload-process"></span> 
 
     </div> 
 
     <!-- The global progress state --> 
 
     <div class="fileupload-progress fade" style="display:none"> 
 
      <!-- The global progress bar --> 
 
      <div class="progress" role="progressbar" aria-valuemin="0" aria-valuemax="100"></div> 
 
      <!-- The extended global progress state --> 
 
      <div class="progress-extended">&nbsp;</div> 
 
     </div> 
 
    </div> 
 
    <!-- The table listing the files available for upload/download --> 
 
    <table role="presentation"><tbody class="files"></tbody></table> 
 
</form> 
 
<br> 
 
<!-- The blueimp Gallery widget --> 
 
<div id="blueimp-gallery" class="blueimp-gallery blueimp-gallery-controls" data-filter=":even"> 
 
    <div class="slides"></div> 
 
    <h3 class="title"></h3> 
 
    <a class="prev">‹</a> 
 
    <a class="next">›</a> 
 
    <a class="close">×</a> 
 
    <a class="play-pause"></a> 
 
    <ol class="indicator"></ol> 
 
</div> 
 
\t <div class="clear">&nbsp;</div> 
 
<table border="0" width="100%" cellpadding="0" cellspacing="0" id="content-table"> 
 
\t <tr> 
 
\t \t <th rowspan="3" class="sized"><img src="images/shared/side_shadowleft.jpg" width="20" height="300" alt="" /></th> 
 
\t \t <th class="topleft"></th> 
 
\t \t <td id="tbl-border-top">&nbsp;</td> 
 
\t \t <th class="topright"></th> 
 
\t \t <th rowspan="3" class="sized"><img src="images/shared/side_shadowright.jpg" width="20" height="300" alt="" /></th> 
 
\t </tr> 
 
\t <tr> 
 
\t \t <td id="tbl-border-left"></td> 
 
\t \t <td> 
 
\t \t <!-- start content-table-inner ...... START --> 
 
\t \t <div id="content-table-inner"> 
 
\t \t 
 
\t \t \t <!-- start table-content --> 
 
\t \t \t <div id="table-content" style="border:0px solid red"> \t \t 
 
\t \t \t \t \t \t \t 
 
\t \t \t \t <form id="postForm" action="postcontroller.php" method="post" enctype="multipart/form-data"> \t \t \t \t \t 
 
\t \t \t \t \t <!-- start id-form --> 
 
\t \t \t \t \t <table border="0" width="100%" cellpadding="0" cellspacing="0" id="id-form"> 
 
\t \t \t \t \t <tr> 
 
\t \t \t \t \t \t <th valign="top">Post Title:</th> 
 
\t \t \t \t \t \t <td><input type="text" class="inp-form required" name="name" value="<?php if(isset($data['row']['name'])) echo $data['row']['name']; ?>" /></td> 
 
\t \t \t \t \t </tr> 
 
\t \t \t \t \t <tr> 
 
\t \t \t \t \t \t <th valign="top">Description:</th> 
 
\t \t \t \t \t \t <td><textarea class="form-textarea" cols="" rows="" name="details"><?php if(isset($data['row']['details'])) echo $data['row']['details']; ?></textarea></td> 
 
\t \t \t \t \t \t <td></td> 
 
\t \t \t \t \t </tr> 
 
\t \t \t \t \t <tr> 
 
\t \t \t \t \t \t <th valign="top">URL:</th> 
 
\t \t \t \t \t \t <td><input type="url" class="inp-form" name="postlink" value="<?php if(isset($data['row']['post_link'])) echo $data['row']['post_link']; ?>" /></td> 
 
\t \t \t \t \t </tr> \t 
 
\t \t \t \t \t <tr> \t \t \t \t \t 
 
\t \t \t \t \t \t <th valign="top">Client:</th> 
 
\t \t \t \t \t \t <td> 
 
\t \t \t \t \t \t <?php \t 
 
\t \t \t \t \t \t \t $host_name = "localhost"; 
 
\t \t \t \t \t \t \t $database = "wmy database name"; \t \t 
 
\t \t \t \t \t \t \t $username = "my username";  \t \t 
 
\t \t \t \t \t \t \t $password = "my password";  \t \t 
 

 
\t \t \t \t \t \t \t //////// Do not Edit below ///////// 
 
\t \t \t \t \t \t \t try { 
 
\t \t \t \t \t \t \t \t $dbo = new PDO('mysql:host='.$host_name.';dbname='.$database, $username, $password); 
 
\t \t \t \t \t \t \t \t } catch (PDOException $e) { 
 
\t \t \t \t \t \t \t \t print "Error!: " . $e->getMessage() . "<br/>"; 
 
\t \t \t \t \t \t \t die(); 
 
\t \t \t \t \t \t \t } 
 
\t \t \t \t \t \t \t // Select all artists (clients) and order by name // 
 
\t \t \t \t \t \t \t $sql="SELECT aname FROM tbl_music_artists ORDER BY aname"; 
 
\t \t \t \t \t \t \t // multi-select dropdown - select which artists (clients) receive posts // 
 
\t \t \t \t \t \t ?> \t 
 
\t \t \t \t \t \t \t <select name="userids[]" class="chosen-select" data-placeholder="Choose a Client..." style="width:350px;" multiple> 
 
\t \t \t \t \t \t <?php 
 
\t \t \t \t \t \t \t foreach ($dbo->query($sql) as $row){ 
 
\t \t \t \t \t \t \t echo "<option value=$row[id]>$row[aname]</option>"; 
 
\t \t \t \t \t \t \t } 
 
\t \t \t \t \t \t ?> 
 
\t \t \t \t \t \t \t </select> 
 
\t \t \t \t \t \t </td> 
 
\t \t \t \t \t </tr> 
 
\t \t \t \t \t <tr> 
 
\t \t \t \t \t \t <th valign="top">Category:</th> 
 
\t \t \t \t \t \t <td> 
 
\t \t \t \t \t \t \t <select class="chosen-select" name="category"> 
 
\t \t \t \t \t \t \t \t <option value="">Select option</option> 
 
\t \t \t \t \t \t \t \t <option value="music" <?php if(isset($data['row']['category']) && $data['row']['category'] == 'music') echo "selected"; ?>>Music</option> 
 
\t \t \t \t \t \t \t \t <option value="video" <?php if(isset($data['row']['category']) && $data['row']['category'] == 'video') echo "selected"; ?>>Video</option> 
 
\t \t \t \t \t \t \t </select> 
 
\t \t \t \t \t \t </td> 
 
\t \t \t \t \t </tr> 
 
\t \t \t \t \t <tr> 
 
\t \t \t \t \t \t <th valign="top">Status:</th> 
 
\t \t \t \t \t \t <td> 
 
\t \t \t \t \t \t \t <select class="chosen-select" name="status"> 
 
\t \t \t \t \t \t \t \t <option value="1" <?php if(isset($data['row']['status']) && $data['row']['status'] == '1') echo "selected"; ?>>Active</option> 
 
\t \t \t \t \t \t \t \t <option value="0" <?php if(isset($data['row']['status']) && $data['row']['status'] == '0') echo "selected"; ?>>Inactive</option> 
 
\t \t \t \t \t \t \t </select> 
 
\t \t \t \t \t \t </td> 
 
\t \t \t \t \t </tr> 
 
\t \t \t \t \t <tr> 
 
\t \t \t \t \t \t <td>&nbsp;</td> 
 
\t \t \t \t \t \t <td> 
 
\t \t \t \t \t \t \t <input type="submit" value="" class="form-submit" /> 
 
\t \t \t \t \t \t \t <input id="restform" class="form-reset"> 
 
\t \t \t \t \t \t \t <a href="post.php" class="form-cancel">Cancel</a> 
 
\t \t \t \t \t \t </td> 
 
\t \t \t \t \t \t <td>&nbsp;</td> 
 
\t \t \t \t \t \t <td>&nbsp;</td> 
 
\t \t \t \t \t </tr> 
 
\t \t \t \t \t </table> 
 
\t \t \t \t \t <input type="hidden" name="form" value="<?php echo $data['formStatus'] ?>" /> 
 
\t \t \t \t \t <input type="hidden" name="id" id="id" value="<?php echo $data['id'] ?>" /> 
 
\t \t \t \t </form> 
 
\t \t \t </td> 
 
\t \t </tr> 
 
\t </table> 
 
</div> 
 
</div> 
 

 
\t <div class="clear">&nbsp;</div> 
 
\t 
 
<!-- The template to display files available for upload --> 
 
<script id="template-upload" type="text/x-tmpl"> 
 
{% for (var i=0, file; file=o.files[i]; i++) { %} 
 
    <tr class="template-upload fade"> 
 
     <td> 
 
      <span class="preview"></span> 
 
     </td> 
 
     <td> 
 
      <p class="name">{%=file.name%}</p> 
 
      <strong class="error"></strong> 
 
     </td> 
 
     <td> 
 
      <p class="size">Processing...</p> 
 
      <div class="progress"></div> 
 
     </td> 
 
     <td> 
 
      {% if (!i && !o.options.autoUpload) { %} 
 
       <button class="start" disabled>Start</button> 
 
      {% } %} 
 
      {% if (!i) { %} 
 
       <button class="cancel">Cancel</button> 
 
      {% } %} 
 
     </td> 
 
    </tr> 
 
{% } %} 
 
</script> 
 
<!-- The template to display files available for download --> 
 
<script id="template-download" type="text/x-tmpl"> 
 
{% for (var i=0, file; file=o.files[i]; i++) { %} 
 
    <tr class="template-download fade"> 
 
     <td> 
 
      <span class="preview"> 
 
       {% if (file.thumbnailUrl) { %} 
 
        <a href="{%=file.url%}" title="{%=file.name%}" download="{%=file.name%}" data-gallery><img src="{%=file.thumbnailUrl%}"></a> 
 
       {% } %} 
 
      </span> 
 
     </td> 
 
     <td> 
 
      <p class="name"> 
 
       <a href="{%=file.url%}" title="{%=file.name%}" download="{%=file.name%}" {%=file.thumbnailUrl?'data-gallery':''%}>{%=file.name%}</a> 
 
      </p> 
 
      {% if (file.error) { %} 
 
       <div><span class="error">Error</span> {%=file.error%}</div> 
 
      {% } %} 
 
     </td> 
 
     <td> 
 
      <span class="size">{%=o.formatFileSize(file.size)%}</span> 
 
     </td> 
 
     <td> 
 
      <button class="delete" data-type="{%=file.deleteType%}" data-url="{%=file.deleteUrl%}"{% if (file.deleteWithCredentials) { %} data-xhr-fields='{"withCredentials":true}'{% } %}>Delete</button> 
 
      <input type="checkbox" name="delete" value="1" class="toggle"> 
 
     </td> 
 
    </tr> 
 
{% } %} 
 
</script> 
 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
 
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script> 
 
<!-- The Templates plugin is included to render the upload/download listings --> 
 
<script src="//blueimp.github.io/JavaScript-Templates/js/tmpl.min.js"></script> 
 
<!-- The Load Image plugin is included for the preview images and image resizing functionality --> 
 
<script src="//blueimp.github.io/JavaScript-Load-Image/js/load-image.all.min.js"></script> 
 
<!-- The Canvas to Blob plugin is included for image resizing functionality --> 
 
<script src="//blueimp.github.io/JavaScript-Canvas-to-Blob/js/canvas-to-blob.min.js"></script> 
 
<!-- blueimp Gallery script --> 
 
<script src="//blueimp.github.io/Gallery/js/jquery.blueimp-gallery.min.js"></script> 
 
<!-- The Iframe Transport is required for browsers without support for XHR file uploads --> 
 
<script src="../js/jquery.iframe-transport.js"></script> 
 
<!-- The basic File Upload plugin --> 
 
<script src="../js/jquery.fileupload.js"></script> 
 
<!-- The File Upload processing plugin --> 
 
<script src="../js/jquery.fileupload-process.js"></script> 
 
<!-- The File Upload image preview & resize plugin --> 
 
<script src="../js/jquery.fileupload-image.js"></script> 
 
<!-- The File Upload audio preview plugin --> 
 
<script src="../js/jquery.fileupload-audio.js"></script> 
 
<!-- The File Upload video preview plugin --> 
 
<script src="../js/jquery.fileupload-video.js"></script> 
 
<!-- The File Upload validation plugin --> 
 
<script src="../js/jquery.fileupload-validate.js"></script> 
 
<!-- The File Upload user interface plugin --> 
 
<script src="../js/jquery.fileupload-ui.js"></script> 
 
<!-- The File Upload jQuery UI plugin --> 
 
<script src="../js/jquery.fileupload-jquery-ui.js"></script> 
 
<!-- The main application script --> 
 
<script src="../js/main.js"></script> 
 
<script> 
 
// Initialize the jQuery UI theme switcher: 
 
$('#theme-switcher').change(function() { 
 
    var theme = $('#theme'); 
 
    theme.prop(
 
     'href', 
 
     theme.prop('href').replace(
 
      /[\w\-]+\/jquery-ui.css/, 
 
      $(this).val() + '/jquery-ui.css' 
 
     ) 
 
    ); 
 
}); 
 
// Post Form Validate 
 
\t $(document).ready(function() { 
 
\t \t $('#postForm').validate({ 
 
\t \t \t errorElement: "div", 
 
\t \t \t rules: { 
 
\t \t \t  name: { required: true }, 
 
\t \t \t  details: { required: true }, 
 
\t \t \t  category: { required: true } 
 
\t \t \t } 
 
\t \t }); 
 
\t \t $('#restform').click(function(){ 
 
      $('#postForm')[0].reset(); 
 
    \t \t }); 
 
\t }); 
 
// Chosen multi-select 
 
\t var config = { 
 
\t '.chosen-select' : {}, 
 
\t '.chosen-select-deselect' : {allow_single_deselect:true}, 
 
\t '.chosen-select-no-single' : {disable_search_threshold:10}, 
 
\t '.chosen-select-no-results': {no_results_text:'Oops, nothing found!'}, 
 
\t '.chosen-select-width' : {width:"95%"} 
 
\t } 
 
\t for (var selector in config) { 
 
\t $(selector).chosen(config[selector]); 
 
\t } 
 
</script>

(Frontend Verbindung zu meiner Post-Seite)

<?php  
 
\t include('includes/inc.php'); 
 
\t include("includes/classes/class.post.php"); 
 
\t include("includes/classes/class.artist.php"); 
 
\t $post \t = new Post(); 
 
\t 
 
\t //new \t 
 
\t $data['formStatus'] = 'new'; 
 
\t $data['id'] = 0; 
 
\t $data['aid'] = 0; 
 
\t if($_SERVER['REQUEST_METHOD'] == 'GET'){ 
 
\t \t $id = isset($_GET['id']) ? $_GET['id'] : 0; 
 
\t \t $checkRow = $post->get_row($id); 
 
\t \t if(is_array($checkRow)){ 
 
\t \t \t $data['formStatus'] = 'edit'; 
 
\t \t \t $data['row'] = $checkRow; 
 
\t \t \t $data['id'] = $checkRow['id']; 
 
\t \t \t $data['post'] = checkImagexists('../../uploads/', 'post_' . $checkRow['id']); 
 
\t \t } 
 
\t } 
 
\t layout('post_form', $data); 
 
?>

(Postcontroller Datei, wo ich versuchte zunächst Dateien aus dem Datei-Uploader zu bekommen)

<?php  
 
\t session_start(); 
 
\t include("includes/functions.php"); 
 
\t include("includes/classes/class.post.php"); \t  \t 
 
\t if($_SERVER['REQUEST_METHOD'] == 'POST'){ \t 
 
\t //Get newly uploaded files from /uploads/server/php 
 
\t \t $files = $_POST['files'];  \t \t \t \t 
 
\t \t if(!empty($files)){ 
 
\t \t \t //Rename all files in the upload server php directory to post_id format 
 
\t \t \t //Move files to upload directory 
 
\t \t \t foreach ($files as $file){ \t \t 
 
\t \t \t \t if ($handle = opendir('../../uploads/server/php/')) { 
 
\t \t \t \t \t while (false !== ($fileName = readdir($handle))) { 
 
\t \t \t \t \t \t $newName = '../../uploads/' . 'post_' . $_POST['id'] . '_' . $file; 
 
\t \t \t \t \t \t $oldName = '../../uploads/client/files/' . $file; 
 
\t \t \t \t \t \t rename($oldName, $newName); 
 
\t \t \t \t \t } 
 
\t \t \t \t } 
 
\t \t \t \t closedir($handle); 
 
\t \t \t } 
 
\t \t } \t \t \t 
 
\t \t 
 
\t \t $client_cat = isset($_POST['userids']) ? $_POST['userids'] : array(); \t 
 
\t \t $user_id = $_SESSION['user_id'];  \t \t 
 
\t \t // Client post to own page 
 
\t \t $post = new post(); 
 
\t \t $arrData = array();  \t \t 
 
\t \t $arrData['name'] = addslashes(ucwords($_POST['name'])); 
 
\t \t $arrData['details'] = addslashes($_POST['details']); 
 
\t \t $arrData['post_link'] = $_POST['post_link']; \t \t 
 
\t \t $arrData['status'] = addslashes($_POST['status']); 
 
\t \t $arrData['type'] = $_FILES['image']['type']; 
 
\t \t $arrData['category'] = addslashes($_POST['category']);  \t \t \t 
 
\t \t if(empty($_POST['id'])){ 
 
\t \t \t $arrData['user_id'] = $user_id; 
 
\t \t \t $arrData['added_date'] = date('Y-m-d H:i:s'); \t 
 
\t \t \t $insert = $post->add($arrData); 
 
\t \t \t if($insert){ 
 
\t \t \t \t $client_prop = array_merge($client_cat, $files); 
 
\t \t \t \t $client->add_prop($client_prop, $insert, 'artist'); 
 
\t \t \t } 
 
\t \t } \t \t 
 
\t } 
 
\t else 
 
\t { 
 
\t \t echo "Invalid file"; 
 
\t } 
 
\t header('Location: post.php?act=' . $_SESSION['insert_post']); 
 
?>

screenshot of index.php for the uploader where i tried to make the connection to my database as instructed screenshot of mysql post & files table, the fields that were created as instructed

Antwort

0

Ich konnte die Verbindung zwischen dem blueimp jQuery-Datei-Uploader und der mySQL-Datenbank aus der Antwort herstellen, die ich in einem anderen Thread hier von Loki gefunden habe. Wenn man nicht so hilfreich ist, wenn man nicht weiß, was man tut, ist die Integration, die auf dem blueimp github veröffentlicht wird, nicht die Lösung. Ich musste beide in Verbindung miteinander benutzen, damit es funktionierte.

Ich möchte mich bei Loki und der Plattform von stackoverflow für die Unterstützung bei der Lösung dieses Problems bedanken.

screenshot of my post page before/after file upload, index.php (file from the jquery file uploader) files print report, and mysql files table after file uploading