2016-03-02 229 views
1

我试图将数组值添加到选择html元素。我的问题是这样的:Ajax调用PHP类返回数组,数组索引返回undefined

有一次,我尝试使用AJAX响应返回undefined,你可以在下面的截图中看到摆脱PHP类的数组:https://gyazo.com/1bc4872533c5ba0651c4890cbd01fd97

我的代码看起来像以下:

Ajax和HTML:

<div class="col-sm-6"> 
      <label>Gender</label> 
      <select id="fds_gender" name="fds_gender" data-placeholder="Select a gender..." class="select-icons"> 
       <option value="stud" data-icon="man">Male</option> 
       <option value="babe" data-icon="woman">Female</option> 
      </select> 
     </div> 
    </div> 
</div> 

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

      if ($(this).val() == "stud") { 
       $.ajax({ 
        type: "POST", 
        data: { 
         'username' : '<?php echo $user->username; ?>', 
         'gender' : 'stud' 
        }, 
        url: "ajax/fds_categories_ajax.php", 
        success: function(data){ 
         console.log(data['name']); 
        } 
       }); 
      }else if($(this).val() == "babe"){ 
       $.ajax({ 
        type: "POST", 
        data: { 
         'username' : '<?php echo $user->username; ?>', 
         'gender' : 'babe' 
        }, 
        url: "ajax/fds_categories_ajax.php", 
        success: function(data){ 
         console.log(data['name']); 
        } 
       }); 
      } 
     }); 
    }); 
</script> 

,这里是它调用PHP类的函数返回数组的PHP文件:

<?php 
    require_once('../../handling/fds_categorys.php'); 

    if(!empty($_POST)){ 
     $username = $_POST['username']; 
     $gender = $_POST['gender']; 

     $fds_categories = new fds_categorys($username, $gender); 
     $fds_categories_response = $fds_categories->get_template_categories(); 

     return $fds_categories_response; 
    }else{ 
     return 'Please select a gender.'; 
    } 
?> 

返回数组看起来像如下:

array(1) { 
    ["categories"]=> 
    array(12) { 
    ["4ffc3111a41f46bf58590aa0bb200630"]=> 
    array(5) { 
     ["name"]=> 
     string(5) "Hairs" 
     ["id"]=> 
     string(8) "20074652" 
     ["active"]=> 
     string(4) "true" 
     ["displayName"]=> 
     string(5) "Hairs" 
     ["previewUrl"]=> 
     string(13) "stud/hair.swf" 
    } 
    ["7f579c66d0a7d4d007a15eb17682bd8e"]=> 
    array(5) { 
     ["name"]=> 
     string(6) "Shirts" 
     ["id"]=> 
     string(8) "20074653" 
     ["active"]=> 
     string(4) "true" 
     ["displayName"]=> 
     string(6) "Shirts" 
     ["previewUrl"]=> 
     string(13) "stud/tops.swf" 
    } 
    ["29d7993b5db7388915fe7067517999db"]=> 
    array(5) { 
     ["name"]=> 
     string(7) "Jackets" 
     ["id"]=> 
     string(8) "20074654" 
     ["active"]=> 
     string(4) "true" 
     ["displayName"]=> 
     string(7) "Jackets" 
     ["previewUrl"]=> 
     string(16) "stud/jackets.swf" 
    } 
    ["a274880556d8853de27876a5cffd0fb9"]=> 
    array(5) { 
     ["name"]=> 
     string(7) "Bottoms" 
     ["id"]=> 
     string(8) "20074655" 
     ["active"]=> 
     string(4) "true" 
     ["displayName"]=> 
     string(7) "Bottoms" 
     ["previewUrl"]=> 
     string(16) "stud/bottoms.swf" 
    } 
    ["a60ba1a7a56c9e00252baebe89d62c12"]=> 
    array(5) { 
     ["name"]=> 
     string(5) "Shoes" 
     ["id"]=> 
     string(8) "20074656" 
     ["active"]=> 
     string(4) "true" 
     ["displayName"]=> 
     string(5) "Shoes" 
     ["previewUrl"]=> 
     string(14) "stud/shoes.swf" 
    } 
    ["643fdaf1fef54e8def751f54b706cd60"]=> 
    array(5) { 
     ["name"]=> 
     string(6) "Gloves" 
     ["id"]=> 
     string(8) "20074657" 
     ["active"]=> 
     string(4) "true" 
     ["displayName"]=> 
     string(6) "Gloves" 
     ["previewUrl"]=> 
     string(15) "stud/gloves.swf" 
    } 
    ["044521e5145fe9bef15063b9594ee586"]=> 
    array(5) { 
     ["name"]=> 
     string(5) "Belts" 
     ["id"]=> 
     string(8) "20074658" 
     ["active"]=> 
     string(4) "true" 
     ["displayName"]=> 
     string(5) "Belts" 
     ["previewUrl"]=> 
     string(14) "stud/belts.swf" 
    } 
    ["8111b0006bc6d13725a81813e5a98a09"]=> 
    array(5) { 
     ["name"]=> 
     string(7) "Scarves" 
     ["id"]=> 
     string(8) "20074659" 
     ["active"]=> 
     string(4) "true" 
     ["displayName"]=> 
     string(7) "Scarves" 
     ["previewUrl"]=> 
     string(16) "stud/scarves.swf" 
    } 
    ["1765c2917753cf1c0e6994b3ef362639"]=> 
    array(5) { 
     ["name"]=> 
     string(4) "Hats" 
     ["id"]=> 
     string(8) "20074660" 
     ["active"]=> 
     string(4) "true" 
     ["displayName"]=> 
     string(4) "Hats" 
     ["previewUrl"]=> 
     string(13) "stud/hats.swf" 
    } 
    ["9422d6dde5a1c70984984f203ee168df"]=> 
    array(5) { 
     ["name"]=> 
     string(4) "Bags" 
     ["id"]=> 
     string(8) "20074661" 
     ["active"]=> 
     string(4) "true" 
     ["displayName"]=> 
     string(4) "Bags" 
     ["previewUrl"]=> 
     string(13) "stud/bags.swf" 
    } 
    ["af411d238070f3062264110665b9a4bc"]=> 
    array(5) { 
     ["name"]=> 
     string(12) "Miscellanies" 
     ["id"]=> 
     string(8) "20074662" 
     ["active"]=> 
     string(4) "true" 
     ["displayName"]=> 
     string(4) "Misc" 
     ["previewUrl"]=> 
     string(13) "stud/misc.swf" 
    } 
    ["398c88178452f433328cf6ed836a47a4"]=> 
    array(5) { 
     ["name"]=> 
     string(17) "FacialDecorations" 
     ["id"]=> 
     string(8) "20074663" 
     ["active"]=> 
     string(4) "true" 
     ["displayName"]=> 
     string(5) "Masks" 
     ["previewUrl"]=> 
     string(14) "stud/masks.swf" 
    } 
    } 
} 

有没有人有一个想法,为什么执行console.log返回未定义的全部时间?

回答

3

您正在返回一个PHP数组对象,并试图使JavaScript了解它。

相反,将其转换为一个JSON数组:

$response = json_encode($fds_categories_response); 

echo然后它(return不输出任何数据):

echo $response; 
AJAX

然后,将其转换成一个JavaScript阵列并看看控制台:

$.parseJSON(data); 
console.log(data); 

要获取类别名称,它会是这样的:

var categories = data.categories; 
$.each(index, element){ 
    console.log(element.name); 
}); 
1

,如果你想要的东西要归还使用回声功能和Ajax调用函数读取里面你不能从PHP函数返回的任何值