Jquery Ajax调用php脚本我该如何处理数据?

问题描述:

I am trying to get this ajax call to work:

<script type="text/javascript">
$( document ).ready(function() {

        $('#home_location').change(function(){
                $.ajax({
                        url: 'GetCommunities.php',
                        data: {id: $(this).val()},
                        datatype: 'json',
                        success: function(data){
                                console.log(data);
                        }
                });
        });

});
</script>

The console log returns my data like so:

[{"rb_communityId":"8","rb_communityLabel":"Sunflower","rb_communityOrder":"12","rb_locationId":"4"}] 

my question is how do I make the rb_communitiyId into an array and use that array to for select options to replace a current dropdown?

this code:

$.ajax({
   url: 'GetCommunities.php',
   data: {id: $(this).val()},
   datatype: 'json',
   success: function(data){
      console.log(data);
   });
});

will NOT result to a JSON object, but in a string! replace datatype to dataType and be sure to call echo json_encode(your_array); exit; in your php file.

Normally, you would be able to access your data (in success) like data.rb_communityId and about changing a dropdown, just use this: (Replace #mydropdown with your own id)

$("#mydropdown").val( data.rb_communityId );

assuming the .communityId is a value of your dropdown.

If you want to replace a dropdown entirely based on the data, do this (in success again):

$("#mydropdown option").remove();
$.each(data,function(key,value) {
   $("#mydropdown").append($("<option></option>",{value:value["rb_communityId"],text:value["rb_communityLabel"]}));
});

I dont find uses for your other two variables, the above will add value and text.

Your data is in Json form , so you need to iterate through your data and handle your html with jquery –

     <script type="text/javascript">
    $( document ).ready(function() {

            $('#home_location').change(function(){
                    $.ajax({
                            url: 'GetCommunities.php',
                            data: {id: $(this).val()},
                            datatype: 'json',
                            success: function(data){
                                   alert(data.rb_communityId);
//this how you access to ther b_communityId

                            }
                    });
            });

    });
    </script>

Assuming that you want to replace all the <option> element of a particular <select> element, you can do the following. However, remember to update your <select> element selector — I have used the dummy selector selectEleSelector.

$( document ).ready(function() {
    $('#home_location').change(function(){
        $.ajax({
            url: 'GetCommunities.php',
            data: {id: $(this).val()},
            datatype: 'json',
            success: function(data){
                // Empty the <select> element of interest
                $(selectEleSelector).empty();

                // Iterate through your json array
                $.each(data, function(i,v) {
                    // Construct <option>
                    var $opt = $('<option />', {
                        value: this.rb_communityId,
                        text: this.rb_communityLabel
                    });

                    // Append construct to <select>
                    $opt.appendTo(selectEleSelector);
                });
            }
        });
    });
});

My answer is made on the assumption that you intend rb_communityId to be the option's value, and rb_communityLabel as the text. If that is not what you want, you can switch the keys as of when appropriate :)

You need to replace a combo-box builder code in your success section

$('#home_location').change(function(){
    $.ajax({
       url: 'GetCommunities.php',
       data: {id: $(this).val()},
       datatype: 'json',
       success: function(data){
          var s = $('<select />');

          var obj = $.parseJSON(data);
          $('<option />', {value: obj.rb_communityId, text: obj.rb_communityLabel}).appendTo(s);
       }
    });
});

If it's multiple options in returned values you need to put the parsing section in $.each