كيفية إظهار حقل إدخال حسب الخيار المحدد في قائمة select ومعالجة الملفات المرفوعة في PHP

Omer Amad · 5 يوليو

السلام عليكم ورحمة الله وبركاته... اسعد الله مساك بكل خير الأخوة الزملاء...

هل يمكن أن اضع اكثر من سكربت خاص ب شروط... يعني فيه عندي select فيه خيارات عدد 2 الخيار الأول والخيار الثاني لما يتم يختار الخيار الأول يظهر حقل أنبوت خاص للإرفاق الصور.... علمآ قمت ب إنشاء أنبوت عدد 2 ووضعت لهم اعمده عدد 2 ..... اسم العامود الأول inf1 واسم العامود الثاني inf2.... الاعمده اقصد في database.... وهل يمكن ان نحدد حجم الصور

يعني الموضوع هن شروط لما يتم اختيار الخيار الأول من السلكت سيظهر الانبوت صاحب العامود inf1..... تحياتي

تم التعديل في 5 يوليو بواسطة Mustafa Suleiman
تعديل عنوان السؤال

Mustafa Suleiman · 5 يوليو

في حال فهمت ما تريده، فالأمر يتم من خلال جافاسكريبت لإظهار وإخفاء الحقول، كالتالي:

<!DOCTYPE html>
<html lang="ar">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script>
        function toggleInput() {
            var selectElement = document.getElementById("options");
            var inf1Field = document.getElementById("inf1Field");
            var inf2Field = document.getElementById("inf2Field");

            if (selectElement.value === "option1") {
                inf1Field.style.display = "block";
                inf2Field.style.display = "none";
            } else if (selectElement.value === "option2") {
                inf1Field.style.display = "none";
                inf2Field.style.display = "block";
            } else {
                inf1Field.style.display = "none";
                inf2Field.style.display = "none";
            }
        }
    </script>
</head>
<body>
    <form action="process.php" method="post" enctype="multipart/form-data">
        <label for="options">اختر الخيار:</label>
        <select id="options" name="options" onchange="toggleInput()">
            <option value="">اختر...</option>
            <option value="option1">الخيار الأول</option>
            <option value="option2">الخيار الثاني</option>
        </select>

        <div id="inf1Field" style="display: none;">
            <label for="inf1">حقل inf1:</label>
            <input type="file" name="inf1" id="inf1" accept="image/*">
        </div>

        <div id="inf2Field" style="display: none;">
            <label for="inf2">حقل inf2:</label>
            <input type="file" name="inf2" id="inf2" accept="image/*">
        </div>

        <button type="submit">إرسال</button>
    </form>
</body>
</html>

ثم في PHP تقوم بمعالجة الحقول المرسلة وتحديد حجم الصور كالتالي:

<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    $option = $_POST["options"];
    $targetDir = "uploads/";
    $uploadOk = 1;

    if ($option == "option1" && isset($_FILES["inf1"])) {
        $targetFile = $targetDir . basename($_FILES["inf1"]["name"]);
        $imageFileType = strtolower(pathinfo($targetFile, PATHINFO_EXTENSION));

        if ($_FILES["inf1"]["size"] > 2000000) {
            echo "عذراً، حجم الملف كبير جداً.";
            $uploadOk = 0;
        }

        $check = getimagesize($_FILES["inf1"]["tmp_name"]);
        if ($check === false) {
            echo "الملف ليس صورة.";
            $uploadOk = 0;
        }

        if ($uploadOk == 1) {
            if (move_uploaded_file($_FILES["inf1"]["tmp_name"], $targetFile)) {
                echo "تم رفع الملف ". htmlspecialchars(basename($_FILES["inf1"]["name"])). " بنجاح.";
            } else {
                echo "عذراً، حدث خطأ أثناء رفع الملف.";
            }
        }
    } elseif ($option == "option2" && isset($_FILES["inf2"])) {
        $targetFile = $targetDir . basename($_FILES["inf2"]["name"]);
        $imageFileType = strtolower(pathinfo($targetFile, PATHINFO_EXTENSION));

        if ($_FILES["inf2"]["size"] > 2000000) {
            echo "عذراً، حجم الملف كبير جداً.";
            $uploadOk = 0;
        }

        $check = getimagesize($_FILES["inf2"]["tmp_name"]);
        if ($check === false) {
            echo "الملف ليس صورة.";
            $uploadOk = 0;
        }

        if ($uploadOk == 1) {
            if (move_uploaded_file($_FILES["inf2"]["tmp_name"], $targetFile)) {
                echo "تم رفع الملف ".

محمد عاطف17 · 5 يوليو

وعليكم السلام ورحمة الله وبركاته.

الأمر يعتمد على ما تريد تنفيذه فإذا أردت أن يوجد 2 inputs للصور ويظهر حقل واحد بناء على إختيار من select فالحل الصحيح كما وضح مصطفي في التعليق السابق .

ولكن ما فهمته أنك تريد إرفاق صورة ووضعها في حقل بناء على إختيار select . ففي هذه الحالة الحل الأفضل هو وضع input واحد وليس إثنين كما فعلت . حيث يتم إرسال الملف من خلال input واحد ولكن في الواجهة الخلفية نقوم بتحديد الحقل في قاعدة البيانات بناء على ما تم إختياره من العنصر select .

وهذا هو ملف الواجهة الأمامية html :

<!DOCTYPE html>
<html lang="ar">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
    <form action="upload.php" method="post" enctype="multipart/form-data">
        <label for="option">من فضلك إختر من التالي:</label>
        <select id="option" name="option">
            <option value="">اختر...</option>
            <option value="inf1">الخيار الأول</option>
            <option value="inf2">الخيار الثاني</option>
        </select>

        <div>
            <label for="image">حقل الصورة:</label>
            <input type="file" name="image" accept="image/*">
        </div>

        <button type="submit">إرسال</button>
    </form>
</body>
</html>

والآن في جزء الواجهة الخلفية ملف upload.php:

<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    $option = $_POST["option"];
    $path = "uploads/";
    if ($option != "inf1" || $option != "inf2") {
        echo "من فضلك إختر خيار صحيح";
        die();
    }
    $targetFile = $path . basename($_FILES["image"]["name"]);
    if ($_FILES["image"]["size"] > 2000000) {
        echo "عذراً، حجم الملف كبير جداً.";
        die();
    }
    // الاتصال بقاعدة البيانات
    $servername = "localhost";
    $username = "root";
    $password = "";
    $dbname = "db_name";

    $conn = new mysqli($servername, $username, $password, $dbname);

    if ($conn->connect_error) {
        die("فشل الاتصال: " . $conn->connect_error);
    }

   
    if (move_uploaded_file($_FILES["image"]["tmp_name"], $targetFile)) {
        $sql = "INSERT INTO table_name ($option) VALUES ('$targetFile')";

        if ($conn->query($sql) === TRUE) {
            echo "تم رفع الملف بنجاح";
        } else {
            echo "عذراً، حدث خطأ أثناء رفع الملف.";
            die();
        }
        $conn->close();
    } else {
        echo "عذراً، حدث خطأ أثناء رفع الملف.";
    }
}

Omer Amad · 5 يوليو

بتاريخ 2 ساعة قال Mustafa Suleiman:

في حال فهمت ما تريده، فالأمر يتم من خلال جافاسكريبت لإظهار وإخفاء الحقول، كالتالي:

<!DOCTYPE html>
<html lang="ar">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script>
        function toggleInput() {
            var selectElement = document.getElementById("options");
            var inf1Field = document.getElementById("inf1Field");
            var inf2Field = document.getElementById("inf2Field");

            if (selectElement.value === "option1") {
                inf1Field.style.display = "block";
                inf2Field.style.display = "none";
            } else if (selectElement.value === "option2") {
                inf1Field.style.display = "none";
                inf2Field.style.display = "block";
            } else {
                inf1Field.style.display = "none";
                inf2Field.style.display = "none";
            }
        }
    </script>
</head>
<body>
    <form action="process.php" method="post" enctype="multipart/form-data">
        <label for="options">اختر الخيار:</label>
        <select id="options" name="options" onchange="toggleInput()">
            <option value="">اختر...</option>
            <option value="option1">الخيار الأول</option>
            <option value="option2">الخيار الثاني</option>
        </select>

        <div id="inf1Field" style="display: none;">
            <label for="inf1">حقل inf1:</label>
            <input type="file" name="inf1" id="inf1" accept="image/*">
        </div>

        <div id="inf2Field" style="display: none;">
            <label for="inf2">حقل inf2:</label>
            <input type="file" name="inf2" id="inf2" accept="image/*">
        </div>

        <button type="submit">إرسال</button>
    </form>
</body>
</html>

ثم في PHP تقوم بمعالجة الحقول المرسلة وتحديد حجم الصور كالتالي:

<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    $option = $_POST["options"];
    $targetDir = "uploads/";
    $uploadOk = 1;

    if ($option == "option1" && isset($_FILES["inf1"])) {
        $targetFile = $targetDir . basename($_FILES["inf1"]["name"]);
        $imageFileType = strtolower(pathinfo($targetFile, PATHINFO_EXTENSION));

        if ($_FILES["inf1"]["size"] > 2000000) {
            echo "عذراً، حجم الملف كبير جداً.";
            $uploadOk = 0;
        }

        $check = getimagesize($_FILES["inf1"]["tmp_name"]);
        if ($check === false) {
            echo "الملف ليس صورة.";
            $uploadOk = 0;
        }

        if ($uploadOk == 1) {
            if (move_uploaded_file($_FILES["inf1"]["tmp_name"], $targetFile)) {
                echo "تم رفع الملف ". htmlspecialchars(basename($_FILES["inf1"]["name"])). " بنجاح.";
            } else {
                echo "عذراً، حدث خطأ أثناء رفع الملف.";
            }
        }
    } elseif ($option == "option2" && isset($_FILES["inf2"])) {
        $targetFile = $targetDir . basename($_FILES["inf2"]["name"]);
        $imageFileType = strtolower(pathinfo($targetFile, PATHINFO_EXTENSION));

        if ($_FILES["inf2"]["size"] > 2000000) {
            echo "عذراً، حجم الملف كبير جداً.";
            $uploadOk = 0;
        }

        $check = getimagesize($_FILES["inf2"]["tmp_name"]);
        if ($check === false) {
            echo "الملف ليس صورة.";
            $uploadOk = 0;
        }

        if ($uploadOk == 1) {
            if (move_uploaded_file($_FILES["inf2"]["tmp_name"], $targetFile)) {
                echo "تم رفع الملف ".

شكرآ جزيلاً سؤال ماهي المتغيرات الذي سيتم وضعها في سطر values... وانا عندي لكل عامود ملف تخزن فيه الصور مثلاً

inf1 اسم المجلد img

inf2 اسم المجلد img2

بتاريخ 2 ساعة قال Mustafa Suleiman:

في حال فهمت ما تريده، فالأمر يتم من خلال جافاسكريبت لإظهار وإخفاء الحقول، كالتالي:

<!DOCTYPE html>
<html lang="ar">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script>
        function toggleInput() {
            var selectElement = document.getElementById("options");
            var inf1Field = document.getElementById("inf1Field");
            var inf2Field = document.getElementById("inf2Field");

            if (selectElement.value === "option1") {
                inf1Field.style.display = "block";
                inf2Field.style.display = "none";
            } else if (selectElement.value === "option2") {
                inf1Field.style.display = "none";
                inf2Field.style.display = "block";
            } else {
                inf1Field.style.display = "none";
                inf2Field.style.display = "none";
            }
        }
    </script>
</head>
<body>
    <form action="process.php" method="post" enctype="multipart/form-data">
        <label for="options">اختر الخيار:</label>
        <select id="options" name="options" onchange="toggleInput()">
            <option value="">اختر...</option>
            <option value="option1">الخيار الأول</option>
            <option value="option2">الخيار الثاني</option>
        </select>

        <div id="inf1Field" style="display: none;">
            <label for="inf1">حقل inf1:</label>
            <input type="file" name="inf1" id="inf1" accept="image/*">
        </div>

        <div id="inf2Field" style="display: none;">
            <label for="inf2">حقل inf2:</label>
            <input type="file" name="inf2" id="inf2" accept="image/*">
        </div>

        <button type="submit">إرسال</button>
    </form>
</body>
</html>

ثم في PHP تقوم بمعالجة الحقول المرسلة وتحديد حجم الصور كالتالي:

<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    $option = $_POST["options"];
    $targetDir = "uploads/";
    $uploadOk = 1;

    if ($option == "option1" && isset($_FILES["inf1"])) {
        $targetFile = $targetDir . basename($_FILES["inf1"]["name"]);
        $imageFileType = strtolower(pathinfo($targetFile, PATHINFO_EXTENSION));

        if ($_FILES["inf1"]["size"] > 2000000) {
            echo "عذراً، حجم الملف كبير جداً.";
            $uploadOk = 0;
        }

        $check = getimagesize($_FILES["inf1"]["tmp_name"]);
        if ($check === false) {
            echo "الملف ليس صورة.";
            $uploadOk = 0;
        }

        if ($uploadOk == 1) {
            if (move_uploaded_file($_FILES["inf1"]["tmp_name"], $targetFile)) {
                echo "تم رفع الملف ". htmlspecialchars(basename($_FILES["inf1"]["name"])). " بنجاح.";
            } else {
                echo "عذراً، حدث خطأ أثناء رفع الملف.";
            }
        }
    } elseif ($option == "option2" && isset($_FILES["inf2"])) {
        $targetFile = $targetDir . basename($_FILES["inf2"]["name"]);
        $imageFileType = strtolower(pathinfo($targetFile, PATHINFO_EXTENSION));

        if ($_FILES["inf2"]["size"] > 2000000) {
            echo "عذراً، حجم الملف كبير جداً.";
            $uploadOk = 0;
        }

        $check = getimagesize($_FILES["inf2"]["tmp_name"]);
        if ($check === false) {
            echo "الملف ليس صورة.";
            $uploadOk = 0;
        }

        if ($uploadOk == 1) {
            if (move_uploaded_file($_FILES["inf2"]["tmp_name"], $targetFile)) {
                echo "تم رفع الملف ".

Omer Amad · 5 يوليو

بتاريخ 2 ساعة قال محمد عاطف17:

وعليكم السلام ورحمة الله وبركاته.

الأمر يعتمد على ما تريد تنفيذه فإذا أردت أن يوجد 2 inputs للصور ويظهر حقل واحد بناء على إختيار من select فالحل الصحيح كما وضح مصطفي في التعليق السابق .

ولكن ما فهمته أنك تريد إرفاق صورة ووضعها في حقل بناء على إختيار select . ففي هذه الحالة الحل الأفضل هو وضع input واحد وليس إثنين كما فعلت . حيث يتم إرسال الملف من خلال input واحد ولكن في الواجهة الخلفية نقوم بتحديد الحقل في قاعدة البيانات بناء على ما تم إختياره من العنصر select .

وهذا هو ملف الواجهة الأمامية html :

<!DOCTYPE html>
<html lang="ar">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
    <form action="upload.php" method="post" enctype="multipart/form-data">
        <label for="option">من فضلك إختر من التالي:</label>
        <select id="option" name="option">
            <option value="">اختر...</option>
            <option value="inf1">الخيار الأول</option>
            <option value="inf2">الخيار الثاني</option>
        </select>

        <div>
            <label for="image">حقل الصورة:</label>
            <input type="file" name="image" accept="image/*">
        </div>

        <button type="submit">إرسال</button>
    </form>
</body>
</html>

والآن في جزء الواجهة الخلفية ملف upload.php:

<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    $option = $_POST["option"];
    $path = "uploads/";
    if ($option != "inf1" || $option != "inf2") {
        echo "من فضلك إختر خيار صحيح";
        die();
    }
    $targetFile = $path . basename($_FILES["image"]["name"]);
    if ($_FILES["image"]["size"] > 2000000) {
        echo "عذراً، حجم الملف كبير جداً.";
        die();
    }
    // الاتصال بقاعدة البيانات
    $servername = "localhost";
    $username = "root";
    $password = "";
    $dbname = "db_name";

    $conn = new mysqli($servername, $username, $password, $dbname);

    if ($conn->connect_error) {
        die("فشل الاتصال: " . $conn->connect_error);
    }

   
    if (move_uploaded_file($_FILES["image"]["tmp_name"], $targetFile)) {
        $sql = "INSERT INTO table_name ($option) VALUES ('$targetFile')";

        if ($conn->query($sql) === TRUE) {
            echo "تم رفع الملف بنجاح";
        } else {
            echo "عذراً، حدث خطأ أثناء رفع الملف.";
            die();
        }
        $conn->close();
    } else {
        echo "عذراً، حدث خطأ أثناء رفع الملف.";
    }
}

استاذ فيه عندي لكل عامود ملف خاص اضع فيها الصور...

مثلاً

inf1 تذهب الصور الى مجلد اسمه img

inf2 تذهب إلى مجلد اسمه img2 كيف ممكن نعمل هذه العمليه

محمد عاطف17 · 6 يوليو

بتاريخ 10 ساعة قال Mohammed Maree:

استاذ فيه عندي لكل عامود ملف خاص اضع فيها الصور...

مثلاً

inf1 تذهب الصور الى مجلد اسمه img

inf2 تذهب إلى مجلد اسمه img2 كيف ممكن نعمل هذه العمليه

الأمر بسيط وهو كتابة شرط لإسم المسار هكذا :

<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    $option = $_POST["option"];
    if ($option != "inf1" || $option != "inf2") {
        echo "من فضلك إختر خيار صحيح";
        die();
    }
    $path = ($option == "inf1") ? "img/" : "img2/" ;
    $targetFile = $path . basename($_FILES["image"]["name"]);
    if ($_FILES["image"]["size"] > 2000000) {
        echo "عذراً، حجم الملف كبير جداً.";
        die();
    }
    // الاتصال بقاعدة البيانات
    $servername = "localhost";
    $username = "root";
    $password = "";
    $dbname = "db_name";

    $conn = new mysqli($servername, $username, $password, $dbname);

    if ($conn->connect_error) {
        die("فشل الاتصال: " . $conn->connect_error);
    }

   
    if (move_uploaded_file($_FILES["image"]["tmp_name"], $targetFile)) {
        $sql = "INSERT INTO table_name ($option) VALUES ('$targetFile')";

        if ($conn->query($sql) === TRUE) {
            echo "تم رفع الملف بنجاح";
        } else {
            echo "عذراً، حدث خطأ أثناء رفع الملف.";
            die();
        }
        $conn->close();
    } else {
        echo "عذراً، حدث خطأ أثناء رفع الملف.";
    }
}

وهذا السطر هو ما سيقوم بتنفيذ المهمة

$path = ($option == "inf1") ? "img/" : "img2/" ;

لاحظ هنا قمنا بإنشاء متغير يسمى path وهو خاص بمسار الصور وقمنا بالمقارنة مع المتغير option وهو الذي تم إرساله في ال form و إذا وجدنا أنه يطابق inf1 إذا سنقوم بجعل المسار هو img لرفع الصور فيه وحفظه في قاعدة البيانات أم غير ذلك سيتم وضعه في مجلد img2 .

Omer Amad · 6 يوليو

بتاريخ 4 دقائق مضت قال محمد عاطف17:

الأمر بسيط وهو كتابة شرط لإسم المسار هكذا :

<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    $option = $_POST["option"];
    if ($option != "inf1" || $option != "inf2") {
        echo "من فضلك إختر خيار صحيح";
        die();
    }
    $path = ($option == "inf1") ? "img/" : "img2/" ;
    $targetFile = $path . basename($_FILES["image"]["name"]);
    if ($_FILES["image"]["size"] > 2000000) {
        echo "عذراً، حجم الملف كبير جداً.";
        die();
    }
    // الاتصال بقاعدة البيانات
    $servername = "localhost";
    $username = "root";
    $password = "";
    $dbname = "db_name";

    $conn = new mysqli($servername, $username, $password, $dbname);

    if ($conn->connect_error) {
        die("فشل الاتصال: " . $conn->connect_error);
    }

   
    if (move_uploaded_file($_FILES["image"]["tmp_name"], $targetFile)) {
        $sql = "INSERT INTO table_name ($option) VALUES ('$targetFile')";

        if ($conn->query($sql) === TRUE) {
            echo "تم رفع الملف بنجاح";
        } else {
            echo "عذراً، حدث خطأ أثناء رفع الملف.";
            die();
        }
        $conn->close();
    } else {
        echo "عذراً، حدث خطأ أثناء رفع الملف.";
    }
}

وهذا السطر هو ما سيقوم بتنفيذ المهمة

$path = ($option == "inf1") ? "img/" : "img2/" ;

لاحظ هنا قمنا بإنشاء متغير يسمى path وهو خاص بمسار الصور وقمنا بالمقارنة مع المتغير option وهو الذي تم إرساله في ال form و إذا وجدنا أنه يطابق inf1 إذا سنقوم بجعل المسار هو img لرفع الصور فيه وحفظه في قاعدة البيانات أم غير ذلك سيتم وضعه في مجلد img2 .

فيه مشكله في الأقواس لما اضيف خيار ثالث وحقل صور ثالث

كيفية إظهار حقل إدخال حسب الخيار المحدد في قائمة select ومعالجة الملفات المرفوعة في PHP

السؤال

Omer Amad

6 أجوبة على هذا السؤال

Recommended Posts

Mustafa Suleiman

محمد عاطف17

Omer Amad

Omer Amad

محمد عاطف17

Omer Amad

انضم إلى النقاش

إعلانات

تابعنا على

الرئيسية

تابعنا

دروس ومقالات

أسئلة وأجوبة

كتب

دورات

بطاقات هدية