Jqgrid使用传递参数将删除按钮绑定到javascript函数

时间:2012-09-20 08:50:53

标签: jquery asp.net-mvc asp.net-mvc-3 jqgrid jqgrid-asp.net

我有一个jqgrid我正在使用格式化程序作为

{ name: 'Delete', width: 40, formatter: self.deleteBtnFormatter }

其中deleteBtnFormatter如下:

  deleteBtnFormatter: function (cellvalue, options, rowdata) {
    var self = this;        
    if (cellVale== "Yasser") {
        return "<div class='abc'>-</div>";
    }
    else {
        var deleteBtnId = // i am getting this from rowData
        var deleteButton = "<div class='xyz'" + "id='" + deleteBtnId + "' >Delete<div>";        

        return deleteButton;
    }

 },

现在我的问题是如何将所有这些删除按钮绑定到另一个javascript方法,从那里我将进行ajax调用以删除此条目。

另外我注意到我想将参数传递给javascript方法。

我知道可以使用Url.Action或使用href属性来完成此操作,但我想将其绑定。

由于

1 个答案:

答案 0 :(得分:1)

你可以使用以下格式化程序javascript函数:

function deleteformatter(cellvalue, options, rowdata)
{
var id = // i am getting this from rowData
return "<input style='height:17px;width:17px;'  type='image' src='../Images/delete-icon.png' title='Remove' onclick=\"javascript:Delete_Click(this,id);\"/>";
}
// you can use ajax call rather to use this jqgrid delete function.
function Delete_Click(imgbtn,id){        
    HideError();
    var url = ""//function that you want to call
    jQuery("#jqgridId").jqGrid('delGridRow', id, { top: 230, left: 350, height: 110, reloadAfterSubmit: true, url: url,
                afterComplete : function () {
                    $('#jqgridId').trigger('reloadGrid');                        
                }
            });
}

您可以将以下函数替换为ajax调用以删除网格条目。

    jQuery("#jqgridId").jqGrid('delGridRow', id, { top: 230, left: 350, height: 110, reloadAfterSubmit: true, url: url,
                afterComplete : function () {
                    $('#jqgridId').trigger('reloadGrid');                        
                }
            });

以下是ajax调用的示例:

        $.ajax({
            url: url,
            type: "POST",
            data: JSON.stringify({ ID: id }), 
            dataType: 'json',
            contentType: "application/json; charset=utf-8",
            error: function (xhr, status, error) {
                var error = extractError(xhr);
            },
            success: function (data) {

            }
        });