Jquery Ajax Data Gönderim Sorunu
Herkese iyi çalışmalar arkadaşlar şöyle bir sorunum var
Aşağıdaki kod ile resim post ediyorum ve resim yüklemesi yapıyorum fakat bunu yapabilmek için ayrı bir php dosyası oluşturmam gerekiyor normalde
data: {set_image:set_image} şeklinde post gönderebiliyordum fakat aşağıdaki resim gönderme metodu yüzünden post gönderemiyorum sadece $_FILES gidiyor umarım anlatabilmişimdir. Nasıl FILES gönderirken bide POST gönderebilirim
url: "inc/inc.php",
dataType: 'script',
cache: false,
contentType: false,
processData: false,
data: form_data,
type: 'post',
Normaldeki gönderim şeklim:
var set_logo="set_logo";
url: "inc/inc.php",
data: {form_data:form_data,set_logo:set_logo,token:token},
type: 'post',
Bunları ajax ile gönderiyorum dostlar yani istediğim aşağıdaki metodun çalışması aynı anda hem reism yollayıp hem post göndermek
set_logo isminde boş bir post yolluyup onu php dosyamda yakalıyorum ama en üstteki kod ile gönderince yakalayacak bir şey olmuyor
Soru hatalı mı? 👎
Eğer sorunun kurallara aykırı olduğunu düşünüyorsanız lütfen bize bildirin!
Cevaplar (10)
Tetikleme butonunu form un içine koymanızı tavsiye ederim. Button üzerinden değil de inputlara daha kolay ulaşabilmek için form üzerinden gitmeyi tercih ediyorum.
<form id="form" enctype="multipart/form-data">
<div class="card">
<div class="card-body">
<div class="row mt-2" style="justify-content: center;">
<div class="col-12 col-md-1">
<label class="form-label mt-1">Site Logo</label>
</div>
<div class="col-12 col-md-1">
<img src="../<?= $settingrow['setting_logo'] ?>" class="img-fluid mt-1 setting_uploaded_logo">
</div>
<div class="col-6 col-md-1">
<input type="text" class="form-control" name="setting_logo_width" value="<?= $settingrow['setting_logo_width'] ?>">
</div>
<div class="col-6 col-md-3">
<input type="file" class="form-control" name="setting_logo">
</div>
<div class="col-12 col-md-1">
<button class="btn btn-success">Gönder</button>
</div>
</div>
</div>
</div>
</form>
$("#form").on("submit", function (event) {
event.preventDefault()
let fd = new FormData()
$(this).find("input").each(function () {
let type = $(this).attr("type"),
name = $(this).attr("name")
if (type === 'file') {
if (this.files[0] !== undefined)
fd.append(name, this.files[0])
}
else
fd.append(name, $(this).val())
})
$.ajax('inc/inc.php', {
method: 'POST',
data: fd,
contentType: false,
processData: false
})
})
php tarafında $_FILES[] ve $_POST[] şeklinde inputların name değerleri ile yakalayacaksınız.
Form'un en sonunda buton'a id tanımladım ona basınca tetikliyor hocam teşekkürler o kısımları ben hallederim
Hocam normalde id ile çekiyordum name ile denedim o şekilde kalmış
<form id="form" enctype="multipart/form-data">
<div class="card">
<div class="card-body">
<div class="row mt-2" style="justify-content: center;">
<div class="col-md-1">
<label class="form-label mt-1">Site Logo</label>
</div>
<div class="col-md-1">
<img src="../<?php echo $settingrow['setting_logo'] ?>" class="img-fluid mt-1 setting_uploaded_logo">
</div>
<div class="col-md-1">
<input type="text" class="form-control" name="setting_logo_width" value="<?php echo $settingrow['setting_logo_width'] ?>">
</div>
<div class="col-md-3">
<input type="file" class="form-control" name="setting_logo">
</div>
</div>
</div>
</div>
</form>
Şimdiden çok teşekkür ederim
var file_data = $('#setting_logo').prop('files')[0];
var form_data = new FormData();
form_data.append('file', file_data);
$.ajax({
url: "inc/inc-logo.php",
dataType: 'script',
cache: false,
contentType: false,
processData: false,
data: form_data,
type: 'post',
success: function(e) {
if (e=="no2")
{
}
else if (e!="no") {
$(".setting_uploaded_logo").attr('src', '../'+e);
toastr['success']('Logo Başarıyla Güncellendi!');
}
else if (e=="no")
{
toastr['error']('Logo Güncellenemedi!');
}
},
error: function(e) {
toastr['error']('Logo Güncellenemedi!');
}
});
PHP Tarafı:
if (isset($_POST))
{
if ($_FILES['file']['size']>0)
{
$last_logo=$settingrow['setting_favicon'];
unlink("../../$last_logo");
$authorized=array('jpg','png','jpeg');
$ext=strtolower(substr($_FILES['file']["name"],strpos($_FILES['file']["name"],'.')+1));
if (in_array($ext, $authorized) === false)
{
echo "no";
exit;
}
$uploads_dir = '../../img';
@$tmp_name = $_FILES['file']["tmp_name"];
@$name = $_FILES['file']["name"];
$rand=uniqid();
$image_src=substr($uploads_dir, 6)."/".$rand.$name;
@move_uploaded_file($tmp_name, "$uploads_dir/$rand$name");
$updatephoto=$db->prepare("UPDATE setting set setting_favicon=:setting_favicon where setting_id=:setting_id");
$check=$updatephoto->execute(array(
'setting_favicon' => $image_src,
'setting_id' => 1
));
if ($check)
{
echo $image_src;
exit;
}
else
{
echo "no";
exit;
}
}
else
{
echo "no2";
exit;
}
}
Teşekkür ederim cevap için deneyeceğim
Edit: Formdata'ya append yaptım bu seferde name gidiyor fakat value değeri boş gidiyor
FormData ya diğer input değerlerini de append etmeyi denedin mi. Teorik olarak açıklayayım, bir form on click submit olduğu zaman bu formun içinde bulunan inputları, varsa textareaları each ile dön, bu elemanların name attribute larını key olarak kullanıp oluşturduğun FormData ya resimlerle birlikte append et. Kod yazamıyorum şu an umarım anlatabilmişimdir