Question

我想在使用jquery dropzone后上传带有预览的图片。

首先，如果只使用dropzone上传一个图像，则会显示图像，并使用日期+随机数来识别唯一的名称。

这是第一种方式，

第二种方式，我想添加一个图像并给出唯一的名称，也必须将它保存在数据库中。但是当上传第二张图片时，它会替换第一张图片

有没有办法呢

=============================================== =======================

这是执行多个上传图片的脚本，放在视图上：header.php。我为header.php中的其他dropzone函数提供了相同的功能。只需在视图中替换div标签ID和输入标签

<script type="text/javascript">
$(function() {
  var name = Date.now();
  var key = Math.floor((Math.random() * 99999999999) + 1);
  var unique = name+'-'+key;

  $("div#eyeDropZone").dropzone({
       url:'http://localhost/work/uploadimage/multiple/'+unique,

       paramName:'foto', // param to upload image name to db
       uploadMultiple:false,
       maxFiles:2,

       acceptedFiles: '.jpg',
       maxFilesize:1,
       addRemoveLinks: 'no',
       dictFileTooBig: "File size ({{filesize}}MB). Max File Size: {{maxFilesize}}MB.",
       dictInvalidFileType: "JPG Only",


      init: function() {
        this.on("maxfilesexceeded", function(file) {
        this.removeAllFiles();
        this.addFile(file);

        });
        this.on("removedfile", function(file, xhr, formData) {
        $("#filename").val('');
         });
       },

      accept: function(file, done) {
        var filename = file.name;
        $("#filename").val(unik);
        done();
        }
  });
});
</script>

这是控制器，这段代码是由朋友开发的。他需要我帮助改变一点，首先只使用jquery dropzone将图像上传到文件夹并从文件夹中删除图像，然后插入数据库，同时将图像保存到文件夹。

public function birthday_upload($unique='')
{
  error_reporting(0);
  $this->form_validation->set_error_delimiters('<div style="border: 1px solid: #999999; background-color: #ffff99;">', '</div>');

  $config['image_library'] = 'gd2';
  $original_path                     = './birthday/original';
  $resized_path                      = './birthday/resized';
  $thumbs_path                       = './birthday/thumb';
  $this->load->library('image_lib', $config);

  unlink('./birthday/original/'.$uniks.'.jpg');
  unlink('./birthday/resized/'.$uniks.'.jpg');
  unlink('./birthday/thumb/'.$uniks.'.jpg');

  $config = array(
          'allowed_types'   => 'jpg|jpeg',
          'max_size'        => 1024,
          'upload_path'     => $original_path, //upload directory
          'file_name'       => $uniks,
          );

  $gambar['filename'] = $uniks;
  $this->load->library('upload', $config);
  $this->upload->do_upload('foto');
  $image_data = $this->upload->data(); //upload the image
  $image['foto'] = $image_data['file_name'];

  //your desired config for the resize() function
  $config = array(
          'source_image'     => $image_data['full_path'], //path to the uploaded image
          'new_image'        => $resized_path,
          'maintain_ratio'   => false,
          'width'            => 566,
          'height'           => 238
          );

  $this->image_lib->initialize($config);
  $this->image_lib->resize();

  // for the Thumbnail image
  $config = array(
          'source_image'         => $image_data['full_path'],
          'new_image'            => $thumbs_path,
          'maintain_ratio'       => true,
          'width'                => 100,
          'height'               => 100
          );

  //here is the second thumbnail, notice the call for the initialize() function again
  $this->image_lib->initialize($config);

  $this->birthday_m->simpan($gambar);

}

这是插入图像的方式

public function simpan($gambar)
{
  error_reporting(0);

  $name_fb              = mysql_real_escape_string($this->input->post('name'));
  $gender_fb            = mysql_real_escape_string($this->input->post('gender'));
  $tempat_lahir_fb  = mysql_real_escape_string($this->input->post('pob_child'));
  $child_birth_fb   = mysql_real_escape_string($this->input->post('birth_child'));
  $email_fb                 = mysql_real_escape_string($this->input->post('email'));
  $address_fb           = mysql_real_escape_string($this->input->post('address'));
  $nama_anak_fb         = mysql_real_escape_string($this->input->post('child_name'));
  $filename_fb          = mysql_real_escape_string($this->input->post('foto_name').'.jpg');
  // add to the line below to save image name to database
  $akta_fb                  = mysql_real_escape_string($this->input->post('akta_name').'.jpg');

  $data= array(
    'name_fbd'                  => $name_fb,
    'email_fbd'                 => $email_fb,
    'address_fbd'           => $address_fb,
    'nama_anak_fbd'         => $nama_anak_fb,
    'tempat_lahir_fbd'  => $tempat_lahir_fb,
    'child_birth_fbd'       => $child_birth_fb,
    'filename_fbd'          => $filename_fb,
    'filename_akta'         => $akta_fb,
    'gender_fbd'            => $gender_fb,
    'dateregister_fbd'  => $now,
    'voucher_fbd'           => $voucher,
    'handphone_fbd'         => $handphones,
    // 'dateupdate'     => ''
  );


  $this->db->insert('mydatabase',$data);
  {
    redirect(''.base_url().'birthdays/success/');
  }
}

这是观点，我为新的dropzone区域制作了其他dropzone功能来上传图片，它是在dropzone区域成功显示图像，但第一个图像被第二个图像替换。而flaname只显示在dropzone区域下面的一个。

<div class="dropzone" id="my-awesome-dropzone">
  <div id="eyeDropZone" class="dropzone" ></div>
  <input multiple  name="foto_name" type="text" id="filename"  required readonly />

</div>
<div class="dropzone" id="my-awesome-dropzone">
  <div id="eyeDropZone" class="dropzone" ></div>
  <input multiple  name="akta_name" type="text" id="filenameakta"  required readonly/>
</div>

询问jquery上传多个图片

0 个答案: