使用$ .ajax发送数据时出现问题

Question

I made a form using radio button (for poll).
And I use $.ajax to submit the form.
but when I use $("#polling").serialize() for the data, there is nothing sent/requested...

---

Are there any problem with the radio button?

$(function(){ $("input[name=vote]").click(function(){
  var id_polling = $("input[name=id_polling]");
  $("div[class=poll-content]").text("Loading");
  $.ajax({
    type: "POST",
    url: BASE_URL + "/processes/polling.php",
    data: $("#polling").serialize(),
    success: function(msg){
      document.getElementById("poll-content").innerHTML = msg;
    }
  });
});

and this is the HTML code :

<div class="poll-content" id="poll-content">
    <form action="#" id="polling">
    <?php
    $poll = Polling::_find_by_id($id);
    $view = "<h4 class=\"polling\">" . $poll->nama . "</h4>";
    $options = explode(",", $poll->opsi);
    foreach ($options as $i => $option) {
        $view .= "<input type=\"radio\" class=\"option\" name=\"option\" value=\"" . $option . "\" />";
        $view .= $option;
        $view .= "<br />";
    }
    $view .= "<input type=\"hidden\" name=\"id_polling\" value=\"" . $poll->id_polling . "\">";
    echo $view;
    ?>
    <input type="button" name="vote" value="Vote" />
    </form>
</div>

Answer 1

At first look it appears you are missing a closing });

$(function() {
    $("input[name=vote]").click(function() {
        var id_polling = $("input[name=id_polling]");
        $("div[class=poll-content]").text("Loading");
        $.ajax({
            type: "POST",
            url: "/echo/html/",
            data: $("#polling").serialize(),
            success: function(msg) {
                document.getElementById("poll-content").innerHTML = msg;
            }
        });
    });
}); //<-Missing this to close out dom ready

Edit, after looking at your markup, doing $("div[class=poll-content]").text("Loading"); will destroy the form so your call to $("#polling").serialize() will fail.

Try to capture the form before you call .text()

$(function() {
    $("input[name=vote]").click(function() {
        var id_polling = $("input[name=id_polling]");
        var formData = $("#polling").serialize();
        $("div[class=poll-content]").text("Loading");
        $.ajax({
            type: "POST",
            url: "/echo/html/",
            data: formData,
            success: function(msg) {
                document.getElementById("poll-content").innerHTML = msg;
            }
        });
    });
});

Example on jsfiddle

Side note, you can use the class selector instead of the attribute selector $("div.poll-content").text("Loading");