Php Çoklu dosya yüklemeyi nasıl yapabilirim
19
●460
- 29-12-2022, 01:51:57Şimdi bu tarz meseleleri adım adım çözmelisiniz.
örneğin;
if(isset($_FILES['dosya'])) { // şuraya echo '<pre>'; print_r($_POST);Ekrana gelen çıktıyı ekran görüntüsü olarak gönderin - 29-12-2022, 02:50:20Postun boş gelme ihtimali yok size DM göndermiştim. Buradan mı devam edelim? O sayfayı direk çalıştırmak değilde, formu gönderip sonucu çekerseniz daha iyi olacak
- 29-12-2022, 02:53:08Buradan devam edelim. Formu gönderdim ama içine ne yazacağım onu bilemedim.
- 29-12-2022, 03:08:31
Yapmak istediğim şu: Diyelim ki 3 adet resim seçtim. Bu resimleri hem "resimler" klasörüne atacağım hem de veritabanına üçünü birden kaydedeceğim. İnternetten farklı kodlara baktım ve şu şekilde geliştirdim kodları. Bir buton koyacağım form sayfasına. Butona tıklayınca 1. resimdeki gibi alanları ekleyecek.
Sonra gelelim "islem.php" sayfasına. Kodları geliştirdiğim şekilde kayıt yapabiliyorum. Ama hepsi "array" olarak kaydediyor. Bir de şu "values" kısmındaki kodlada şu hataları alıyorum. Buradan ilerlersek galiba daha kolay gidebiliriz. Çünkü kayıt yapabildim şu an. Kodlar aşağıda.
Hata: "Notice: Array to string conversion in"
form.php
<div class="container-fluid"> <div class="row sayfayukseklik"> <div class="col col-2 bg-warning"> <?php include "yanmenu.php"; ?> </div> <div class="col col-10 bg-info"> <form action="indexsayfaencoksatilanurunislem.php" method="POST" enctype="multipart/form-data"> <div class="col w-25 mx-auto bg-success p-1 text-white mt-3 px-3 text-center"> <div class="col"> Resim Seç </div> </div> <div class="row"> <input class="col mx-auto mt-3 form-control indexsayfa_urunekle_urunadi" type="file" name="dosya[]" value="Resim Yükle" id="dosya" multiple required> <div class="col mx-auto p-1 text-white mt-3 text-center"> <input class="col w-100 text-center" type="text" name="indexsayfa_encoksatilan_urunadi[]" maxlength="50" placeholder="Ürün Adı Giriniz" required> </div> <div class="col mx-auto mt-3 pt-1 pe-1 ps-1"> <textarea id="kodekle" class="w-100 text-center" name="indexsayfa_encoksatilan_urunozellikleri[]" placeholder="Ürün Özellik Giriniz" required></textarea> </div> <div class="col mx-auto mt-3 pt-1 pb-1 pe-1 ps-1"> <select class="w-100 mx-auto text-center indexsayfa_urunekle_select" name="indexsayfa_encoksatilan_urunkategori[]" required> <option value=""> Kategori Seçiniz </option> <option name="sporcuurunleri" value="Sporcu"> Sporcu Ürünleri </option> <option name="takviyegidalar" value="Takviye"> Takviye Edici Gıdalar </option> <option name="aloebakimserisi" value="Aşağı Kilo"> Aşağı Kilo Kontrolü </option> <option name="asagi_kilo" value="Yukarı Kilo"> Yukarı Kilo Kontrolü </option> <option name="yukari_kilo" value="İçecekler"> İçecekler </option> <option name="icecekler" value="Skin Serisi"> Skin Serisi </option> <option name="skin_serisi" value="Aloe Bakım"> Aloe Bakım Serisi </option> <option name="bakim_serisi" value="Atıştırmalıklar"> Atıştırmalıklar </option> </select> </div> <div class="col mx-auto p-1 text-white mt-3 text-center"> <input class="col w-100 text-center indexsayfa_urunekle_eskifiyat" type="text" name="indexsayfa_encoksatilan_eskifiyat[]" maxlength="50" placeholder="Eski Fiyat Giriniz" required> </div> <div class="col mx-auto p-1 text-white mt-3 text-center"> <input class="col w-100 text-center indexsayfa_urunekle_yenifiyat" type="text" name="indexsayfa_encoksatilan_yenifiyat[]" maxlength="50" placeholder="Yeni Fiyat Giriniz" required> </div> <div class="col mx-auto p-1 text-white mt-3 text-center"> <input class="col w-100 text-center indexsayfa_urunekle_indirimlifiyat" type="text" name="indexsayfa_encoksatilan_indirimlifiyat[]" maxlength="50" placeholder="İndirimli Fiyat Giriniz" required> </div> </div> /* Yukarıdaki ile aşağıdaki aynı */ <div class="row"> <input class="col mx-auto mt-3 form-control indexsayfa_urunekle_urunadi" type="file" name="dosya[]" value="Resim Yükle" id="dosya" multiple required> <div class="col mx-auto p-1 text-white mt-3 text-center"> <input class="col w-100 text-center" type="text" name="indexsayfa_encoksatilan_urunadi[]" maxlength="50" placeholder="Ürün Adı Giriniz" required> </div> <div class="col mx-auto mt-3 pt-1 pe-1 ps-1"> <textarea id="kodekle" class="w-100 text-center" name="indexsayfa_encoksatilan_urunozellikleri[]" placeholder="Ürün Özellik Giriniz" required></textarea> </div> <div class="col mx-auto mt-3 pt-1 pb-1 pe-1 ps-1"> <select class="w-100 mx-auto text-center indexsayfa_urunekle_select" name="indexsayfa_encoksatilan_urunkategori[]" required> <option value=""> Kategori Seçiniz </option> <option name="sporcuurunleri" value="Sporcu"> Sporcu Ürünleri </option> <option name="takviyegidalar" value="Takviye"> Takviye Edici Gıdalar </option> <option name="aloebakimserisi" value="Aşağı Kilo"> Aşağı Kilo Kontrolü </option> <option name="asagi_kilo" value="Yukarı Kilo"> Yukarı Kilo Kontrolü </option> <option name="yukari_kilo" value="İçecekler"> İçecekler </option> <option name="icecekler" value="Skin Serisi"> Skin Serisi </option> <option name="skin_serisi" value="Aloe Bakım"> Aloe Bakım Serisi </option> <option name="bakim_serisi" value="Atıştırmalıklar"> Atıştırmalıklar </option> </select> </div> <div class="col mx-auto p-1 text-white mt-3 text-center"> <input class="col w-100 text-center indexsayfa_urunekle_eskifiyat" type="text" name="indexsayfa_encoksatilan_eskifiyat[]" maxlength="50" placeholder="Eski Fiyat Giriniz" required> </div> <div class="col mx-auto p-1 text-white mt-3 text-center"> <input class="col w-100 text-center indexsayfa_urunekle_yenifiyat" type="text" name="indexsayfa_encoksatilan_yenifiyat[]" maxlength="50" placeholder="Yeni Fiyat Giriniz" required> </div> <div class="col mx-auto p-1 text-white mt-3 text-center"> <input class="col w-100 text-center indexsayfa_urunekle_indirimlifiyat" type="text" name="indexsayfa_encoksatilan_indirimlifiyat[]" maxlength="50" placeholder="İndirimli Fiyat Giriniz" required> </div> </div> <input type="submit" class="btn d-grid btn-success mx-auto mt-3" value="Ürünü Kaydet"> </form> </div> </div> </div>islem.php
<?php if(isset($_FILES['dosya'])) { $indexsayfa_encoksatilan_urunadi = $_POST["indexsayfa_encoksatilan_urunadi"]; $indexsayfa_encoksatilan_urunozellikleri = $_POST["indexsayfa_encoksatilan_urunozellikleri"]; $indexsayfa_encoksatilan_kategori = $_POST["indexsayfa_encoksatilan_urunkategori"]; $indexsayfa_encoksatilan_eskifiyat = $_POST["indexsayfa_encoksatilan_eskifiyat"]; $indexsayfa_encoksatilan_yenifiyat = $_POST["indexsayfa_encoksatilan_yenifiyat"]; $indexsayfa_encoksatilan_indirimlifiyat = $_POST["indexsayfa_encoksatilan_indirimlifiyat"]; $resimsay = count($_FILES['dosya']["name"]); for($i=0; $i<$resimsay; $i++) { $dosya_adi = $_FILES['dosya']["name"][$i]; $gecici_yol = $_FILES['dosya']["tmp_name"][$i]; $hedefklasor = "../../images/indexsayfaencoksatilanurun/".$dosya_adi; if(move_uploaded_file($gecici_yol, $hedefklasor)) { $query = "INSERT INTO indexsayfaencoksatilanurun (indexsayfa_encoksatilanurun_resim, indexsayfa_encoksatilanurun_urunadi, indexsayfa_encoksatilanurun_urunozellikleri, indexsayfa_encoksatilanurun_kategori, indexsayfa_encoksatilanurun_eskifiyat, indexsayfa_encoksatilanurun_yenifiyat, indexsayfa_encoksatilan_indirimlifiyat) VALUES('$dosya_adi', '$indexsayfa_encoksatilan_urunadi', '$indexsayfa_encoksatilan_urunozellikleri', '$indexsayfa_encoksatilan_kategori', '$indexsayfa_encoksatilan_eskifiyat', '$indexsayfa_encoksatilan_yenifiyat', '$indexsayfa_encoksatilan_indirimlifiyat')"; } } if (mysqli_query($db, $query) === TRUE) { echo '<div style="margin-top:25px; text-align:center; font-size:35px;"> Kayıt Başarıyla Gerçekleştirildi</div>'; // header("refresh:2; url=indexsayfaencoksatilanurun.php"); } else { echo '<div style="margin-top:25px; text-align:center; font-size:35px;"> Kayıt Başarısız. <br> Geldiğiniz Sayfaya Yönlendiriliyorsunuz.</div>'; // header("refresh:5; url=indexsayfaencoksatilanurun.php"); } } ?> - 29-12-2022, 03:29:22css e takılmayın. düzenlemesin sonradan yapacağım. Biraz dağınık ve kötü gözüküyor şu an. bootstrap 5 kullanıyorum ama tasarımı bu şekle soktum şimdilik.
- 29-12-2022, 04:43:05Şimdi sıradan gideceğiz.
Size söyleyeceğim adımları sırasıyla uygulayın.
Güncelleyeceğim bu iletiyi.
Sona geldiğimde en başa bitti ifadesi ekleyeceğim.
Zaten dosya isimleriniz, tablo adı ve sütunlarınız yeterince yorucu.
Öncelikle ürün ile alakalı olan satırı bir template metin olarak düşünelim.
Alıntı
Alıntı<!-- Head bölgesi --> <link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.css"> <style type="text/css"> #files{padding:15px} .fotoKutu{border:1px dashed #000;padding:15px;display:flex;flex-direction:column;justify-content:center;text-align:center} .fotoKutu h3{margin:0} .fotoKutu span{opacity:.5} .col-img .progress-bar{position:absolute;left:0;bottom:0;z-index:1;height:3px;background-color:green;width:0} .col-img{width:100px;height:100px;position:relative} .col-img img{width:100px;height:100px;border-radius:3px;object-fit:cover} </style> <!-- En alta --> <script src="https://code.jquery.com/jquery-1.11.3.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script> <script src="upload.js"></script>Alıntı<script id="uruntpl" type="text/template"> <div class="row" id="{{id}}"> <div class="col col-img"><img src="{{src}}"><div class="progress-bar"></div></div> <div class="col mx-auto p-1 text-white mt-3 text-center"> <input class="col w-100 text-center" type="text" name="indexsayfa_encoksatilan_urunadi[]" maxlength="50" placeholder="Ürün Adı Giriniz" required /> </div> <div class="col mx-auto mt-3 pt-1 pe-1 ps-1"> <textarea id="kodekle" class="w-100 text-center" name="indexsayfa_encoksatilan_urunozellikleri[]" placeholder="Ürün Özellik Giriniz" required></textarea> </div> <div class="col mx-auto mt-3 pt-1 pb-1 pe-1 ps-1"> <select class="w-100 mx-auto text-center indexsayfa_urunekle_select" name="indexsayfa_encoksatilan_urunkategori[]" required> <option value="">Kategori Seçiniz</option> <?php foreach ($category as $key => $value) { echo '<option value="' . $key . '">' . $value . '</option>'; } ?> </select> </div> <div class="col mx-auto p-1 text-white mt-3 text-center"> <input class="col w-100 text-center indexsayfa_urunekle_eskifiyat" type="text" name="indexsayfa_encoksatilan_eskifiyat[]" maxlength="50" placeholder="Eski Fiyat Giriniz" required /> </div> <div class="col mx-auto p-1 text-white mt-3 text-center"> <input class="col w-100 text-center indexsayfa_urunekle_yenifiyat" type="text" name="indexsayfa_encoksatilan_yenifiyat[]" maxlength="50" placeholder="Yeni Fiyat Giriniz" required /> </div> <div class="col mx-auto p-1 text-white mt-3 text-center"> <input class="col w-100 text-center indexsayfa_urunekle_indirimlifiyat" type="text" name="indexsayfa_encoksatilan_indirimlifiyat[]" maxlength="50" placeholder="İndirimli Fiyat Giriniz" required /> </div> </div> </script>Alıntı<?php $category = array( 'Sporcu' => 'Sporcu Ürünleri', 'Takviye' => 'Takviye Edici Gıdalar', 'Aşağı Kilo' => 'Aşağı Kilo Kontrolü', 'Yukarı Kilo' => 'Yukarı Kilo Kontrolü', 'İçecekler' => 'İçecekler', 'Skin Serisi' => 'Skin Serisi', 'Aloe Bakım' => 'Aloe Bakım Serisi', 'Atıştırmalıklar' => 'Atıştırmalıklar' ); include 'uruntpl.php'; ?> <div class="container-fluid"> <div class="row sayfayukseklik"> <div class="col col-2 bg-warning"> <?php include "yanmenu.php"; ?> </div> <div class="col col-10 bg-info"> <form action="indexsayfaencoksatilanurunislem.php" method="POST" enctype="multipart/form-data"> <div class="col w-25 mx-auto bg-success p-1 text-white mt-3 px-3 text-center"> <div class="col"> Resim Seç </div> </div> <div class="row"> <input type="file" id="files-upload" multiple="" style="display:none;"> <div id="files"> <div class="fotoKutu"> <h3>Fotoğrafları bırak yada yüklemek için tıkla</h3> <span>İzin verilen maksimun boyut 3MB</span> </div> </div> </div> <div id="rows"></div> <input type="submit" class="btn d-grid btn-success mx-auto mt-3" value="Ürünü Kaydet"> </form> </div> </div> </div>Alıntı<?php header('Content-type: application/json'); class FileUpload { // Maksimum dosya boyutunu belirtilen birimlerde dönüştürür public function getMaxSize($size) { $units = ['B', 'KB', 'MB', 'GB', 'TB']; for ($i = 0; $size > 1024; $i++) { $size /= 1024; } return round($size, 2) . ' ' . $units[$i]; } // Dosya yükleme işlemini gerçekleştir public function upload($inputName, $uploadPath, $allowedTypes, $maxSize) { // Formdan gelen dosya bilgilerini al $files = $_FILES[$inputName]; // Dosya bilgilerini al $name = $files['name']; $type = $files['type']; $tmpName = $files['tmp_name']; $error = $files['error']; $size = $files['size']; // Dosya yükleme işlemini gerçekleştir if (!in_array($type, $allowedTypes)) { // İzin verilmeyen dosya türü, hata mesajı ver return 'İzin verilmeyen dosya türü.'; } elseif ($size > $maxSize) { // Dosya boyutu çok büyük, hata mesajı ver return 'Dosya ' . $this->getMaxSize($maxSize) . ' den büyük olamaz.'; } elseif (!move_uploaded_file($tmpName, $uploadPath . $name)) { // Dosya yükleme işlemi başarısız, hata mesajı ver return 'Dosya yükleme işlemi başarısız.'; } // Dosya yükleme işlemi başarılı return array('file' => $name); } } // FileUpload sınıfının bir nesnesini oluştur $uploader = new FileUpload(); // İzin verilen dosya türlerini belirt $allowedTypes = ['image/jpeg', 'image/png', 'image/jpg']; // Dosya yükleme işlemini gerçekleştir exit(json_encode($uploader->upload('file', '/', $allowedTypes, 1024 * 1024 * 3)));Alıntılet wild = function(length) { var text = ""; var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789"; for (var i = 0; i < length; i++) text += possible.charAt(Math.floor(Math.random() * possible.length)); return text; } $(function(){ const preventDefaults = function(e) { e.preventDefault(); e.stopPropagation(); }; const highlight = function(e) { files.classList.add("highlight"); }; const unhighlight = function(e) { files.classList.remove("highlight"); }; const handleDrop = function(e) { const dt = e.dataTransfer; const files = dt.files; handleFiles(files); }; const handleFiles = function(files) { files = [...files]; files.forEach(previewFile); }; const previewFile = function(file) { const id = "upload" + wild(6); const reader = new FileReader(); reader.readAsDataURL(file); reader.onloadend = function() { let temp = $("#uruntpl").html(); temp = temp.replace(/{{id}}/ig, id); temp = temp.replace(/{{src}}/ig, reader.result); $("#rows").append(temp); }; uploadFile(file, id); }; const updateProgress = function(id, percent) { $("#" + id).find(".progress-bar").css("width", percent); if (percent === 100) { setTimeout(function(){ $("#" + id).find(".progress-bar").fadeOut(); }, 1000); } }; const uploadFile = function(file, id) { const fd = new FormData(); fd.append("file", file); $.ajax({ url: "upload.php", type: "POST", dataType: "JSON", processData: false, contentType: false, data: fd, timeout: 30000, error: function () { toastr.warning("Sorun oluştu"); }, xhr: function () { const xhr = $.ajaxSettings.xhr(); xhr.onprogress = function e() { if (e.lengthComputable) { updateProgress(id, (e.loaded * 100.0 / e.total) || 100); } }; xhr.upload.onprogress = function (e) { if (e.lengthComputable) { updateProgress(id, (e.loaded * 100.0 / e.total) || 100); } }; return xhr; }, success: function(json){ } }); }; $(".fotoKutu").click(function(){ $("#files-upload").click(); }); $("#files-upload").change(function(){ handleFiles(this.files); }); const files = document.getElementById("files"); ["dragenter", "dragover", "dragleave", "drop"].forEach(eventName => { files.addEventListener(eventName, preventDefaults, false); document.body.addEventListener(eventName, preventDefaults, false); }); ["dragenter", "dragover"].forEach(eventName => { files.addEventListener(eventName, highlight, false); }); ["dragleave", "drop"].forEach(eventName => { files.addEventListener(eventName, unhighlight, false); }); files.addEventListener("drop", handleDrop, false); });
