2014-02-07 73 views
0

所以我有一个PHP数组,我是JSON编码和交给一些JQuery。基本上我使用阵列中的信息根据另一个下拉列表的值来动态更改一个下拉列表的内容。我遇到了JQuery的一些问题,虽然JQuery对我来说很新。迭代通过php数组在jquery

首先我的PHP:

<?php 
$sql = mysql_query("SELECT * FROM menu") or die(mysql_error()); 

$menuItems = array(); 
$x   = 0; 
while($row = mysql_fetch_object($sql)) 
{ 
    $menuItems[$x]['ID']  = $row->ID; 
    $menuItems[$x]['parent'] = $row->parent; 
    $menuItems[$x]['name']  = $row->Name; 
    $menuItems[$x]['header'] = $row->header; 
    $menuItems[$x]['Sort']  = $row->sort; 

    $x++; 
} 
?> 

此代码返回〜30个的菜单项的数组。

然后我的JQuery:

<script> 
    var menuItems = <?php echo json_encode($menuItems); ?>; 

    $('#dropdown1').change(function(){ 
      if($('#dropdown1').val() == 0){ 
       $('dropdown2').children().remove().end() 

       for(var x = 0; x < menuItems.length; x++){ 
        if(menuItems[x]['header'] == 1){ 
         $('#dropdown2').options[menuItems[x]['sort']] = new Option(menuItems[x]['name'], menuItems[x]['sort']); 
        } 
       } 
      } 
     }); 
</script> 

我想这个做的是当dropdown1改变,dropdown2的选项去掉,然后用从阵列具体的事情再增殖。

当dropdown1更改但重新填充不起作用时,此代码确实会删除dropdown2的选项。从我在测试中可以看出的情况来看,循环遍历数组的循环只输入一次,尽管它们大约有30个项目,我认为这是我的主要问题。

我在这里做错了什么?

+0

当页面被创建时,PHP在服务器上运行。 'menuItems'的内容不会动态改变。您需要使用AJAX从服务器获取一组新的菜单项。 – Barmar

+1

'$('#dropdown2')。options []'do做什么?你有没有告诉我们的插件,或者你是否将jQuery对象与本地DOM元素相混淆。 – adeneo

+0

1.这是一个javascript对象,而不是“php数组”。 2.你似乎误解了“jQuery”是javascript的框架 - 而不是另一种语言。你可以没有jQuery的JavaScript,但你不能没有JavaScript的jQuery。你的代码是javascript利用jQuery框架的某些部分,但是诸如循环等东西,根本不需要传递jQuery。 – h2ooooooo

回答

0

所以从评论看来,我的意思似乎存在一些混淆,我很抱歉。这是解释对我来说很有意义的一个例子,但我不可能把所有的事情都传达好。

清除一点点混淆。从PHP代码传递给javascript的数组中包含了第二个下拉列表中所需的所有内容。

许多人指出.options []是代码未执行的罪魁祸首。这仅仅是我从另一个例子中发现的,而且由于我的知识有限,我认为它是正确的,事实并非如此。

我反而使用.append()函数,现在事情似乎正常工作。

0

将其更改为

for(var x = 0; x < menuItems.length; x++){ 
     if(menuItems[x]['header'] == 1){ 
      var option = $('<option />', { 
        text : menuItems[x]['name'], 
        value: menuItems[x]['sort'] 
      }); 
      $('#dropdown2 option[value="'+[menuItems[x]['sort']]+'"]').replaceWith(option); 
     } 
} 

$('#dropdown2').options[]是无效的,因为jQuery的没有这些方法,这对纯JS DOM节点。