Jquery ve PHP Kullanarak Ajax ile Dinamik Select Örneği Oluşturmak

Bir select kutusu içerisindeki optionları ajax ile alıp yüklemek için yapmamız gerekenler.

Jquery ve PHP Kullanarak Ajax ile Dinamik Select Örneği Oluşturmak

Jquery $.ajax fonksiyonu ile çağıracağımız PHP dosyamız

unset($Dizi);
$Departmanlar = mysql_query("SELECT * FROM urunler_departmanlar");
    while ($Dp = mysql_fetch_object($Departmanlar)) {
         $Dizi.='<option value="'.$Dp->no.'">'.$Dp->ad.'';
    }
echo $Dizi;

 

Dinamik olarak select kutusu içerisini güncelleyecek javascript kodumuz

            $.ajax({
                type: "GET",
                url: "urunler_departman_marka_model_ekle_.php",
                data: { departman_islem: EkleMiGuncelleMi, departman_no: DepartmanNo },
                dataType: "html",
                cache: false,
                success: function (DonenVeri) {
                    $('[name=departmanlar]').find('option').remove();
                    $('[name=departmanlar]').html(DonenVeri);
       
                }
            }).done(function() {
            });

 

Html Kodlar

<select name="departmanlar" size="15" style="width:180px" Onchange="DepartmanSecim(this)"></select>

 

Jaquery İle Dinamik Option Oluşturmak

<script>
        $(document).ready(function() {
            // Şehirler dizisi
            var cities = ["İstanbul", "Ankara", "İzmir", "Bursa", "Antalya"];

            // Döngü ile her şehir için option oluşturup select'e ekle
            $.each(cities, function(index, city) {
                $('#cities').append($('<option>', {
                    value: city, // Option value'su
                    text: city   // Option metni
                }));
            });
        });
    </script>

   

Çift Boyutlu Dizi

$Firmalar = $FN->GemiSahipleriListesi($Parametreler);
unset($Dizi);
foreach($Firmalar as $Firma){
    $Dizi[]= array($Firma->Id, $Firma->CompanyName);
}
$FirmaOptions = json_encode($Dizi);
echo
$FirmaOptions;

   

<script type="text/javascript">
    <
        const Firmalar = {GemiFirmalari};

        $(document).ready(function () {

            $.each(Firmalar, function(index, Firma) {
                $("#Bir, #Iki, #Uc").append($('<option>', {
                    value: Firma[0], // Option value'su
                    text: Firma[1]   // Option metni
                }));
            });
        });
    //>
</script>

 

 

Yorumunuzu Ekleyin


Yükleniyor...
Yükleniyor...