2011-02-25 60 views
1

我用動態下拉與jquery.I獲取數據到下拉菜單,但當我選擇特定項目時,它是獲取列表中的第一條記錄。動態下拉使用jQuery?

我的編碼: 此函數是來自ajax的響應。

function updateItem() 
{ 
    var item= xmlhttp.responseXML.getElementsByTagName("ExpenseType"); 
    var itemId = "0"; 
    var itemName = "--"; 
    document.getElementById("reportAhcc_Item_ID_S").length = 0; 
    if(item.length != "0") 
    { 
     for(var i=0;i<item.length;i++) 
     { 
      itemId=item[i].getElementsByTagName("ItemId")[0].childNodes[0].nodeValue; 
      itemName=item[i].getElementsByTagName("ItemName")[0].childNodes[0].nodeValue; 
      document.getElementById("reportAhcc_Item_ID_S").options[i]=new Option(itemName,itemId); 
     } 
    } 
    else 
    { 
     document.getElementById("reportAhcc_Item_ID_S").options[0]=new Option(itemName,itemId); 
    } 
} 

下面的代碼來創建組合框

$("#reportAhcc_Item_ID_S").combobox() 

從列表中獲取所選的項目,我用

var getItem = $("#reportAhcc_Item_ID_S option:selected").text(); 

聽到我面臨problem.Always它取第一個記錄列表。

您能否幫助您如何從列表中獲取所選項目?

與問候, 錢德拉塞卡

+0

格式正確下一次你的代碼! – CoolEsh 2011-02-25 08:19:33

+0

你的'updateItem'函數似乎沒有從jQuery中獲益太多。 – 2011-02-25 08:24:17

+0

我怎樣才能繼續沒有updateItem功能 – Chandu 2011-02-25 08:56:35

回答

0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
    <script src="../Scripts/jquery-1.7.1.min.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $('#btnUpdateItem').click(function() { 
       updateItem(); 
      }); 
     }); 

     function updateItem() { 
      var xml = '<?xml version="1.0" encoding="utf-8" ?><Items><Item><ItemId>1</ItemId><ItemName>A</ItemName></Item><Item><ItemId>2</ItemId><ItemName>B</ItemName></Item><Item><ItemId>3</ItemId><ItemName>C</ItemName></Item><Item><ItemId>4</ItemId><ItemName>D</ItemName></Item><Item><ItemId>5</ItemId><ItemName>E</ItemName></Item></Items>'; 

      var data = $($.parseXML(xml)); 
      var objSelect = $('select#reportAhcc_Item_ID_S'); 
      objSelect.html(''); 

      if (data.find('Item').length > 0) { 
       data.find('Item').each(function (i) { 
        objSelect.append($('<option />', { 'value': $(this).find('ItemId').text(), 'text': $(this).find('ItemName').text() })); 
       }); 
      } 
      else { 
       objSelect.append($('<option />', { 'value': 0, 'text': '--' })); 
      } 
     } 
    </script> 
</head> 
<body> 
    <select id="reportAhcc_Item_ID_S" style="width: 100px;"> 
     <option value="1">a</option> 
     <option value="3">b</option> 
     <option value="4">c</option> 
    </select> 
    <br /> 
    <br /> 
    <br /> 
    <br /> 
    <br /> 
    <br /> 
    <br /> 
    <br /> 
    <br /> 
    <input type="button" id="btnUpdateItem" value="Update Items" /> 
</body> 
</html> 
+0

這個輸出u需要或其他一些要求... – Thulasiram 2012-05-03 12:53:21

+0

爲現場演示看到這個鏈接:http://jsfiddle.net/nanoquantumtech/FqYDx/ – Thulasiram 2012-05-03 12:59:53

0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
    <script src="../Scripts/jquery-1.7.1.min.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $('#btnUpdateItem').click(function() { 
       updateItem(); 
      }); 
     }); 

     function updateItem() { 
      var xml = '<?xml version="1.0" encoding="utf-8" ?><Items><Item><ItemId>1</ItemId><ItemName>A</ItemName></Item><Item><ItemId>2</ItemId><ItemName>B</ItemName></Item><Item><ItemId>3</ItemId><ItemName>C</ItemName></Item><Item><ItemId>4</ItemId><ItemName>D</ItemName></Item><Item><ItemId>5</ItemId><ItemName>E</ItemName></Item></Items>'; 

      var data = $($.parseXML(xml)); 

      var objSelect = $('select#reportAhcc_Item_ID_S'); 
      var selectedValue = objSelect.val(); 
      objSelect.html(''); 

      if (data.find('Item').length > 0) { 
       data.find('Item').each(function (i) { 
        objSelect.append($('<option />', { 'value': $(this).find('ItemId').text(), 'text': $(this).find('ItemName').text() })); 
       }); 

       objSelect.val(selectedValue); 
      } 
      else { 
       objSelect.append($('<option />', { 'value': 0, 'text': '--' })); 
      } 
     } 
    </script> 
</head> 
<body> 
    <select id="reportAhcc_Item_ID_S" style="width: 100px;"> 
     <option value="1">A</option> 
     <option value="2" selected="selected">B</option> 
     <option value="3">C</option> 
    </select> 
    <br /> 
    <br /> 
    <br /> 
    <br /> 
    <br /> 
    <br /> 
    <br /> 
    <br /> 
    <br /> 
    <input type="button" id="btnUpdateItem" value="Update Items" /> 
</body> 
</html> 
+0

爲現場演示看到這個鏈接:http: //jsfiddle.net/nanoquantumtech/HXQKH/ – Thulasiram 2012-05-03 13:03:47