Question

我有一个增强的网格，我想编辑网格内容，一旦点击更新链接，我必须将新输入的值传递给java spring控制器，我有逻辑在数据库中保存更新的值。但问题是在我输入增强网格中的值后，我需要点击网格中的某个位置或者将焦点放在其他字段上，以便将新输入的值传递给弹簧控制器。如果我键入新值并且单元格处于编辑模式并直接单击网格第4列中的UPDATE链接，则旧值将传递给弹簧控制器。请建议进行哪些更改，以便一旦鼠标离开单元格的焦点，新键入的值应保存在存储中，并且当在网格的第4列上单击UPDATE链接时，该值应发送到spring控制器。

请找小提琴：http://jsfiddle.net/740L0y43/7/

增强的网格代码：

require(['dojo/_base/lang', 'dojox/grid/EnhancedGrid', 'dojo/data/ItemFileWriteStore', 'dijit/form/Button', 'dojo/dom', 'dojo/aspect', 'dojo/domReady!'],

function (lang, EnhancedGrid, ItemFileWriteStore, Button, dom, aspect) {
    /*set up data store*/
    var data = {
        identifier: "id",
        items: [{
            id : 1,
            col2 : "aa",
            col3 : "bb",
            col4 : "cC"
         }]
    };

    var store = new ItemFileWriteStore({
        data: data
    });

    /*set up layout*/
    var layout = [
        [{
            'name': 'Column 1',singleClickEdit:'true', editable:'true',
                'field': 'id',
                'width': '100px'
        }, {
            'name': 'Column 2',singleClickEdit:'true', editable:'true',
                'field': 'col2',
                'width': '100px'
        }, {
            'name': 'Column 3',singleClickEdit:'true', editable:'true',
                'field': 'col3',
                'width': '200px'
        }, {
            'name': 'Column 4',formatter: updateDetails,
                'field': 'col4',
                'width': '150px'
        }]
    ];

    /*create a new grid*/
    var grid = new EnhancedGrid({
        id: 'grid',
        store: store,
        structure: layout,
        sortInfo: -1,

    });


    /*append the new grid to the div*/
    grid.placeAt("gridDiv");

    /*Call startup() to render the grid*/
    grid.startup();

    aspect.after(grid, 'renderRow', grid.sort);

    var id = 2;

    var button = new Button({
        onClick: function () {
            console.log(arguments);
            store.newItem({
                id: id,
                col2: "col2-" + id,
                col3: "col3-" + id,
                col4: "col4-" + id
            });
            id++;
        }
    }, "addRow");
});

   var updateDetails = function(value, rowIndex) {
        var col2 = this.grid.getItem(rowIndex).col2;
       alert("col2 updated value : " + col2);
     return "<a href=\"<%=request.getContextPath()%>/updateInfo.htm?col2="+col2 +"\">" + "UPDATE";
            };

弹簧控制器代码：

    @RequestMapping(value = "/updateInfo", method = RequestMethod.GET)
    public ModelAndView updateInfo(HttpServletRequest request,
        HttpServletResponse response, @ModelAttribute MyDTO myDto,
            @RequestParam("col2") String col2, @RequestParam("col2") String col2){

    System.out.println("col2 value: " + col2);
    System.out.println("col3 value: " + col3);

    //when i type some value in COlumn2/Column3 of enhanced grid and column is still in edit mode then on click of UPDATE , new value is not passed to spring controller, its passing the old value.
...
    ...
    //logic to save in DB


    }

Answer 1

这一行：

     return "<a href=\"<%=request.getContextPath()%>/updateInfo.htm?col2="+col2 +"\">" + "UPDATE";

返回一个锚点，其中href为“/contextPath/updateInfo.html?col2=aa”。这就是它，那是它;该URL永远不会改变。然后，当您单击UPDATE时，它会发送呈现页面时的内容，而不是表中当前值的内容。

如果你想要发送当前值，你应该让你的href为“＃”并且像这样有一个onclick =“updateValue（1）”：

<a href="#" onclick="updateValue(1)">UPDATE</a>

其中1是行号。

然后，在更新值函数中，您将发送ajax请求以更新该值。由于您正在使用dojo，请查看：http://dojotoolkit.org/documentation/tutorials/1.8/ajax/

这是你的函数可能是什么样的（一些伪代码，一些描述行为的注释）：

function updateValue(rowNum){
    //var row = data.items.getRow(rowNum); or something like this
    //Call ajax here and send the new row values
}

Answer 2

在与dojo混淆了大约一个小时后，与dojo的范围进行斗争以及如何调用可以访问数据网格和/或它的数据存储的功能（抱歉......我有0在此问题之前使用道场的经验）...这是你的简单出路，OP：

http://jsfiddle.net/hm8gpz6o/

重要部分：

在更新数据存储时，EnhancedGrid NOT 重新呈现格式化程序生成的单元格。这似乎是道场的EnhancedGrid的一个问题。

我添加了以下内容（更新单元格时将触发onApplyCellEdit）：

/*create a new grid*/
var grid = new EnhancedGrid({
    id: 'grid',
    store: store,
    structure: layout,
    sortInfo: -1,
    onApplyCellEdit: function(inValue, inRowIndex, inFieldIndex){
        refreshGrid();
    }
});

最后，refreshGrid（）将强制重新渲染整个网格。我讨厌我必须这样做：
```
function refreshGrid(){
    grid.startup();   
}    
```

请参阅完整工作示例的小提琴。

java弹簧控制器中未显示网格中的更新值

2 个答案: