Fix: jQuery is already loaded in Shiny apps

docs/supported_editors.md

@@ -47,15 +47,23 @@ because otherwise the notebooks do not display the interactive tables when they
 
 To get the HTML representation of a Pandas DataFrame `df` as an interactive [datatable](https://datatables.net/), you can use `to_html_datatable` as below:
 ```python
-from itables import to_html_datatable as DT
+from itables import to_html_datatable
 from itables.sample_dfs import get_countries
 
 df = get_countries()
-html = DT(df)
+html = to_html_datatable(df)
 ```
 
 # Using ITables in Shiny
 
-You can use ITables in Web applications generated with [Shiny](https://shiny.rstudio.com/py/) for Python, see our [tested examples](https://github.com/mwouts/itables/tree/main/tests/sample_python_apps).
+You can use ITables in Web applications generated with [Shiny](https://shiny.rstudio.com/py/) for Python with e.g.
+```python
+from shiny import ui
+from itables.shiny import DT
+
+ui.HTML(DT(df))
+```
+
+See also our [tested examples](https://github.com/mwouts/itables/tree/main/tests/sample_python_apps).
 
-ITables can't be used in Dash because jQuery is not usable in Dash (see the [Dash FAQ](https://dash.plotly.com/faqs)).
+ITables won't work in Dash because jQuery is not usable in Dash (see the [Dash FAQ](https://dash.plotly.com/faqs)).

itables/javascript.py

@@ -238,7 +238,9 @@ def _datatables_repr_(df=None, tableId=None, **kwargs):
     return to_html_datatable(df, tableId, connected=_CONNECTED, **kwargs)
 
 
-def to_html_datatable(df=None, caption=None, tableId=None, connected=True, **kwargs):
+def to_html_datatable(
+    df=None, caption=None, tableId=None, connected=True, import_jquery=True, **kwargs
+):
     """Return the HTML representation of the given dataframe as an interactive datatable"""
     # Default options
     for option in dir(opt):
@@ -324,6 +326,14 @@ def to_html_datatable(df=None, caption=None, tableId=None, connected=True, **kwa
     else:
         output = read_package_file("html/datatables_template.html")
 
+    if not import_jquery:
+        assert (
+            connected
+        ), "In the offline mode, jQuery is imported through init_notebook_mode"
+        output = replace_value(
+            output, "    import 'https://code.jquery.com/jquery-3.6.0.min.js';\n", ""
+        )
+
     tableId = tableId or str(uuid.uuid4())
     if isinstance(classes, list):
         classes = " ".join(classes)

itables/shiny.py

@@ -0,0 +1,17 @@
+from .javascript import to_html_datatable
+
+
+def DT(df, caption=None, tableId=None, **kwargs):
+    """jQuery is already loaded in Shiny applications
+
+    Cf. https://github.com/mwouts/itables/issues/181
+    and https://github.com/rstudio/py-shiny/issues/502
+    """
+    return to_html_datatable(
+        df,
+        caption=caption,
+        tableId=tableId,
+        connected=True,
+        import_jquery=False,
+        **kwargs
+    )

tests/sample_python_apps/itables_in_a_shiny_app.py

@@ -1,7 +1,7 @@
 from shiny import App, ui
 
-from itables import to_html_datatable as DT
 from itables.sample_dfs import get_countries
+from itables.shiny import DT
 
 df = get_countries()
 

tests/sample_python_apps/itables_in_a_shiny_app_with_tabs.py

@@ -1,7 +1,7 @@
 from shiny import App, ui
 
-from itables import to_html_datatable as DT
 from itables.sample_dfs import get_dict_of_test_dfs
+from itables.shiny import DT
 
 app_ui = ui.page_fluid(
     # Display the different tables in different tabs