将类别标记到我上传的多张图片中

Tag category to my multiple uploaded images

本文关键字：张图片      更新时间：2023-09-26

我正在提交一个带有多个文件上传的表单，我只想
根据上传的图像的类别对其进行区分
上传

<form action="upload.php" method="POST">
<table>
  <tr>
     <td>
        <select name="category[]" >
           <option value="13">Food</option>
           <option value="15">Medicine</option>
        </select>
     </td>
     <td>
        <input type="file" multiple name="product_image[]">
     </td>
  </tr>
  <tr>
     <td>
        <select name="category[]" >
           <option value="13">Food</option>
           <option value="15">Medicine</option>
        </select>
     </td>
     <td>
        <input type="file" multiple name="product_image[]">
     </td>
  </tr>
  <tr>
     <td>
        <input type="submit" value="submit">
     </td>
  </tr>
</table>
</form>

选择类别为"食物"，并在第一行上传一张名为"food.jpg"的图片。选择类别为"medical"，并在第二行上传两张名为"medicine1.jpg和medicine2.jpg"的图像提交后，我的结果将作为

Array(
      [category] => Array
           (
            [0] => 13
            [1] => 15
           )
      [product_image] => Array
           (
            [0] => food.jpg
            [1] => medicine1.jpg
            [2] => medicine2.jpg
           )
)

但我想根据类别值标记图像。就像我想要

[product_image] => Array
           (
            [13] => food.jpg
            [15] => medicine1.jpg
            [15] => medicine2.jpg
           )

一个可能的解决方案是在提交表单时创建一个隐藏的输入字段，该字段包含所选类别id和文件名的串联值。格式可以是这样的：

'id_selected_category##filename]

然后，您可以使用此分隔符（在本例中为##）从$_POST数组中检索服务器上的类别和文件名，这样您就可以知道为该图像选择了哪个类别。

本例中隐藏输入字段的名称为：

'category_file'

然后，您的$_POST阵列将看起来像这样：

array(3) {
  ["category"]=>
  array(2) {
    [0]=>
    string(2) "13"
    [1]=>
    string(2) "13"
  }
  ["product_image"]=>
  array(3) {
    [0]=>
    string(5) "1.jpg"
    [1]=>
    string(5) "2.jpg"
    [2]=>
    string(5) "3.jpg"
  }
  ["category_file"]=>
  array(3) {
    [0]=>
    string(9) "13##1.jpg"
    [1]=>
    string(9) "13##2.jpg"
    [2]=>
    string(9) "13##3.jpg"
  }
}

例如：

<?php
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    if (isset($_POST['category_file'])) {
        $categoryFiles = $_POST['category_file'];
        foreach($categoryFiles as $categoryFile) {
            $categoryAndFile = array_filter(explode("##", $categoryFile));
            if (count($categoryAndFile) == 2) {
                // Here you can differentiate the uploaded images according to the category which they were uploaded
                $category = $categoryAndFile[0];
                $file = $categoryAndFile[1];
            }
        }
    }
}
?>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $("#theForm").submit(function() {
                var categories = $('select[name=category''['']]');
                $(categories).each(function() {
                    var category = this;
                    var imageNames = $(this).parent().next().children('input[type="file"]').prop("files");
                    $(imageNames).each(function(){
                        // Concatenate the selected category with the name of the image
                        var categoryFileName = $(category).val() + '##' + this.name;
                        // Add the hidden input field
                        $('<input>').attr({
                            type: 'hidden',
                            name: 'category_file[]',
                            value: categoryFileName
                        }).appendTo("#theForm");
                    });
                });
            });
        });
    </script>
</head>
<body>
<form id="theForm" action="upload.php" method="POST">
    <table>
        <tr>
            <td>
                <select name="category[]" >
                    <option value="13">Food</option>
                    <option value="15">Medicine</option>
                </select>
            </td>
            <td>
                <input type="file" multiple name="product_image[]">
            </td>
        </tr>
        <tr>
            <td>
                <select name="category[]" >
                    <option value="13">Food</option>
                    <option value="15">Medicine</option>
                </select>
            </td>
            <td>
                <input type="file" multiple name="product_image[]">
            </td>
        </tr>
        <tr>
            <td>
                <input type="submit" value="submit">
            </td>
        </tr>
    </table>
</form>
</body>
</html>

if (!is_dir($dir)) {
        mkdir($dir);  
else 
    //upload image  

    }

创建目录

当您获得图像并准备保存到数据库中时，使用上面的代码和教程创建目录。然后将该图像上传到指定的目录路径中。

相关文章：