在 JQGrid 中创建链接答案

【问题标题】：Creating a link in JQGrid在 JQGrid 中创建链接
【发布时间】：2014-03-12 06:40:06
【问题描述】：

我需要在我的 JQgrid 中创建一个列的所有单元格，一个链接，它调用一个带有单元格值的 javascript 函数，以便在服务器端传递一些查询。我见过html link column in jqGrid 但这行不通。这是我所拥有的，

colModel:[
{name:'name',width:300,formatter:link}
]

链接函数是

function link(cellvalue, options, rowObject) {


alert('<a href="javascript:logForProv(\''+cellvalue+'\',\''+$('#datepicker1').val()+'\',\''+$('#datepicker2').val()+'\');">');
return "<a href='javascript:logForProv(\''+cellvalue+'\',\''+$('#datepicker1').val()+'\',\''+$('#datepicker2').val()+'\');'>";
        }

这样做我在列中没有得到任何数据，我还尝试使用预定义的格式化程序链接和 showlink，但它们将 href 和 id 附加到搞砸的 URL。

请帮忙。

【问题讨论】：

你能把logForProv函数的代码贴出来吗？
该函数进行ajax调用，当我不使用jqgrid并将链接直接附加到表时，它工作正常，问题必须在它之外。

标签： javascript jquery jqgrid

【解决方案1】：

当点击providerId编辑栏时，您将重定向到editProvider的编辑页面。在providerId colModel 中提及formatter: editLink 以调用editLink 函数。这样在jqGrid中创建链接。

代码：

$(document).ready(function(){
        //jqGrid
        $("#providerList").jqGrid({
            url:'<%=request.getContextPath() %>/Admin/getProvidersList',
            datatype: "json",               
            colNames:['Id','Edit','Provider Name'],
            colModel:[
                {name:'providerId',search:false,index:'providerId',hidden:true},
                {name:'providerId',search:false,index:'providerId', width:30,sortable: false, formatter: editLink},
                {name:'providerName',index:'providerName', width:200},
                rowNum:20,
                rowList:[10,20,30,40,50],
                rownumbers: true,  
                pager: '#pagerDiv',
                sortname: 'providerName',  
                viewrecords: true,  
                sortorder: "desc",  
        }); 
        $('#gridContainer div:not(.ui-jqgrid-titlebar)').width("100%");
        $('.ui-jqgrid-bdiv').css('height', window.innerHeight * .65);
        $('#load_providerList').width("130");   
        $("#providerList").jqGrid('navGrid','#pagerDiv',{edit:false,add:false,del:false},{},{},{}, {closeAfterSearch:true});
        $(".inline").colorbox({inline:true, width:"20%"});
    });
    function editLink(cellValue, options, rowdata, action)
    {
        return "<a href='<%=request.getContextPath()%>/Admin/editProvider/" + rowdata.providerId + "' class='ui-icon ui-icon-pencil' ></a>";
    }

【讨论】：

谢谢。很好的例子

【解决方案2】：

函数logForProv 必须在全局（顶级）级别定义。

我建议您尝试更好的formatter: "dynamicLink"，而不是我描述的here，您可以从here（jQuery.jqGrid.dynamicLink.js 文件）下载。它允许以非常简单和灵活的方式在 jqGrid 中构建链接。您可以在formatoptions 中定义onClick 回调（参见the demo）。回调提供rowId、iRow、iCol、cellValue和e作为参数。

【讨论】：

谢谢你，你的答案写得很好，我使用格式化程序中的一个函数解决了这个问题，它返回了锚点，它起作用了，没有使用链接和 showlink，你为什么说这个函数需要但是，在全球范围内，这是一个好习惯吗？
@SKaul：不客气！如果您在href 中使用JavaScript 函数，那么函数必须定义为全局。最好减少全局原因函数的使用。您写道，您的原始代码不起作用。我想你已经将logForProv 定义为全局（不在顶层）。