【问题标题】:How to disable the sorting click on table header when server side data is still processing?当服务器端数据仍在处理时,如何禁用对表头的排序单击?
【发布时间】:2010-10-21 10:23:10
【问题描述】:

我正在做server side sorting in datatable plugin。数据加载需要 4-5 秒,同时如果用户点击其他标题会再次触发 AJAX 调用。

当服务器端数据仍处于处理状态时,如何限制用户?是否有任何初始功能可以检查自定义标志状态并停止可排序直到处理完成?

【问题讨论】:

  • 您好,您对此有什么收获吗?我针对您的问题发布了一个经过测试且准确的解决方案,但我们没有收到关于您所做的事情和发生的事情以及您的问题是否已解决的反馈。你能告诉我们吗?

标签: jquery sorting datatables


【解决方案1】:

当您第一次收到请求时,请禁用该按钮。然后在服务器完成时触发的回调函数中启用按钮。你就是这样做的,但是如果你想要代码,那就给代码。

【讨论】:

  • 我相信他是在问如何实现这一目标,而不是他可以尝试做什么。 “请帮助我在服务器端数据仍处于处理状态时如何限制用户。是否有任何初始功能可以检查自定义标志状态并停止可排序直到处理完成。??”
  • 我告诉他如何实现。当我们获得的唯一环境细节是“jquery”时,很难提供实现。
  • 嗨,这里的问题是如何禁用数据表点击触发排序的标题?即使我可以设置标志并实现相同但这里的问题是如何暂时禁用表头单击。
  • 另外,请查看我提供的数据表服务器端链接。
  • @EMMERICH 他似乎已经知道如何实现他想要的,只是不知道如何实际去做。我提供了一个解决方案,该解决方案几乎适用于他正在使用的任何代码,但没有获得赞成票:(@janardhan“这里的问题是如何暂时禁用表头单击”这就是隐藏元素的作用。当它被隐藏时无法点击,点击事件不会触发。问题是如何选择该元素?或者你想要一种它仍然显示但不可点击的方式?
【解决方案2】:

只是一个小提示:

  • 设置async: false
  • 禁用排序按钮
  • 在成功请求时启用它们

【讨论】:

  • async: false 无济于事,如果用户无法单击按钮(已禁用),则不会有任何区别(可能是缓慢/挂起页面响应除外)。如果用户可以点击按钮,请求仍然会堆积起来,以便在当前请求完成时发送出去。
【解决方案3】:

如果我没记错的话,jquery 有 3 个函数,例如 ajaxStart()ajaxError()ajaxComplete()

只需在 ajaxStart 时禁用整个网格/只禁用网格标题,然后在 ajaxError(您可以在其中进行一些错误处理)或 ajaxComplete 时再次启用它。

【讨论】:

    【解决方案4】:

    有多种方法可以做到这一点,最简单的取决于您的代码。

    $(document).ajaxSend( function(){
       $('controls_selector').hide();
    }).ajaxComplete( function(){
       $('controls_selector').show();
    });
    

    这将执行此操作,但是这将在您页面上的任何 ajax 事件期间禁用它们。该文档描述了如何使用回调函数的参数来确定 ajax 调用的性质并有选择地显示/隐藏这些元素。

    这样您就可以避免深入研究和使用插件的代码。

    更新

    关键点似乎是您不想隐藏元素,您想要一种暂时禁用事件处理程序的方法,并且由于它们隐藏在数据表中,您不想修改它们。我会做以下事情:

    var tableheadclone = $('#mytableid thead>tr>th').clone(true);
    

    然后将该克隆写入其他地方并将其隐藏(或将其保存在全局 js 变量中)。然后你可以使用

    $('#mytableid thead>tr>th').unbind('click');
    

    删除事件处理程序。

    您可以使用replaceWith() jQuery 函数重新启用事件处理程序。

    【讨论】:

    • 请参考我上面的cmets。有没有办法可以将点击绑定到整个父级,这样排序插件就不会检测到子点击。我发现捕获模式存在一些限制(opp 冒泡)
    • 我更新的答案为您的问题提供了完整的解决方案。如果你不知道如何实现它,我们需要更多细节。
    猜你喜欢
    • 1970-01-01
    • 2017-12-28
    • 1970-01-01
    • 1970-01-01
    • 2023-03-14
    • 1970-01-01
    • 1970-01-01
    • 2016-09-08
    • 2014-10-06
    相关资源
    最近更新 更多