2011-02-25 67 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