【问题标题】:jquery datatable hiding icon within the table表格内的jquery数据表隐藏图标
【发布时间】:2018-01-19 17:02:56
【问题描述】:

我正在开发内联编辑功能。我想在列单元格中显示一个绿色复选标记,以指示记录已更新。但首先,我需要先隐藏它。

这是它目前的样子:

如您所见,当前显示数据表后会出现复选标记。

我需要隐藏那个绿色检查。

在我的 javascript 文件中,我首先尝试隐藏引用中的 ID。

$('#testID').hide();

我有一个创建数据表的函数(我没有包含调用函数并发送变量的事件处理程序 - 如果需要,请告诉我):

function displayRecords(salesRepSelectVal)
{
  var data = {
    salesRepSelectVal: {salesRepSelectVal}
  }

  $.ajax({
    url: 'api/massEditorSummary.php',
    type: 'POST',
    data: data,
    dataType: 'html',
    success: function(data, textStatus, jqXHR)
    {
      var jsonObject = $.parseJSON(data); 
      var table = $('#example1').DataTable({
        "data": jsonObject,
        "columns": [
            { "data": "service" },
            { "data": "sales_area" },
            {
              "data": "forecast",
              "fnCreatedCell": function (nTd, sData, oData, iRow, iCol)
              {
                $(nTd).html("<input type='text' class='form-control 
                editForecast' id='editForecast' data-uid='"+oData.UID+"' 
                data-editforecast='"+oData.forecast+"' value='"+oData.forecast+"' />
                <span id='testID'>
                <i class='fa fa-check' id='updatedIcon' aria-hidden='true' style='color:green;'> </i>
                </span>");
              }
            },
            { "data": "trade_lane" },
            // few more columns
        ],
        "paging": false,
        "scrollY": 550,
        "scrollX": true,
        "bDestroy": true,
        "stateSave": true,
        "autoWidth": false  
      });   
    },
    error: function(jqHHR, textStatus, errorThrown)
    {
      // some error stuff
    }
  });
}

如果您会在 ajax 调用的 SUCCESS 部分注意到,有一个带有 SPAN 的列,其 ID 称为 testID。这是生成数据表后我试图隐藏的 ID。

我试图放置 $('#testID').hide();函数内。我试图把它放在 SUCCESS 部分。我不确定我还能把它放在哪里来隐藏那个 ID。

如果可能的话,我能做些什么来完成这项工作?

【问题讨论】:

    标签: javascript jquery datatables hide


    【解决方案1】:

    添加显示:无;在这一行中,如下所示。

    <span id='testID_'+oData.UID style='display:none'>
                <i class='fa fa-check' id='updatedIcon_'+oData.UID aria-hidden='true' style='color:green;'> </i>
                </span>
    

    【讨论】:

    • 嗯,这很容易。不知道为什么我没有想到这一点。您的代码有效。谢谢你,先生。
    • 如果您还在那里,我将如何动态地将该样式从无更改为阻塞?就像在它被更新之后,从函数的更新中,我将如何改变这种风格?
    猜你喜欢
    • 1970-01-01
    • 2011-07-24
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-08-05
    相关资源
    最近更新 更多