Ajax Select Box
Merhaba,
Html olarak oluşturduğum bir formum var.
Bu forma ajax yardımıyla verileri çekiyorum.
Ancak select boxa konusunda sorun yaşıyorum. Select box'ın veritabanından gelen bilgiye göre seçili olmasını istiyorum.
Veritabanında 1 yazıyorsa, 1 optionı seçili olarak gelsin istiyorum.
Nasıl yapabilirim?
Soru hatalı mı? 👎
Eğer sorunun kurallara aykırı olduğunu düşünüyorsanız lütfen bize bildirin!
Cevaplar (22)
json formatında alıyorsa json.php de o işlemi php ile yapabilir niye zorluyorki
'durum' => $row["durum"] == "Aktif" ?
'<a href="?habertpasif='.$row["id"].'"><span class="badge btn btn-outline-success">Aktif</span></a>' :
'<a href="?habertaktif='.$row["id"].'"><span class="badge btn btn-outline-danger">Pasif</span></a>',
bende json formatında alıyorum :)
php tarafında kolayca yapılıyor hadi direk tarafada söylim
render: function(data, type, full, meta) {
var status = {
"Aktif": {'title': 'Aktif', 'class': 'kt-badge--brand'},
"Pasif": {'title': 'Pasif', 'class': ' kt-badge--danger'},
};
if (typeof status[data] === 'undefined') {
return data;
}
return '<span class="kt-badge ' + status[data].class + ' kt-badge--inline kt-badge--pill">' + status[data].title + '</span>';
}
js tarafındada böyle kullanıyorum.
2 türlüde sorunsuz çalışıyor neyse o geliyor.
kendim fikrim json tarafında halletmek daha az yorucu oluyor javascript keşke hiç doğmasaydı :=))))
$("#duz_sira").val(response.sira);
$("#duz_durum").change(function () {
document.getElementById("#duz_durum").innerHTML=$("#duz_durum option:selected").text(response.durum);
});
$("#id").val(id);
Bu şekilde ekrana yazdırdım ama sadece aktif olarak yazıyor, herhangi bir değer atamadım üstelik. Console'da durumun değeri olarak pasif yazmasına rağmen selectde aktif yazıyor :/
id:98,type:marka
key:durum,value:aktif
key:sira,value:3
Console sonucum, maalesef yine çalışmadı. Sizi de çok yordum, kusura bakmayın lütfen. Sorunumun sadece bir ifle çözüleceğini düşünüyorum ama nasıl olacağını bilmiyorum, bulamıyorum da.
Çünkü veri modala geliyor, görüyorum console dan. Sadece selectdeki optina selected özelliği gelmiyor. Phpdeki gibi basit bir ifle çözülürmüş gibi geliyor ama denedim, olmadı.
val kullanımını anlayınca soruyu yanlış anladığımı fark ettim 0 ile 1i örnek varsayım sandım. bu sorunu çözecektir.
$responseArray["durum"] = str_replace(array(0, 1), array(pasif, aktif), $result[0]["durum"]);
not: önceki cevabımda buton tepki vermedi birkaç saniye arayla tekrarladım göndere basmayı. konuyu amma şişirdik düzenle yok diye
<select class="form-control" name="duz_durum" required>
<option>Durum Seçiniz</option>
<option value="aktif">Aktif</option>
<option value="pasif">Pasif</option>
</select>
galiba aldığın değerler "aktif" ve "pasif" değil sanırım. çünkü val kullanımın dükümantasyonuna baktım dönen değerin idnin verildiği selecteki optionlardan herhangi biriyle uyuşması durumunda id altındaki opsiyonlar seçiliyor
örnek kullanım
<select id="single">
<option>Single</option>
<option>Single2</option>
</select>
<script>
$( "#single" ).val( "Single2" );
</script>
<select class="form-control" name="duz_durum" required>
<option>Durum Seçiniz</option>
<option value="aktif">Aktif</option>
<option value="pasif">Pasif</option>
</select>
galiba aldığın değerler "aktif" ve "pasif" değil sanırım. çünkü val kullanımın dükümantasyonuna baktım dönen değerin idnin verildiği selecteki optionlardan herhangi biriyle uyuşması durumunda id altındaki opsiyonlar seçiliyor
örnek kullanım
<select id="single">
<option>Single</option>
<option>Single2</option>
</select>
<script>
$( "#single" ).val( "Single2" );
</script>
<select class="form-control" name="duz_durum" required>
<option>Durum Seçiniz</option>
<option value="aktif">Aktif</option>
<option value="pasif">Pasif</option>
</select>
galiba aldığın değerler "aktif" ve "pasif" değil sanırım. çünkü val kullanımın dükümantasyonuna baktım dönen değerin idnin verildiği selecteki optionlardan herhangi biriyle uyuşması durumunda id altındaki opsiyonlar seçiliyor
örnek kullanım
<select id="single">
<option>Single</option>
<option>Single2</option>
</select>
<script>
$( "#single" ).val( "Single2" );
</script>
<select class="form-control" name="duz_durum" required>
<option>Durum Seçiniz</option>
<option value="aktif">Aktif</option>
<option value="pasif">Pasif</option>
</select>
galiba aldığın değerler "aktif" ve "pasif" değil sanırım. çünkü val kullanımın dükümantasyonuna baktım dönen değerin idnin verildiği selecteki optionlardan herhangi biriyle uyuşması durumunda id altındaki opsiyonlar seçiliyor
örnek kullanım
<select id="single">
<option>Single</option>
<option>Single2</option>
</select>
<script>
$( "#single" ).val( "Single2" );
</script>
Altalta üçüncü mesaj olacak, kusura bakmayın ama düzenle butonu çalışmıyor sanırım sayfada.
Benim veriyi çekmede bir sorunum yok aslında. Console da görüyorum, veri sayfaya geliyor. Sadece phpdeki gibi bir şart ile selected işlemi vermem lazım selectime ama nasıl yapacağımı bilmiyorum. Kaç konu okudum bununla alakalı ama bulamadım. Belki de ben bulamıyorum.
burada javascripte ihtiyac yok. çok basit
<select name='Durum'>
<option value='1'> Aktif (yada 1)</option>
<option value='0'> Pasif (yada 0)</option>
</select>
Şimdi sen Durum db içinde 1 ise Aktif seçili görünsün istiyorsun. Aşağıya dikkat.
<select name='Durum'>
<option value='1' <?php if ($row['Durum']==1) { echo = 'Selected/';}?>> Aktif (yada 1)</option>
<option value='0' <?php if ($row['Durum']==0) { echo = 'Selected/';}?>> Pasif (yada 0)</option>
</select>
Üstteki kodlarda php tagları arasında Durum'un db deki değeri kontrol ediliyor o satırdaki value ile (== sağına yazdığın değer) eşitse selected değerini oluşturuyor. Sen görmüyorsun ama o sayede o satır seç
liyor.
VArsa anlaşılmayan bir tarafı yaz lütfen. Bende zamanında burada biraz takılmıştım biliyorum bu durumu.
Kusura bakmayın, düşünemedim. Kodlarım aşağıdaki gibidir.
index.php:
<div class="modal fade duzenle" id="edit-modal">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title pl-3" id="exampleModalScrollableTitle">Markayı Düzenle</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true" class="text-white">×</span>
</button>
</div>
<form method="post" id="frmedit" enctype="multipart/form-data">
<div class="modal-body pre-scrollable">
<input type="hidden" name="id" id="id" class="form-control">
<div class="form-group form-float mt-3">
<div class="form-line">
<input type="text" class="form-control" id="duz_sira" name="duz_sira" required>
<label class="form-label">Sıra</label>
</div>
</div>
<select class="form-control" name="duz_durum" required>
<option>Durum Seçiniz</option>
<option value="aktif">Aktif</option>
<option value="pasif">Pasif</option>
</select>
</div>
<div class="modal-footer">
<button type="button" class="btn bg-grey waves-effect iptal-butonu" data-dismiss="modal">İptal</button>
<input type="submit" id="update" class="btn bg-purple waves-effect kaydet-butonu" value="Kaydet">
</div>
</form>
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function () {
/********************** MODAL AÇMA **********************/
$(document).on('click' , '.bn-edit' ,function(){
var id = this.id;
console.log("id:"+id+",type:marka");
$.ajax({
type: "GET",
url: "read.php?id="+id+"&type=marka",
success:function(response){
$("#edit-modal").modal('show');
$.each(response, function(key, value) {
console.log("key:"+key+",value:"+value);
})
$("#duz_sira").val(response.sira);
$("#duz_durum").val(response.durum);
$("#id").val(id);
}
});
});
});
</script>
read.php:
case "marka":
if(isset($_REQUEST["id"])){
$result = $mk_db->oku("marka", " id='$id' ", "", "", "");
if(!empty($result)) {
$responseArray["marka_adi"] = $result[0]["marka_adi"];
$responseArray["resim"] = $result[0]["resim"];
$responseArray["durum"] = $result[0]["durum"];
$responseArray["sira"] = $result[0]["sira"];
echo json_encode($responseArray);
}
}
break;