jqGrid cellattr title在白色空格后忽略文本

时间:2013-05-17 17:49:47

标签: jquery jqgrid

我在jqgrid中有colmodel,它有'name'和'description'列,我需要在将鼠标悬停在'name'列上时将描述显示为工具提示。

说我有这个模型,例如:

colModel: [
    {
        name: "name",..
        cellattr: function (rowId, val, rawObject, cm, rdata) {
            return 'title=' + rawObject[1];
        }
    },
    {name : "description",..},
],

数据呈现为工具提示,但如果我的描述为“低级标准”,则工具提示为“低”。

理想情况下,它会忽略空格后的所有文本。

我该如何解决这个问题? 我是jqGrid的新手。 如果可能,请详细解释 感谢

2 个答案:

答案 0 :(得分:2)

您应该以空格开始返回值。 rawObject的确切格式可能取决于许多因素:填充网格数据的格式。因此,您应该验证是否应该使用rawObject[1]之类的索引或rawObject.description之类的名称。所以解决方案可能就像

cellattr: function (rowId, val, rawObject) {
    return ' title="' + rawObject[1] + '"';
}

或喜欢

cellattr: function (rowId, val, rawObject) {
    return ' title="' + rawObject.description '"';
}

取决于您使用的数据格式(以及rawObject的格式)。我在标题中添加了"

顺便提一下,我从回调中删除了cm, rdata因为我们不在那里使用。

答案 1 :(得分:0)

Oleg正确答案的一个补充:如果你需要多次应用工具提示,你可能想要声明一个这样的函数:

var addFullNameAsTooltip = function(rowId, val, rawObject, cm, rdata) {
    return ' title="' + rawObject.firstName + " " + rawObject.lastName + '"';
  };

并按以下方式使用:



// see: https://free-jqgrid.github.io/getting-started/
// CDN used: https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid
$(function() {

  var addFullNameAsTooltip = function(rowId, val, rawObject, cm, rdata) {
        return ' title="' + rawObject.firstName + " " + rawObject.lastName + '"';
      };

  $("#grid").jqGrid({
    autowidth: true, height: 45, 
    colNames: ['First name', 'Last name', 'Updated?'],
    colModel: [
      {name: "firstName", cellattr: addFullNameAsTooltip}, 
      {name: "lastName", cellattr: addFullNameAsTooltip}, 
      {name: "updated"}],
    data: [
      { id: 10, firstName: "Jane", lastName: "Doe", updated: "no"},
      { id: 20, firstName: "Justin", lastName: "Time", updated: "no" }
    ]
    
  });
});

<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<title>Canonical jqGrid example</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/themes/redmond/jquery-ui.min.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.15.2/css/ui.jqgrid.min.css"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.15.2/jquery.jqgrid.min.js"></script>

<table id="grid"></table>
&#13;
&#13;
&#13;

在上面的代码段中,全名作为工具提示添加到名字姓氏列。