PHP Dropdown Menü Yardım

26-02-2022, 20:47:48

Merhaba Arkadaşlar
Select optionlardaki uygulamayı, Dropdown Menü üzerinde uygulayamadım, bu konuda yardım edebilirmisiniz. kodlarım aşağıdaki gibi

<div class="btn-group custom-drop">
    <button type="button" class="btn btn-order-by-filt" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Gelişmiş Sıralama <i class="ti-angle-down"></i>
    </button>
    <div class="dropdown-menu pull-right animated flipInX">
        <a href="#">Fiyata Göre Yüksek</a>
        <a href="#">Fiyata Göre Düşük</a>
        <a href="#">En Son Eklenen</a>
    </div>
</div>

<form action="" method="POST" id="OrderSubmit">
    <select name="son" class="sirala" onchange="$('#OrderSubmit').submit();">
        <option value="">Gelişmiş Sıralama</option>
        <option value="fiyatyuk" <?=($deg == 'fiyatyuk') ? "selected" : '';?>>Fiyata Göre Yüksek</option>
        <option value="fiyatdus" <?=($deg == 'fiyatdus') ? "selected" : '';?>>Fiyata Göre Düşük</option>
        <option value="enson" <?=($deg == 'enson') ? "selected" : '';?>>En Son Eklenen</option>
    </select>
</form>

27-02-2022, 21:56:04

#2

emlak21

Arkadaşlar bu konuda yardım edecek yokmu?

28-02-2022, 22:11:04

brown

Developer

select2 kullanabilirsiniz.

örnek:

<html>
<head>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" />
</head>
<body>
    <?php
    if(isset($_POST['dropdown-submit'])){
        echo 'seçilen değer: '.$_POST['dropdown'];
    }
    ?>
    <form method="post" action="#">
        <select class="select2" tabindex="-1" aria-hidden="true" name="dropdown">
            <option>Alabama</option>
            <option selected>Alaska</option>
            <option>California</option>
            <option>Delaware</option>
            <option>Tennessee</option>
            <option>Texas</option>
            <option>Washington</option>
        </select>
    <input type="submit" name="dropdown-submit" value="gönder" />
    </form>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>
    <script>
        $(document).ready(function() {
            $('.select2').select2();
        });
    </script>
</body>
</html>

28-02-2022, 22:53:30

emlak21

brown adlı üyeden alıntı: mesajı görüntüle

select2 kullanabilirsiniz.

örnek:

<html>
<head>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" />
</head>
<body>
    <?php
    if(isset($_POST['dropdown-submit'])){
        echo 'seçilen değer: '.$_POST['dropdown'];
    }
    ?>
    <form method="post" action="#">
        <select class="select2" tabindex="-1" aria-hidden="true" name="dropdown">
            <option>Alabama</option>
            <option selected>Alaska</option>
            <option>California</option>
            <option>Delaware</option>
            <option>Tennessee</option>
            <option>Texas</option>
            <option>Washington</option>
        </select>
    <input type="submit" name="dropdown-submit" value="gönder" />
    </form>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>
    <script>
        $(document).ready(function() {
            $('.select2').select2();
        });
    </script>
</body>
</html>

verdiğim Dropdown Menü ye uyarlama şansımız varmı hocam, yardım edebilirsen çok iyi olur

28-02-2022, 23:32:27

Misafir

emlak21 adlı üyeden alıntı: mesajı görüntüle

Merhaba Arkadaşlar
Select optionlardaki uygulamayı, Dropdown Menü üzerinde uygulayamadım, bu konuda yardım edebilirmisiniz. kodlarım aşağıdaki gibi

<div class="btn-group custom-drop">
    <button type="button" class="btn btn-order-by-filt" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Gelişmiş Sıralama <i class="ti-angle-down"></i>
    </button>
    <div class="dropdown-menu pull-right animated flipInX">
        <a href="#">Fiyata Göre Yüksek</a>
        <a href="#">Fiyata Göre Düşük</a>
        <a href="#">En Son Eklenen</a>
    </div>
</div>

<form action="" method="POST" id="OrderSubmit">
    <select name="son" class="sirala" onchange="$('#OrderSubmit').submit();">
        <option value="">Gelişmiş Sıralama</option>
        <option value="fiyatyuk" <?=($deg == 'fiyatyuk') ? "selected" : '';?>>Fiyata Göre Yüksek</option>
        <option value="fiyatdus" <?=($deg == 'fiyatdus') ? "selected" : '';?>>Fiyata Göre Düşük</option>
        <option value="enson" <?=($deg == 'enson') ? "selected" : '';?>>En Son Eklenen</option>
    </select>
</form>

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>



    <div class="btn-group custom-drop">
        <button type="button" class="btn btn-order-by-filt" data-toggle="dropdown" aria-haspopup="true"
            aria-expanded="false">Gelişmiş Sıralama <i class="ti-angle-down"></i>
        </button>
        <div class="dropdown-menu pull-right animated flipInX">
            <a href="#" class="fiyatyuk pr">Fiyata Göre Yüksek</a>
            <a href="#" class="fiyatdus pr">Fiyata Göre Düşük</a>
            <a href="#" class="enson pr">En Son Eklenen</a>
        </div>
    </div>

    <form action="" method="POST" id="OrderSubmit" style="max-width: 0;overflow: hidden;opacity: 0;">
        <select name="son" class="sirala" onchange="$('#OrderSubmit').submit();">
            <option value="">Gelişmiş Sıralama</option>
            <option value="fiyatyuk" <?=($deg=='fiyatyuk' ) ? "selected" : '' ;?>>Fiyata Göre Yüksek</option>
            <option value="fiyatdus" <?=($deg=='fiyatdus' ) ? "selected" : '' ;?>>Fiyata Göre Düşük</option>
            <option value="enson" <?=($deg=='enson' ) ? "selected" : '' ;?>>En Son Eklenen</option>
        </select>
        <button type="submit" class="go-sbm"></button>
    </form>

    <script>

        document.querySelectorAll('.pr').forEach(el => {
            el.addEventListener('click', (e) => {
                e.preventDefault()
                document.querySelectorAll('.sirala option').forEach(k => {
                    if (el.classList.contains(k.value)) {
                        console.log(el)
                        console.log(k)
                        document.querySelector('.sirala').value = k.value
                        document.querySelector('.go-sbm').click()
                    }
                });
            })
        });
    </script>


</body>

</html>

28-02-2022, 23:42:18

emlak21

Misafir adlı üyeden alıntı: mesajı görüntüle

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>



    <div class="btn-group custom-drop">
        <button type="button" class="btn btn-order-by-filt" data-toggle="dropdown" aria-haspopup="true"
            aria-expanded="false">Gelişmiş Sıralama <i class="ti-angle-down"></i>
        </button>
        <div class="dropdown-menu pull-right animated flipInX">
            <a href="#" class="fiyatyuk pr">Fiyata Göre Yüksek</a>
            <a href="#" class="fiyatdus pr">Fiyata Göre Düşük</a>
            <a href="#" class="enson pr">En Son Eklenen</a>
        </div>
    </div>

    <form action="" method="POST" id="OrderSubmit" style="max-width: 0;overflow: hidden;opacity: 0;">
        <select name="son" class="sirala" onchange="$('#OrderSubmit').submit();">
            <option value="">Gelişmiş Sıralama</option>
            <option value="fiyatyuk" <?=($deg=='fiyatyuk' ) ? "selected" : '' ;?>>Fiyata Göre Yüksek</option>
            <option value="fiyatdus" <?=($deg=='fiyatdus' ) ? "selected" : '' ;?>>Fiyata Göre Düşük</option>
            <option value="enson" <?=($deg=='enson' ) ? "selected" : '' ;?>>En Son Eklenen</option>
        </select>
        <button type="submit" class="go-sbm"></button>
    </form>

    <script>

        document.querySelectorAll('.pr').forEach(el => {
            el.addEventListener('click', (e) => {
                e.preventDefault()
                document.querySelectorAll('.sirala option').forEach(k => {
                    if (el.classList.contains(k.value)) {
                        console.log(el)
                        console.log(k)
                        document.querySelector('.sirala').value = k.value
                        document.querySelector('.go-sbm').click()
                    }
                });
            })
        });
    </script>


</body>

</html>

Hocam aşağıdaki kod yapısına uyarlamak istiyorum

<div class="btn-group custom-drop">
        <button type="button" class="btn btn-order-by-filt" data-toggle="dropdown" aria-haspopup="true"
            aria-expanded="false">Gelişmiş Sıralama <i class="ti-angle-down"></i>
        </button>
        <div class="dropdown-menu pull-right animated flipInX">
            <a href="#">Fiyata Göre Yüksek</a>
            <a href="#">Fiyata Göre Düşük</a>
            <a href="#">En Son Eklenen</a>
        </div>
    </div>

28-02-2022, 23:43:42

Misafir

emlak21 adlı üyeden alıntı: mesajı görüntüle

Hocam aşağıdaki kod yapısına uyarlamak istiyorum

<div class="btn-group custom-drop">
        <button type="button" class="btn btn-order-by-filt" data-toggle="dropdown" aria-haspopup="true"
            aria-expanded="false">Gelişmiş Sıralama <i class="ti-angle-down"></i>
        </button>
        <div class="dropdown-menu pull-right animated flipInX">
            <a href="#">Fiyata Göre Yüksek</a>
            <a href="#">Fiyata Göre Düşük</a>
            <a href="#">En Son Eklenen</a>
        </div>
    </div>

Hocam verilen classları eklemeniz gerekiyor. Sadece birkaç class ekledim. Direkt bu kısmı silip attığım html i kullanabilirsiniz.

01-03-2022, 18:31:31

oktayc0

<?php

if (isset($_GET["fiyatyuk"])) {
$sorgu = mysqli_query($baglanti,"SELECT * FROM urunler ORDER BY fiyat DESC");
$deg = 'fiyatyuk';
}
elseif (isset($_GET["fiyatdus"])) {
$sorgu = mysqli_query($baglanti,"SELECT * FROM urunler ORDER BY fiyat ASC");
$deg = 'fiyatdus';
}
else {
$sorgu = mysqli_query($baglanti,"SELECT * FROM urunler ORDER BY id");
$deg = 'enson';
}

# ÜRÜNLERİ LİSTELEYECEĞİN DÖNGÜ ALANI 
#
# ÖRNEK DÖNGÜ:
#
# while ($cikti = mysqli_fetch_assoc($sorgu)) {
#
# echo $cikti["urun_adi"];
#
# }



?>


<!--

ÖRNEK OLMASI İÇİN BU ŞEKİLDE PAYLAŞTIM.
FORM KISMINIDA İSTERSEN AJAX İLE SAYFA YENİLEMEDEN POST EDEBİLİRSİN.

 -->
<form action="" method="GET">
<select name="son" class="sirala" onchange="$('#OrderSubmit').submit();">
<option value="">Gelişmiş Sıralama</option>
<option value="fiyatyuk" <?=($deg == 'fiyatyuk') ? "selected" : '';?>>Fiyata Göre Yüksek</option>
<option value="fiyatdus" <?=($deg == 'fiyatdus') ? "selected" : '';?>>Fiyata Göre Düşük</option>
<option value="enson" <?=($deg == 'enson') ? "selected" : '';?>>En Son Eklenen</option>
</select>
</form>