2 questions about responsive

2 questions about responsive

YoDavishYoDavish Posts: 123Questions: 46Answers: 3

I have editor v 1.9.6, I have this code below in the js file

responsive: {
details: {
display: $.fn.dataTable.Responsive.display.modal( {
header: function ( row ) {
var data = row.data();
return 'Notes for ' +data['task']['barcode'] ;
}
}),
renderer: $.fn.dataTable.Responsive.renderer.tableAll()
}
},

  1. Can I move the positioning of the "responsive" button from the first column to say the 4th or 5th column?
  2. Rather than rendering all of the table data, can I perform a separate ajax call to request data from another table to display it's return data in the pop up modal?

This question has an accepted answers - jump to answer

Answers

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    Yep, both are possible:

    1. You can useresponsive.details.target to specify an alternative column
    2. responsive.details.renderer can display the data however you like. The last example on that page would be a good place to start,

    Colin

  • YoDavishYoDavish Posts: 123Questions: 46Answers: 3

    @colin
    Thanks I got #1 question working now. But I'm unable to get #2 question to work, I'm hoping to use a create a new ajax call to request data from another table to display the data. Is there an example of that? Currently I am to display either visible data or hidden data like the example.

  • YoDavishYoDavish Posts: 123Questions: 46Answers: 3

    @colin
    I see in this forum post:

    https://datatables.net/forums/discussion/35568/ajax-in-render-function

    That it's not recommended to put an ajax call inside a render function as it will slow down performance. Since the data I want to display is in a different table. How should include this data so I could render it?

  • kthorngrenkthorngren Posts: 20,144Questions: 26Answers: 4,736
    edited July 2021 Answer ✓

    That it's not recommended to put an ajax call inside a render function as it will slow down performance.

    That thread is referring to columns.render which runs for each row and will drastically slow down rendering a table if ajax is called for each row. In your case you are using responsive.details.renderer when a row is clicked, fetching some data via ajax wouldn't be a big performance hit like using ajax in columns.render.

    To use ajax with responsive.details.renderer you will need to take into consideration the asynchronous nature of Ajax. You will need to immediately return something that responsive.details.renderer can display like a table element. Then in the ajax success function append the data you want to that element. Here is one example:
    http://live.datatables.net/kipijaxa/1/edit

    The example is fetching the full 57 example rows from server but is only displaying the first row returned which is Tiger Nixon.

    Kevin

Sign In or Register to comment.