-
Notifications
You must be signed in to change notification settings - Fork 60
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Row selection? #208
Comments
Oh I found this in the documentation: https://mwouts.github.io/itables/advanced_parameters.html#select-rows So it's not currently supported? Any way I could implement it myself? |
Thanks for looking into this! Do you think you could add the extension to the connected template https://github.com/mwouts/itables/blob/main/itables/html/datatables_template_connected.html ? That would be a great start ! |
Sorry I actually don't have the bandwidth to do a full PR, but I can document a hacky workaround I was able to figure out. I manually added the select extension js/css files and then I inject my own app_ui = ui.page_fluid(
ui.head_content(
ui.tags.link(rel="stylesheet", type="text/css", href="https://cdn.datatables.net/buttons/2.4.2/css/buttons.dataTables.min.css"),
ui.tags.script(src="https://cdn.datatables.net/1.10.24/js/jquery.dataTables.min.js"),
ui.tags.link(rel="stylesheet", type="text/css", href="https://cdn.datatables.net/select/1.7.0/css/select.dataTables.min.css"),
ui.tags.script(src="https://cdn.datatables.net/select/1.7.0/js/dataTables.select.min.js")
# custom js to send the selected row data to Shiny server
ui.HTML("""
<script>
const attachSelectHandler = function() {
setTimeout(function() { //hack to wait for the table to initialized
dt = $('table').DataTable();
dt.on('select', function (e, dt, type, indexes) {
if (type === 'row' && indexes.length > 0) {
// Send the selected row data to Shiny server
var index = indexes.pop();
console.log('selected index', index);
Shiny.setInputValue('selectedRow', index);
}
});
},2000);
};
$(document).ready(function () {
attachSelectHandler();
Shiny.addCustomMessageHandler("clearSelection", function(message) {
console.log('clearSelection');
Shiny.setInputValue('selectedRow', 0);
attachSelectHandler();
});
});
</script>
""")
...
) Then in my server code I can make sure to initialized def server(input, output, session):
async def clear_selection(): #this can be called to clear the selection from the server
await session.send_custom_message(type="clearSelection", message=None)
@render.ui
def ouput_df():
df = get_df()
dt_html = DT(df, select=True)
return ui.HTML(dt_html) I'll leave it to you if you want to keep the issue open! |
Thanks! Yes, please leave the issue open. Thanks for the Shiny code, I am sure it will be helpful to others until we can support extensions in |
Row selection is now supported (well, included in the default bundle) in |
Thank you for the great tool. I also see the select row is now available, but how can I get the selected row id? what is the input element I can use from Shiny? |
Thanks @maxmoro . Well while the |
Thank you @mwouts for the prompt reply. I perfectly understand. I was able to adapt the code above to get the row_id. I'm good for the moment, and I'm happy to test the updated select version as soon is out. |
Oh great! Can you share back how you do it? Thanks! |
Unfortunately my code it is not fully working, I didn't notice I was reloading the jquery library twice. (so multiple tables have been created)
Looking at the web, looks like the right library is not loaded. or we need a defer on jquery.dataTable.mins.js link Or, do you have any insight? |
Hey @michael-erasmus , I am finally coming back to this topic! In the PR #319 I have been able to do the following
There is one thing that I have not been able to do yet, that is to update the row selection using e.g.
Is that something that you are still interested in? I tried to add the following to
but that was not enough. Do you think we need to solve that? Note that passing |
I'll close this issue as Feel free to open another one re updating the row selection using a custom message! |
Actually using the |
I'm using itables in a Shiny app and I was wondering if there's a way I can implement row selection?
The text was updated successfully, but these errors were encountered: