Question

我正在建立一个网站，您可以像Facebook一样上传帖子一切都很好，除了你上传帖子的那一刻和上传后你可以上传图片到该帖子。

我希望能够将图片上传到帖子中，然后上传带有图片的帖子。这是我的尝试：

数据库图像表

+-------------------------------------------------+
  | image_id | user_id | image_name |  post_id  | 
  |    1     |    1    |    bla     |     2     | 
+-------------------------------------------------+

视图

<script>
$(function () {
    $("#imageUpload").submit(function (e) { 
        e.preventDefault();
        var formData = new FormData($('#imageUpload')[0]);
            $.ajax({
                url: 'post/create',  //Trying to call the controller
                type: 'post',
                data: formData,
                cache: false,
                contentType: false,
                processData: false
            });
          return false;
        });
    });
</script>

<form action="<?php echo Config::get('URL');?>post/create" method="post" id="imageUpload" enctype="multipart/form-data">
    <input type="text" name="post_text" placeholder="Post something" />
    <input type="file" name="images[]" multiple required />
    <input type="submit" value='post' autocomplete="off" />
</form>

控制器

public function create()
{   
    PostModel::createPost(strip_tags($_POST['post_text']));
    PostModel::uploadPostImages($_POST['post_id']);
}

我遗漏了模型，因为那里的功能很好。

如何在发布帖子之前获取帖子ID以在图像表中使用它？

对于任何形式的帮助我都会感激不尽!!

更新

<script>
    $("#imageUpload").submit(function (e) { 
             var fd = new FormData();
             var imagefile= document.getElementById('imagefile');
             var files = imagefile.files;

            for (var i = 0; i < files.length; i++) 
            {
              var file = files[i];                
              fd.append('imagefile[]', file, file.name);
            }
            fd.append("post_text", document.getElementById('post_text').value);
            fd.append("post_id", document.getElementById('post_id').value);      

        $.ajax({
            url: 'post/create',
            type: 'POST',
            data: fd,
            cache: false,
            contentType: false,
            processData: false
        });
      return false;
    });
});
</script>
<form action="<?php echo Config::get('URL');?>post/create" method="post" id="imageUpload" enctype="multipart/form-data">
    <input type="text" name="post_text" id="post_text" placeholder="Post something" />
    <input type="file" name="images[]" id="imagefile" multiple required />
    <input type="hidden" name="post_id" id="post_id" value="post_id" />
    <input type="submit" value='post' autocomplete="off" />
 </form>

Answer 1

您无法通过jquery ajax直接上传图片。此外，您允许通过ajax上传多个文件。这是你的代码。它还允许您使用输入文本值上传多个图像。

    $("#imageUpload").submit(function (e) { 
             var fd = new FormData();
             var imagefile= document.getElementById('imagefile');
             var files = imagefile.files;

            for (var i = 0; i < files.length; i++) 
            {
              var file = files[i];                
              fd.append('imagefile[]', file, file.name);
            }
            fd.append("post_text", document.getElementById('post_text').value);
           fd.append("post_id", document.getElementById('post_id').value);      

        $.ajax({
            url: 'post/create',  //Trying to call the controller
            type: 'POST',
            data: fd,
            cache: false,
            contentType: false,
            processData: false
        });
      return false;
    });
});

您更新的HTML

 <form action="<?php echo Config::get('URL');?>post/create" method="post" id="imageUpload" enctype="multipart/form-data">
<input type="text" name="post_text" id="post_text" placeholder="Post something" />
<input type="file" name="images[]" id="imagefile" multiple required />
<input type="hidden" name="post_id" id="post_id" value="<?=$_GET['post_id']?>" />
<input type="submit" value='post' autocomplete="off" />

获取搜索结果的ID

1 个答案: