rowclick 事件以修改 dojo 网格中的下拉值

Question

我的要求是当我点击增强网格中的任何一行时，下拉菜单中的值应该改变，就像当我点击第 1 行时，下拉列表中的第一个选项应该显示，当我点击 row2 时，第二个选项应该在用户点击 row2 时立即显示在下拉列表中，对于其他行也是如此......请找到 fiddle http://jsfiddle.net/x9kLbqz5/4/.

每当用户单击任何 row.Below 代码时，我都可以获取行信息：

    dojo.connect(grid, "onRowClick", function(evt){
     var idx = evt.rowIndex,
    item = this.getItem(idx);
   dojo.byId("results").innerHTML = "You have clicked on " 
                    + this.store.getValue(item, "id");
            });

但问题是我无法继续编写 javascript 以根据用户单击的行更改下拉菜单值。另一个要求是行应该是可编辑的，这是在定义列时使用 editable:'true' 实现的。请建议我如何显示根据 user.Thanks.

单击的行更改的下拉菜单列表值

--编辑--

我的实际要求是当我单击网格中的任何行时，获取第 1 列值并点击 spring 控制器，以便基于该值 spring 控制器 returns 下拉菜单我需要在下拉菜单中显示的值。请参阅 fiddle : http://jsfiddle.net/x9kLbqz5/7/ 但问题是当我调用 javascript 函数 getDropDownValue(id);在 dojo.connect(grid, "onRowClick", function(evt) 中，行不再可编辑，我希望该行也被编辑并调用javascript 函数，以便我可以 ajax 调用 spring 控制器以获取动态下拉值并显示在下拉列表中。

        dojo.connect(grid, "onRowClick", function(evt){
         var idx = evt.rowIndex,
        item = this.getItem(idx);
       dojo.byId("results").innerHTML = "You have clicked on " 
                        + this.store.getValue(item, "id");
            var id = this.store.getValue(item, "id");
            alert("item:" + id);
getDropDownValue(id);       
                });

function getDropDownValue(ColumnValue){
    alert("getDropDownValue");
    //ajax call to hit spring controller and get the dropdown value
    var column1 = columnValue;
        var xmlHttp;  
        if (window.XMLHttpRequest)
        {
            xmlHttp= new XMLHttpRequest();
        }
        else if (window.ActiveXObject)
        {
            xmlHttp= new ActiveXObject("Microsoft.XMLHTTP");
        }
        var url = <%=request.getContextPath%>+"/getDropDownValue.htm?id="+column1;
        xmlHttp.onreadystatechange = function() {
            handleServerResponse(xmlHttp);
        };
        xmlHttp.open("GET", url, true);
        xmlHttp.send(null);

        function handleServerResponse(xmlHttp)
        {   
           if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
           {
              if (xmlHttp.responseText != "null")
              {
           //handle response
              }
           }   
        }
}

Answer 1

我更新了 JsFiddle (http://jsfiddle.net/x9kLbqz5/5/)。 1) SelectedIndex 将设置下拉列表中的值 2) editable : true 是布尔值而不是字符串。

谢谢斯里坎特

//Set the value in the dropdown
dojo.byId('a').selectedIndex = this.store.getValue(item, "id");
//Editable columns (double click or click +Enter)
var layout = [[
      {'name': 'Column 1', 'field': 'id', 'width': '100px'},
      {'name': 'Column 2', 'field': 'col2', 'width': '100px',editable:true},
      {'name': 'Column 3', 'field': 'col3', 'width': '200px',editable:true},
      {'name': 'Column 4', 'field': 'col4', 'width': '150px',editable:true},
      {'name': 'Last', 'field': 'last', 'width': '150px',editable:true}
    ]];

谢谢斯里坎特

rowclick 事件以修改 dojo 网格中的下拉值

rowclick event to modify dropdown value in dojo grid

html

javascript

dojo

drop-down-menu