简体   繁体   中英

Disable hyperlink in jqgrid based on another column value

I have a jqgrid where the first column has some number which is a hyperlink. On click i am using formatter:linkfmatter and sending the rowid to the back end using ajax call.

Now my requirement is if column B is 0 i want the column A to be a hyperlink but when the Column B of that particular row is 1 i want Column B hyperlink to be disabled.

Can someone tell me if it is possible at all using javascript-jquery and point me in right direction? Here is my Code for the jqgrid

$("#tblJQGridCCVT").jqGrid({
    url: "@Url.Action("MyAction", "MyController")" + "?Parameters=" + Params + "",
    datatype: "json",
    mtype: 'GET',
    cache: false,
    async: false,
    colNames: ['A', 'B', 'C', 'D', 'E','F', so on...],//nearly 30 columns
    colModel: [
        { name: 'A', index: 'A', width: 150, edittype: 'select', formatter: linkFmatter },
        { name: 'B', index: 'B', width: 150 },
        { name: 'C', index: 'C', width: 150 },
        { name: 'D', index: 'Updated By', width: 150 },
        { name: 'E', index: 'E', width: 150 },
        { name: 'F', index: 'F', width: 150 },
        So on 
            ...
            ...
            ...
    ],
    pager: $('#pager'),
    height:300,
    rowNum: 10,
    sortorder: "desc",
    sortname: 'ResponseId',
    viewrecords: true,
    sortable: true,
    loadonce: true, 
    forceClientSorting: true,
    ignoreCase: true,
    caption: "Summary"
});
$("#tblJQGridCCVT").jqGrid('navGrid', '#pager', { view: false, del: false, add: false, edit: false, search: true, refreshtext: "Refresh" }, { closeOnEscape: true, multipleSearch: true, closeAfterSearch: true }, {}, {}, {});
$("#tblJQGridCCVT").jqGrid('filterToolbar', { stringResult: true, searchOnEnter: false, defaultSearch: 'cn' });

function linkFmatter(cellvalue, options, rowObject) {
    var selectedCellValue = cellvalue;
    var selectedRowId = options.rowId;
    return '<a href="javascript:MethodJS(' + selectedRowId + ')" style="color: #3366ff" id="' + selectedRowId + '" >' + selectedCellValue + '</a>';
}


function MethodJS(selectedRowId) {
    $.ajax({
        async: false,
        type: "POST",
        contentType: "application/json; charset=utf-8",
        url: "@Url.Action("GetDetailedViewOfResponsesForEdit", "ViewResponseDetailsCCVT")",
        data: "{RowId:'" + selectedRowId + "'}",
        success: function (Result) {
            if (Result == "Success") {
                var url = window.location.href;
                window.location.href = "@Url.Action("ResponseDetailsEditForCCVT", "ViewResponseDetailsCCVT")";
            } 
        }
    });
}

You have row data in rowObject parameter. You can use this like following.

function linkFmatter(cellvalue, options, rowObject) {
    if (rowObject.B == 0) {
        var selectedCellValue = cellvalue;
        var selectedRowId = options.rowId;
        return '<a href="javascript:MethodJS(' + selectedRowId + ')" style="color: #3366ff" id="' + selectedRowId + '" >' + selectedCellValue + '</a>';
    }

    return cellvalue
}

DEMO HERE

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM