Jquery ile Form İşlemleri

Jquerynin bize sağlıcağı en büyük kazanç şüpesiz farklı browserlar için tek kod kullanmak.
Jquery ile Form İşlemleri

Aşağıdaki gibi formumuz olsun:

<select id="single">
    <option>Single</option>
    <option>Single2</option>
</select>

<select id="multiple" multiple="multiple">
    <option selected="selected">Multiple</option>
    <option>Multiple2</option>
    <option selected="selected">Multiple3</option>
</select>
 

Yukardaki gibi bir yapı için:

$('select.foo option:selected').val();                // selectlerden class adı foo olanın seçilen değerlerini alır
$('select.foo').val();                                             // selectlerden class adı foo olanın degerini alır
$('input:checkbox:checked').val();                   // checkboxlardan çekli olanın değerini alır
$('input:radio[name=bar]:checked').val();      // radio dügmelerinden name değeri bar olan ve seçili olanın değerinini alır
$('[name=bar] option:selected').val();      //  selectlerden name değeri bar olan ve seçili olanın değerinini alır

Aşağıdaki psikopat örneği inceleyebilirsiniz:

  <select id="single">
    <option>Singleoption>
    <option>Single2option>

  select>
  <select id="multiple" multiple="multiple">
    <option selected="selected">Multipleoption>
    <option>Multiple2option>

    <option selected="selected">Multiple3option>
  select>

   <script>
    function displayVals() {
      var singleValues = $("#single").val();
      var multipleValues = $("#multiple").val() || [];
      $("p").html("Single: " +
                  singleValues +
                  " Multiple: " +
                  multipleValues.join(", "));
    }

    $("select").change(displayVals);
    displayVals();

  script>
 

Radyo düğmelerinden herhangi birinin seçili olup olmadığını bulmak için:

<script type="text/javascript">
    <!--
   function Kontrol(){
        if($('input[name=cek_turu]:checked').val()>0){
            $('#cek_defteri').submit();
        }
        else alert("Lütfen Çek Türünü seçiniz");
    }
   //-->
</script>

<form name="ucret" method="post" id="cek_defteri">
    <input type="radio" name="cek_turu" value="1" style="vertical-align: bottom"> Alınan
    <input type="radio" name="cek_turu" value="2" style="vertical-align: bottom"> Verilen
    <input type="button" class="button buton1" value="Kaydet" onclick="Kontrol()" />
</form>

Tüm inputları kullanılamaz yapıp, tekrar düzeltmek için:

        if($('input[name=cek_turu]').is(":disabled")) { //Form elemanlarından biri kullanılamaz mı?
            $("#cek_defteri :input").removeAttr("disabled"); //Tüm form elemanlarından disable özelliğini kaldır
        }
        else {
            $("#cek_defteri :input").attr("disabled", true); //Tüm form elemanlarını kullanılamaz yap
        }

Formu yollak için:

$('[name=UyeGirisi]').submit();

<form name="UyeGirisi" method="post">
</form>

Radiolardan Herhangi Biri Seçilimi Anlamak İçin

$("input[name='gonderim']").is(':checked')

Dizi yapısındaki form elemanına erişmek için:

Dizi yapısı

<input type="hidden" name="times[]" value="" />
<input type="hidden" name="times[]" value="" />
<input type="hidden" name="times[]" value="" />
$('input[name="times[]"]').each(function(){
    alert($(this).val();
});

 Formu Resetlemek İçin:

$('[name=parcalar]')[0].reset()

Tüm Form Değişkenlerini Almak İçin:

$('form[name=urun_videolari]').serialize()

Checkbox checkli mi kontrolü için

$("input[name='TumunuSec']").is(':checked')
if (!$("input[name=sozlesme]").prop('checked'))

  Tüm Checkboxları seçili hale getirmek için: 

$('input:checkbox').prop('checked', true);

Select Optionslarını Silmek ve Eklemek

var Taksit = [
            [[0, 'Tek Çekim'], ['2', '2 Taksit']],
            [[0, 'Tek Çekim']],
            [[0, 'Tek Çekim']]
        ];
       
        Pos = $('select#pos_turu option:selected').index();
        $('select#taksit').children().remove(); //tum optionlari sil
       
        for (i in Taksit[Pos]) {
            $('select#taksit').append('<option id="' + Taksit[Pos][i][0] + '">' + Taksit[Pos][i][1] + '</option>');
        }

Bir Php Kodundan Dönen JSON Veriyi Optiona Eklemek

Php kod kısmı:

$Ilceler = $FN->Myq("SELECT * FROM ilceler WHERE il_id='$ilno''");
    unset($IlceDizi);
    while ($Ilc = $Ilceler->fetch_object()) {
        $IlceDizi[] = array(
            'val' => $Ilc->id,
            'text' => $Ilc->adi
        );
    }
    echo json_encode($IlceDizi);

JavaScript kısmı:

$.ajax({
    type: "GET",
    url: '/IlIlceMahalleAj.php',
    data: {ilno: IlNo},
    dataType: "json",
    cache: false,
    complete: function (response) {
        var DonenDegerler = JSON.parse(response.responseText);
        Hedef = 'select[name=ilce]';
        $(Hedef).children().remove(); //tum optionlari sil
        $.each(DonenDegerler, function(key, value) {
            $(Hedef).append(new Option(value['text'], value['val']));
        });
        /*for (i in DonenDegerler) {
            //$(Hedef).append('<option value="' + DonenDegerler[i]['val'] + '">' + DonenDegerler[i]['text'] + '</option>');
            $(Hedef).append(new Option(DonenDegerler[i]['text'], DonenDegerler[i]['val']));
        }*/
    }
}).done(function() {
});

   

 
Yorumunuzu Ekleyin


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