如何实现在原来的地方更新某行的内容，不跳转到别的页面

Question

rt，比如像.net里面的gridview的功能，当需要更新内容的时候，点击更新，改行的内容就显示在一个表单里面，更新完了之后点击确定就可以了。想问一下，如何实现gridview的这种功能，比如在其他的语言里面。用javascript或者什么方式可以实现吗？虚心请教！

Answer 1

唉 我不是不知道ajax这种异步交互方式啊，我是想知道 如何在更新的那条记录后面点击更新 就变成了可以编辑的表单状态，编辑完了之后用ajax进行异步处理。重点貌似不是在数据的处理上，而是表现形式上了！

Answer 2

vbs就可以了，不过要用到页面跳转
在显示记录的时候在前面加<a href="处理页面.asp?action=edit&id=<%=记录id1%>">记录1</a>在 处理页面.asp 处理之后在history.back()回到原来的页面

Answer 3

javascript就是前端脚本语言，通过控制dom完全可以达到你要的效果，但是要写得优雅需要花时间，你也可以用ext之类的框架简化工作量，只是现在有点忙呵呵，有机会写个demo给你

Answer 4

你的意思我基本上懂了，你这个还是实现了刷新的，呵呵，虽然我用jsp写！

Answer 5

呵呵 是啊！我在想是不是通过给每行动态给一个id值，然后javascript获取id值之后 动态的给原来所在行创 表单对象 将原来的value赋值给表单 然后更新之后用ajax处理数据！
没有尝试过这么做 也不知道是否可行！

Answer 6

var GridTemplete = {
    currentEditRow: null,
    changeFlag: "",
    errorFlag: false,
    dataFlag: "",
    index: 1,
    EditRow: function (row) {
        if (event.srcElement.tagName == "TD") {
            if (GridTemplete.currentEditRow != null) {
                GridTemplete.SaveRow(row);
            }
            else {
                GridTemplete.Complete(row);
            }
        }
    },
    SaveRow: function (row) {        if (GridTemplete.changeFlag == true) {
            var data = {
                "fld_ID": $(GridTemplete.currentEditRow).attr("id"),
                "name": $("#name").val().trim(),
                "": $("#").val().trim(),
                "score": $("#score").val().trim(),
                "questionID": $(GridTemplete.currentEditRow).attr("questionID"),
                "action": "edit"
            };
            //GridTemplete.Save(data, row);
            GridTemplete.Complete(row);
        } else {
            GridTemplete.Complete(row);
        }
    },
    Complete: function (row) {
        if (GridTemplete.currentEditRow != null) {
            GridTemplete.InitRow(GridTemplete.currentEditRow);
        }
        if (row == null) {
            GridTemplete.currentEditRow = null;
            GridTemplete.changeFlag = false;
        } else {
            GridTemplete.StartEdit(row);
            GridTemplete.currentEditRow = row;
            GridTemplete.changeFlag = false;
        }
    },
    StartEdit: function (row) {        if (!row) {
            return;
        }        cell = $(row).children().eq(1);
        var name = $(cell).text().trim();
        cell.html("<textarea id='name' class='textarea' onchange='javascript:GridTemplete.DoChange();'>" + name + "</textarea>");        cell = $(row).children().eq(2);
        var  = $(cell).text().trim();
        cell.html("<textarea id='' class='textarea' onchange='javascript:GridTemplete.DoChange();'>" +  + "</textarea>");        cell = $(row).children().eq(3);
        var score = $(cell).text().trim();
        cell.html("<input  id='score' onkeydown='EV.Page.KeyDown(this);' onchange='javascript:GridTemplete.DoChange();' value='" + score + "' size='2' />")
    },
    InitRow: function (row) {
        if (row == null)
            return;        cell = $(row).children().eq(1);
        cell.html($("#name").val());        cell = $(row).children().eq(2);
        cell.html($("#").val());        cell = $(row).children().eq(3);
        cell.html($("#score").val());        GridTemplete.currentEditRow = null;
    },
    DoChange: function () {
        GridTemplete.changeFlag = true;
    },
    Save: function (data, row) {
        //aler();
        $.ajax({
            type: "post",
            url: "Ajax.aspx",
            data: data,
            success: function (rt) {
                if (rt == "success") {
                    GridTemplete.Complete(row);
                    Ext.Msg.show({ msg: "修改成功", title: "提示消息" });
                } else if (rt == "fail") {
                    Ext.Msg.show({ msg: "修改失败", title: "提示消息" });
                }
                setTimeout("Ext.Msg.hide()", 1500);
            },
            error: function () {
                alert(0);
            }
        });    }
};
<table>
<tr onclick='GridTemplete.EditRow(this); '>
<td>编号1</td>
<td>s</td>
<td>f</td>
<td>0</td>
</td>
</tr>
<tr onclick='GridTemplete.EditRow(this); ' title='单击可以编辑'>
<td>编号1</td>
<td>s</td>
<td>f</td>
<td>90</td>
</td>
</tr>
<td>编号2</td>
<td>sf</td>
<td>fd</td>
<td>100</td>
</td>
</tr>
</table>

Answer 7

你先把ajax的知识学一学，就会了。