Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Getting radio button value by ajax

Tags:

jquery

ajax

php

I want to get radio button values and send them through AJAX to PHP.

My AJAX is running but is currently inserting a 0 in each row, so it's not picking up the value from the radio button. Any help would be appreciated.

$("#save_privacy").submit(function() {
  var message_pri = $("#message_pri").val();
  var follow_pri = $("#follow_pri").val();
  var post_pri = $("#post_pri").val();
  var check7 = $("#check7").val();

  var s = {
    "message_pri": message_pri,
    "follow_pri": follow_pri,
    "post_pri": post_pri,
    "check": check7
  }

  $.ajax({
    url: 'edit_check.php',
    type: 'POST',
    data: s,
    beforeSend: function() {
      $(".privacy_info").html("<img src=\"style/img/ajax/load2.gif\" alt=\"Loading ....\" />");
    },
    success: function(data) {
      $(".privacy_info").html(data);
    }
  });

  return false;
});
<form id="save_privacy">
  <table align="center" width="70%" cellpadding="0" cellspacing="0" border="0">
    <tr>
      <td style="padding: 5px;">
        <b>Message Buttun: </b>
      </td>
      <td style="padding: 5px;">
        <input type="radio" id="message_pri" name="message_pri" value="1" /> ON
        <input type="radio" id="message_pri" name="message_pri" value="2" /> OFF
        <input type="radio" id="message_pri" name="message_pri" value="3" /> FOLLOWERS
      </td>
    </tr>
    <tr>
      <td style="padding: 5px;">
        <b>Follow Buttun: </b>
      </td>
      <td style="padding: 5px;">
        <input type="radio" id="follow_pri" name="follow_pri" value="1" /> ON
        <input type="radio" id="follow_pri" name="follow_pri" value="2" /> OFF
      </td>
    </tr>
    <tr>
      <td style="padding: 5px;">
        <b>Who Can Post On Your Profile: </b>
      </td>
      <td style="padding: 5px;">
        <input type="radio" id="post_pri" name="post_pri" value="1" /> Evry one
        <input type="radio" id="post_pri" name="post_pri" value="2" /> Followers
      </td>
    </tr>
    <tr>
      <td colspan="2" style="padding: 5px;">
        <input type="hidden" id="check7" value="save_privacy" name="check7" />
        <input class="small color blue button" type="submit" value="Save" />
      </td>
    </tr>
  </table>
  <div class="privacy_info"></div>
</form>
like image 377
Mahmoud Samy Avatar asked Aug 21 '13 13:08

Mahmoud Samy


2 Answers

Firstly you have a lot of duplicated id attributes, which is incorrect. Use classes instead, then use the :checked selector to get the specific instance of the radio which was selected.

Try this:

<input type="radio" class="message_pri" name="message_pri" value="1" /> ON  
<input type="radio" class="message_pri" name="message_pri" value="2" /> OFF
<input type="radio" class="message_pri" name="message_pri" value="3" /> FOLLOWERS
var message_pri = $(".message_pri:checked").val();

And so on for your other radio inputs.

like image 89
Rory McCrossan Avatar answered Sep 23 '22 18:09

Rory McCrossan


dont use id two time first thing

now for selected value of radio box use

$("input:radio[name=post_pri] :selected").val();
like image 34
Rituraj ratan Avatar answered Sep 22 '22 18:09

Rituraj ratan