在单选按钮上显示div中的数据单击ajax

I want to show selected data by user on ajax call.

我希望用户在ajax调用中显示所选数据。

Scenario is that I have two radio buttons, and when user clicks on either one it should show the respective data on the right side, in the response div.

场景是我有两个单选按钮，当用户点击其中任何一个时，它应该在响应div中显示右侧的相应数据。

HTML:

HTML：

<form id="package-call" method="post" accept-charset="utf-8">
    <div class='pakges'>
        <div class="sub-pakge">
            <div class="sub-pakge-content">
                <span class="content-title">North America</span><br>
                <span class="content-title">Basic</span>
                <div class="content-time">150 Minutes</div>
                <span class="content-price">Rs.500</span>
                <div class="pakges-radio"><input type="radio" name="package" id="package" >    </div>
            </div>
        </div>
        <div class="sub-pakges">
            <div class="sub-pakges-content">
                <span class="content-title">North America</span><br>
                <span class="content-title">Max</span>
                <div class="content-time">400 Minutes</div>
                <span class="content-price">Rs.200</span>
                <div class="pakges-radio"><input type="radio" name="package" id="package">   </div>

            </div>
        </div>
    </div>
</form>

AJAX:

AJAX：

$("#package").click(function(e){ 

    $.ajax( {
        type: "POST",
        url: "package _selection.php",
        data: $('#package_call').serialize(),
        success: function( response ) {}
    });

});

This is the div where i want to show my response:

这是我希望显示我的回答的div：

<div class="form-results">
    <div class="rslt-content-main">
        <div class="rslt-content">Selected Pakages / Bolts</div>
        <div id="package_response"></div>
    </div>
</div>

And these are the result div's that i want to get through ajax call from package _selection.php and want to display respectively

这些是我希望通过包_selection.php进行ajax调用并希望分别显示的结果div

<div class="radio_one_rslt">
    <div>voice:</div><br />
    <div>IDD Asia - Rs 200</div>
</div>

<div class="radio_two_rslt">
    <div>voice:</div><br />
    <div>IDD Asia - Rs 500</div>
</div>

1 个解决方案

#1

For listening to a radio button, use the 'change' event

要收听单选按钮，请使用“更改”事件

$("#package").on('change', function(e){

Then, assuming your response is the HTML you want to append, append it in your success callback

然后，假设您的响应是要附加的HTML，请将其附加到成功回调中

$.ajax( {
  type: "POST",
  url: "package _selection.php",
  data: $('#package_call').serialize(),
  success: function( response ) {
    $('#package_response').append(response);
  }
});

A blog post for reference: http://blog.stephenborg.com/?p=37

一篇博文供参考：http：//blog.stephenborg.com/？p = 37

#1