jQuery Jump menü eklentisi 6 katmanlı

AycanB · 11 Ekim 2011

Merhaba arkadaşlar hemen hemen 5 aydır eklenti yazmıyordum ve bu suskunluğu müdürümün isteği üzerine bozdum ve jump menü eklentisi yazdım. İlk başlarda sınırsız alt menu eklemeyi düşünüyordum ama o zaman sizlere yük bineceğini düşünerek 6 katmanlı yaptım. Ama jQuery ile uğraşanlar bu 6 katmanı istediği kadar çıkarabilir.

10 ay öncesinde bir arkadaşın isteği üzerine amatör bir jump menü yazmıştım bu onun biraz daha bana göre prof hali. Öncelikle 5 aydır performanslı bir şekilde jquery yazmadığımı bildirmek isterdim. Kodlarda hatam veya mantık hatam varsa bunu bildirirseniz çok sevinirim.

Ön izleme

Kullanımı
Kullanımı çok basit arkadaşlar sadece jquery eklentisini çağırırken selectlerin isimlerini yazıyorsunuz ve bitiyor.

Js Kodları

Kod:

$('#anaSecim').abJumpMenu(
{
    altSecim1 : 'qwe',
    altSecim2 : 'asd',
    altSecim3 : 'zxc',
    altSecim4 : 'bvn',
    altSecim5 : 'jkl',
    altSecim6 : 'drfty',
    bosSecim  : '<option value="seciniz">Lütfen Seçiniz</option>'
});

Html kodları

Kod:

<select id="anaSecim">
    <option value="seciniz">Lütfen Seçiniz</option>
    <option value="1">Amasya</option>
    <option value="2">Erzurum</option>
    <option value="3">İzmir</option>
    <option value="4">Kıbrıs</option>
</select>
<br/>
<select id="qwe">

</select>
<br/>
<select id="asd">

</select>
<br/>
<select id="zxc">

</select>
<br/>
<select id="bvn">

</select>
<br/>
<select id="jkl">

</select>
<br/>
<select id="drfty">

</select>

Php Kodları

Kod:

<?php

$kategor_id     = $_POST['kategori_id'];
$kategoriDerece = $_POST['kategoriDerece'];

/*
 * Eger 1. alt select'i etkileyecek kategori id gonderilmis ise
 */
if($kategoriDerece == 1)
{
    switch ($kategor_id) {
        case 1:
            echo
            '
                <option value="seciniz">1.derece - Lütfen Seçiniz</option>
                <option value="1">1.derece - Merzifon</option>
                <option value="2">1.derece - Gümüş Hacıköy</option>
                <option value="3">1.derece - Hıra</option>
                <option value="4">1.derece - Kaya Düzü</option>
            ';
            break;

        case 2:
            echo
            '
                <option value="seciniz">1.derece - Lütfen Seçiniz</option>
                <option value="1">1.derece - a</option>
                <option value="2">1.derece - b</option>
                <option value="3">1.derece - c</option>
                <option value="4">1.derece - d</option>
            ';
            break;

        case 3:
            echo
            '
                <option value="seciniz">1.derece - Lütfen Seçiniz</option>
                <option value="1">1.derece - 1</option>
                <option value="2">1.derece - 2</option>
                <option value="3">1.derece - 3</option>
                <option value="4">1.derece - 4</option>
            ';
            break;

        case 4:
            echo
            '
                <option value="seciniz">Lütfen Seçiniz</option>
                <option value="1">1.derece - 1a</option>
                <option value="2">1.derece - 1b</option>
                <option value="3">1.derece - 13</option>
                <option value="4">1.derece - 14</option>
            ';

            break;

        default:
            break;
    }

}
else if ($kategoriDerece == 2)
{
    switch ($kategor_id) {
        case 1:
            echo
            '
                <option value="seciniz">2.derece - Lütfen Seçiniz</option>
                <option value="1">2.derece - Merzifon</option>
                <option value="2">2.derece - Gümüş Hacıköy</option>
                <option value="3">2.derece - Hıra</option>
                <option value="4">2.derece - Kaya Düzü</option>
            ';
            break;

        case 2:
            echo
            '
                <option value="seciniz">2.derece - Lütfen Seçiniz</option>
                <option value="1">2.derece - a</option>
                <option value="2">2.derece - b</option>
                <option value="3">2.derece - c</option>
                <option value="4">2.derece - d</option>
            ';
            break;

        case 3:
            echo
            '
                <option value="seciniz">2.derece - Lütfen Seçiniz</option>
                <option value="1">2.derece - 1</option>
                <option value="2">2.derece - 2</option>
                <option value="3">2.derece - 3</option>
                <option value="4">2.derece - 4</option>
            ';
            break;

        case 4:
            echo
            '
                <option value="seciniz">2.derece - Lütfen Seçiniz</option>
                <option value="1">2.derece - 1a</option>
                <option value="2">2.derece - 1b</option>
                <option value="3">2.derece - 13</option>
                <option value="4">2.derece - 14</option>
            ';

            break;

        default:
            break;
    }

}
else if ($kategoriDerece == 3)
{
    switch ($kategor_id) {
        case 1:
            echo
            '
                <option value="seciniz">3.derece - Lütfen Seçiniz</option>
                <option value="1">3.derece - Merzifon</option>
                <option value="2">3.derece - Gümüş Hacıköy</option>
                <option value="3">3.derece - Hıra</option>
                <option value="4">3.derece - Kaya Düzü</option>
            ';
            break;

        case 2:
            echo
            '
                <option value="seciniz">3.derece - Lütfen Seçiniz</option>
                <option value="1">3.derece - a</option>
                <option value="2">3.derece - b</option>
                <option value="3">3.derece - c</option>
                <option value="4">3.derece - d</option>
            ';
            break;

        case 3:
            echo
            '
                <option value="seciniz">3.derece - Lütfen Seçiniz</option>
                <option value="1">3.derece - 1</option>
                <option value="2">3.derece - 2</option>
                <option value="3">3.derece - 3</option>
                <option value="4">3.derece - 4</option>
            ';
            break;

        case 4:
            echo
            '
                <option value="seciniz">3.derece - Lütfen Seçiniz</option>
                <option value="1">3.derece - 1a</option>
                <option value="2">3.derece - 1b</option>
                <option value="3">3.derece - 13</option>
                <option value="4">3.derece - 14</option>
            ';

            break;

        default:
            break;
    }

}
else if ($kategoriDerece == 4)
{
    switch ($kategor_id) {
        case 1:
            echo
            '
                <option value="seciniz">4.derece - Lütfen Seçiniz</option>
                <option value="1">4.derece - Merzifon</option>
                <option value="2">4.derece - Gümüş Hacıköy</option>
                <option value="3">4.derece - Hıra</option>
                <option value="4">4.derece - Kaya Düzü</option>
            ';
            break;

        case 2:
            echo
            '
                <option value="seciniz">4.derece - Lütfen Seçiniz</option>
                <option value="1">4.derece - a</option>
                <option value="2">4.derece - b</option>
                <option value="3">4.derece - c</option>
                <option value="4">4.derece - d</option>
            ';
            break;

        case 3:
            echo
            '
                <option value="seciniz">4.derece - Lütfen Seçiniz</option>
                <option value="1">4.derece - 1</option>
                <option value="2">4.derece - 2</option>
                <option value="3">4.derece - 3</option>
                <option value="4">4.derece - 4</option>
            ';
            break;

        case 4:
            echo
            '
                <option value="seciniz">4.derece - Lütfen Seçiniz</option>
                <option value="1">4.derece - 1a</option>
                <option value="2">4.derece - 1b</option>
                <option value="3">4.derece - 13</option>
                <option value="4">4.derece - 14</option>
            ';

            break;

        default:
            break;
    }

}
else if ($kategoriDerece == 5)
{
    switch ($kategor_id) {
        case 1:
            echo
            '
                <option value="seciniz">5.derece - Lütfen Seçiniz</option>
                <option value="1">5.derece - Merzifon</option>
                <option value="2">5.derece - Gümüş Hacıköy</option>
                <option value="3">5.derece - Hıra</option>
                <option value="4">5.derece - Kaya Düzü</option>
            ';
            break;

        case 2:
            echo
            '
                <option value="seciniz">5.derece - Lütfen Seçiniz</option>
                <option value="1">5.derece - a</option>
                <option value="2">5.derece - b</option>
                <option value="3">5.derece - c</option>
                <option value="4">5.derece - d</option>
            ';
            break;

        case 3:
            echo
            '
                <option value="seciniz">5.derece - Lütfen Seçiniz</option>
                <option value="1">5.derece - 1</option>
                <option value="2">5.derece - 2</option>
                <option value="3">5.derece - 3</option>
                <option value="4">5.derece - 4</option>
            ';
            break;

        case 4:
            echo
            '
                <option value="seciniz">5.derece - Lütfen Seçiniz</option>
                <option value="1">5.derece - 1a</option>
                <option value="2">5.derece - 1b</option>
                <option value="3">5.derece - 13</option>
                <option value="4">5.derece - 14</option>
            ';

            break;

        default:
            break;
    }

}
else if ($kategoriDerece == 6)
{
    switch ($kategor_id) {
        case 1:
            echo
            '
                <option value="seciniz">6.derece - Lütfen Seçiniz</option>
                <option value="1">6.derece - Merzifon</option>
                <option value="2">6.derece - Gümüş Hacıköy</option>
                <option value="3">6.derece - Hıra</option>
                <option value="4">6.derece - Kaya Düzü</option>
            ';
            break;

        case 2:
            echo
            '
                <option value="seciniz">6.derece - Lütfen Seçiniz</option>
                <option value="1">6.derece - a</option>
                <option value="2">6.derece - b</option>
                <option value="3">6.derece - c</option>
                <option value="4">6.derece - d</option>
            ';
            break;

        case 3:
            echo
            '
                <option value="seciniz">6.derece - Lütfen Seçiniz</option>
                <option value="1">6.derece - 1</option>
                <option value="2">6.derece - 2</option>
                <option value="3">6.derece - 3</option>
                <option value="4">6.derece - 4</option>
            ';
            break;

        case 4:
            echo
            '
                <option value="seciniz">6.derece - Lütfen Seçiniz</option>
                <option value="1">6.derece - 1a</option>
                <option value="2">6.derece - 1b</option>
                <option value="3">6.derece - 13</option>
                <option value="4">6.derece - 14</option>
            ';

            break;

        default:
            break;
    }

}

?>

Php kodları çok kalabalık görüküyor ama hiçde öyle değil. Sadece bir sql sorguluk bir durum ama ben veri tabanına bağlanmak istemediğim için böyle yaptım.
Orjinal Makale / Ön izleme / Uygulamayı indir.

jQuery Jump menü eklentisi 6 katmanlı

AycanB

0