php 通过ajax获取单选按钮值

Getting radio button value by ajax

提问by Mahmoud Samy

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

我想获取单选按钮值并通过 AJAX 将它们发送到 PHP。

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

我的 AJAX 正在运行，但当前正在0每行中插入一个，因此它没有从单选按钮中获取值。任何帮助，将不胜感激。

$("#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>

回答by Rory McCrossan

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

首先，您有很多重复的id属性，这是不正确的。改用类，然后使用:checked选择器获取所选收音机的特定实例。

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 radioinputs.

依此类推，用于您的其他radio输入。

回答by Rituraj ratan

dont use id two time first thing

第一件事不要使用 id 两次

now for selected value of radio box use

现在为选定的单选框值使用

$("input:radio[name=post_pri] :selected").val();

回答by nawissor

I would like to add that it is best to use the onChange event instead of the onClick event on the radio fieldset button call to the AJAX function. I am not sure why, but in this case it posts the correct value every time. When using the onClick event it sometimes posts a value different from the checked value. It is not much but it will definitely save somebody somewhere from a slight headache.

我想补充一点，最好在对 AJAX 函数的单选字段集按钮调用上使用 onChange 事件而不是 onClick 事件。我不知道为什么，但在这种情况下，它每次都会发布正确的值。使用 onClick 事件时，它有时会发布与选中值不同的值。这并不多，但它肯定会让某人免于轻微的头痛。

Example of the radion button group:

单选按钮组示例：

 <fieldset **onChange="return rating_score()"** id="rating_selectors" data-
  role="controlgroup" data-type="horizontal">
  <input <?php if (!(strcmp($row_rs_new_rating['rating_value'],"1"))) {echo 
  "checked=\"checked\"";} ?> type="radio" name="rating" id="ratings_0" 
   value="1" />
  <label title="1" for="ratings_0"></label>
  <input <?php if (!(strcmp($row_rs_new_rating['rating_value'],"2"))) {echo 
   "checked=\"checked\"";} ?>  type="radio" name="rating" id="ratings_1" 
    value="2" />
  <label  title="2" for="ratings_1"></label>
  <input <?php if (!(strcmp($row_rs_new_rating['rating_value'],"3"))) {echo 
   "checked=\"checked\"";} ?>   type="radio" name="rating" id="ratings_2" 
   value="3" />
  <label title="3" for="ratings_2"></label>
  <input <?php if (!(strcmp($row_rs_new_rating['rating_value'],"4"))) {echo 
   "checked=\"checked\"";} ?>  type="radio" name="rating" id="ratings_3" 
   value="4" />
  <label title="4" for="ratings_3"></label>
  <input <?php if (!(strcmp($row_rs_new_rating['rating_value'],"5"))) {echo 
    "checked=\"checked\"";} ?>  type="radio" name="rating" id="ratings_4" 
    value="5" />
   <label title="5" for="ratings_4"></label>
   </fieldset>

Example of the AJAX function:

AJAX 函数示例：

<script type="text/javascript">
function rating_score ( txt_rating ) 
{ $.ajax( { type    : "POST",
data: {"txt_captcha" : $("#txt_captcha").val(), "txt_rating" : 
$("input[name=rating]:checked").val()},
url     : "functions/reviewrater.php",
success : function (txt_rating)
      {   
      $('#rating-container').load(document.URL +  ' #rating-container');
      $('span.stars').stars();


      },
    error   : function ( xhr )
      { alert( "error" );
      }

} );
return false;   
}
</script>

Quick explanation:

快速解释：

The onChange event in the fieldset sends the value of the checked radio button to the AJAX function. I have added validation for the rest of the elements on the page, so the <?php if (!(strcmp($row_rs_new_rating['rating_value'],"3"))) {echo "checked=\"checked\"";} ?>compares the value stored in the rating session and retrieves the value again, so the user does not have to click on the rating again once they are warned that some of the other elements are empty. It looks much more complicated than it is, but all I actually wanted to say was to use the onChange instead of the onCLick event. :-)

fieldset 中的 onChange 事件将选中的单选按钮的值发送到 AJAX 函数。我已经为页面上的其余元素添加了验证，因此<?php if (!(strcmp($row_rs_new_rating['rating_value'],"3"))) {echo "checked=\"checked\"";} ?>比较存储在评级会话中的值并再次检索该值，因此一旦用户被警告某些其他元素为空。它看起来比实际复杂得多，但我真正想说的是使用 onChange 而不是 onCLick 事件。:-)

You can visit this page to see the above code in action:

您可以访问此页面以查看上述代码的运行情况：

Rental Property Reviews Page

出租物业评论页面

回答by Kathiravan

Try this use serializefunction check serialize here

在这里试试这个使用serialize函数检查序列化

 $("#save_privacy").submit(function(){
  var serialise = $("#save_privacy").serialize();
  $.ajax({
      url:'edit_check.php',
      type:'POST',
      data:serialise,
      beforeSend: function (){
        $(".privacy_info") .html("<img src=\"style/img/ajax/load2.gif\" alt=\"Loading ....\" />");
      },
      success:function(data){
        $(".privacy_info") .html(data);
      }
  });
 return false;
});