[Rešen] Problem sa $('input:radio[name=vote]:checked').val()

[ avayaman @ 17.05.2010. 15:42 ] @

Pozz,
Nemam mnogo iskustva sa jQuery-em...

Krenuo sam da pravim ajax poll, i našao se u problemu. Radi jednostavnosti cele skripte ovde stavljam samo esencijlne delove, pa je možete probati na Vašem serveru.
Skripta radi kako sam zamislio, jedino što ne vraća vrednosti radio polja koje je čekirano ("0" ili "1"), već mi se kao vrednost $sampleData uvek vrati "undefined". Na http://jquery.com/ sam pronašao da je $('input:radio[name=vote]:checked').val() način za uzimanje vrednosti radio forme, ali u mom slučaju ne funkcioniše ili ja negde grešim (ovo poslednje je mnogo verovatnije :) ). Šta treba da promenim pa da mi se nakon klika na Vote vrati "0" ili "1" ? Hvala unapred.

Evo cele skripte:

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="style.css?" />
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $("#poll #submit").click(function () {
            $("#poll").html('<img src="ajax-loader.gif" />');
            $.ajax({
                type: "GET",
                data: "data=" + $('input:radio[name=vote]:checked').val(),
                url: "response.php",
                success: function(msg){
                    $("#poll").html(msg)
                }
            });
        });
    });
</script>
</head>

<body>
<div id="poll">
                <h4>Here comes the question...?</h4>

                <div class="label">
                <input type="radio" name="vote" value="0"  />
                <label for="vote">Answer 1:</label>
                </div>
                <br />
                <div class="label">
                <input type="radio" name="vote" value="1"  />
                <label for="vote">Answer 2:</label>
                </div>
                <input type="button" name="submit" value="Vote" id="submit" />


    </div>

</body>
</html>

response.php

Code:
<?php
$sampleData = $_GET['data'];
echo $sampleData; ?>

_{[Ovu poruku je menjao avayaman dana 17.05.2010. u 22:50 GMT+1]}

[ Nikola Poša @ 17.05.2010. 15:58 ] @

Taj selektor je ok, ne verujem da je u njemu problem. Mada, probaj za svaki slučaj da ga napišeš ovako: "input:radio[name='vote']:checked". Neka ceo selektor bude između dvostrukih navodnika, a "vote" stavi pod jednostruke navodnike.

[ avayaman @ 17.05.2010. 16:02 ] @

Citat:

Nikola Poša: Taj selektor je ok, ne verujem da je u njemu problem. Mada, probaj za svaki slučaj da ga napišeš ovako: "input:radio[name='vote']:checked". Neka ceo selektor bude između dvostrukih navodnika, a "vote" stavi pod jednostruke navodnike.

Probao, ne radi.

[ avayaman @ 17.05.2010. 16:12 ] @

Da napomenem da sam probao sa hard code

Code:
$.ajax({
                type: "GET",
                data: "data=proba"
                url: "response.php",
                success: function(msg){
                    $("#poll").html(msg)
                }
            });
        });
    });

i na izlazu dobijem "proba". Dakle sve radi osim što ne mogu da uzmem vrednost čekiranog radio dugmeta.

[ Nikola Poša @ 17.05.2010. 17:04 ] @

A koju verziju jQuery-ja koristiš? Ako je u pitanju neka starija verzija (pre 1.3), probaj da dodaš "@" ispred tog "name" u selektoru, ovako: "input:radio[@name='vote']:checked".

[ Igor Gajic @ 17.05.2010. 17:15 ] @

Code (html):

<script type="text/javascript">

    $(document).ready(function(){

        $("#poll #submit").click(function () {

            $.ajax({

                type: "GET",

                data: "data=" + $('input:radio[name=vote]:checked').val(),

                url: "response.php",

                success: function(msg){

                    $("#poll").html(msg)

                }

            });

               $("#poll").html('<img src="ajax-loader.gif" />');   // JAKO BITNO Ovim ces izbrisati iz DOM sve radio buttone i onda ti $('input...') nece raditi...

               return false; // Ne treba ti full post back...

        });

    });

</script>

Btw.

<script type="text/javascript" src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script>

Tako da je odgovor na Nikolino pitanje jQuery 1.4.2

[ avayaman @ 17.05.2010. 17:16 ] @

Kao što stoji u head-u hotlinkujem sa <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>, dakle 1.4.2 i uopšte mi nije jasno u čemu je problem. Evo već drugi dan se patim sa ovim problemom.

[ Nikola Poša @ 17.05.2010. 21:13 ] @

A da, nisam uopšte obraćao pažnju na ceo kod koji si poslao, već samo na $(document).ready deo.

Ne znam da li si pročitao Igorovu poruku, budući da je poslata u isto vreme kad i tvoja. On ti je lepo napisao u čemu je problem. Ti pre slanja AJAX zahteva ceo sadržaj tog tvog div-a sa id-em poll, uključujući naravno i oba radio button-a, zamenjuješ sa tom nekom animacijom učitavanja, tako da taj selektor neće vratiti ništa... Taj loading efekat se obično stavlja u npr. neki span, odmah pored dugmeta za submit-ovanje forme.

[ avayaman @ 17.05.2010. 21:36 ] @

Citat:

Nikola Poša:
Ne znam da li si pročitao Igorovu poruku, budući da je poslata u isto vreme kad i tvoja. On ti je lepo napisao u čemu je problem.

U pravu si - nisam je ni pročitao :) Jednostavno mi je promakla jer sam odmah po postovanju svog odgovora otišao na pregled svih postova o JS (to mi je nekako navika) i tamo čekako odgovore, pa kako je moj bio poslednji nisam ulazio u "tok" posta :) Hvala puno ! Sada mogu dalje da nastavim ! :)