2012-02-13 95 views
0

我一直在試圖解決一直以來一直存在的問題,並希望有人可能會善意幫助我發現我的錯誤。我只是今天早上開始學習jQuery,並試圖讓這個函數工作,但它證明了一點在諺語中的痛苦...使用jQuery和xml填充基於來自另一個選擇列表的索引的選擇列表

我想填充一個模型選擇列表基於一個讓選擇列表

我的jQuery函數如下:

$(document).ready(function() 
{ 
    $('#make').change(function(){ 
     alert('Changing'); 
     $('#model option').remove(); 
     $('#model').attr('disabled',true);    
     $.ajax(
     { 
      type: "GET", 
      url: "../xmlsource/models/model-"+$('#make option:selected').val()+".xml", 
      dataType: "xml", 
      success: function(xml) 
      { 
       alert('XML'); 
       $(xml).find('model').each(function() 
       { 
        var name = $(this).attr('name'); 
        var value = $(this).attr('value'); 
        $('#model').append("<option value='"+value+"'>"+name+"</option"); 
        alert('Cycling'); 
       }); 
      } 
     });     
     $('#model').removeAttr('disabled'); 
    }); 
}); 

我測試的XML文件看起來像這樣:

<?xml version="1.0" encoding="utf-8" ?> 
<models> 
<model name="--Please Select--" value="0"> 
<model name="A1" value="1"> 
<model name="A2" value="2"> 
</models> 

我的HTML看起來像這樣:

<form method="post" action="seller.php"> 
<table border="0"> 
    <tr> 
     <td>Make</td> 
     <td> 
      <select name='make' id="make"> 
      <?php 
       $manufacturers = simplexml_load_file('../xmlsource/makes.xml'); 
       foreach($manufacturers->xpath('//manufacturer') as $manufacturer) 
       { 
        if(isset($trimmed['make'])) 
        { 
         if ($trimmed['make'] == "$manufacturer->value") 
         { 
         ?> 
         <option value="<?php echo "$manufacturer->value";?>" selected="selected"><?php echo "$manufacturer->name"?></option> 
         <?php 
         } 
         else 
         {   
         ?> 
         <option value="<?php echo "$manufacturer->value";?>"><?php echo "$manufacturer->name"?></option> 
         <?php 
         } 
        } 
        else 
        { 
        ?> 
        <option value="<?php echo "$manufacturer->value";?>"><?php echo "$manufacturer->name"?></option> 
        <?php 
        } 
       } 
      ?>  
      </select> 
     </td> 
    </tr> 
    <tr> 
     <td>Model</td> 
     <td> 
      <select name="model" id="model">         
      </select> 
     </td> 
    </tr> 
</table> 
<div align="center"><input id="button" type="submit" value="Create My Listing"></div> 

我已經測試了功能儘可能最好,它是在加載XML文件成功,但只觸及第一次警報,似乎沒有進入成功條件代碼。我很抱歉,如果這似乎天真,但正如我說我在這件事上沒有經驗

任何幫助,將不勝感激

親切的問候 金龜

回答

0

我能得到它在這個jsFiddle工作(注意,URL和數據參數專用於的jsfiddle - 用自己的URL和刪除數據節點)。

這裏是我jQuery的使用:

$('#make').change(function() { 
    $('#model option').remove(); 
    $('#model').attr('disabled', true); 
    $.ajax({ 
     type: "POST", 
     url: "/echo/xml/", 
     data:{ 
      xml:'<?xml version="1.0" encoding="utf-8" ?><models><model name="--Please Select--" value="0" /><model name="A1" value="1" /><model name="A2" value="2" /></models>'}, 
     dataType: "xml", 
     success: function(xml) { 
      $(xml).find('model').each(function() { 
       var name = $(this).attr('name'); 
       var value = $(this).attr('value'); 
       $('#model').append("<option value='" + value + "'>" + name + "</option"); 
      }); 
       $('#model').removeAttr('disabled'); 
     } 
    }); 
}); 

請注意,我用的不是GET POST。我也必須自己關閉所有的XML模型節點。

+0

許多很多感謝,它的工作treat.Just出於好奇心,請不要以爲我粗魯的問,這是跨瀏覽器兼容,因爲我已經被告知,jQuery可以有點古怪?這是真的? – BarryH1987 2012-02-13 16:51:53

+0

應該完全沒問題。另外,如果這解決了您的問題,請考慮將其作爲可接受的解決方案。謝謝。 – j08691 2012-02-13 16:56:37

+0

道歉沒有看到接受答案剔,非常感謝,非常感謝 – BarryH1987 2012-02-13 17:07:15

相關問題