Responsive is not working with Angular 8 implementation

Responsive is not working with Angular 8 implementation

rcarcassonrcarcasson Posts: 3Questions: 1Answers: 0

Link to test case: N/A
Debugger code (debug.datatables.net): eninoz
Error messages shown: N/A
Description of problem: Im using Datatables Angular implementation. It works fine with the defaults options and language style (spanish), but the responsive is not working. I follow the steps for Angular from your Github site with no results.

I run the JS Debugger and everything seems fine.

As you can see the table is out from the design:

Regards

Answers

  • colincolin Posts: 12,608Questions: 0Answers: 2,154
    edited June 2020

    From that debugger screenshot, you'll see that Responsive isn't installed on that page, so it looks like the sources aren't being declared correctly.

    This thread might help, it's an older version of Angular but might point you in the right direction.

    Colin

  • rcarcassonrcarcasson Posts: 3Questions: 1Answers: 0

    It was so simply!!!!! Thanks colin! Now the responsive option is working fine!!!

    Regards!!!

  • rcarcassonrcarcasson Posts: 3Questions: 1Answers: 0

    I just forget follow these implementation to activate the responsive:

    https://l-lin.github.io/angular-datatables/#/extensions/responsive

  • eldhosee2eldhosee2 Posts: 14Questions: 9Answers: 0

    its not working in angular 9 with server side pagination

  • colincolin Posts: 12,608Questions: 0Answers: 2,154

    @eldhosee2 We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

    Cheers,

    Colin

  • indranilc98indranilc98 Posts: 1Questions: 0Answers: 0

    in responsive view, the angular click event is not working. Is there any solution?

  • colincolin Posts: 12,608Questions: 0Answers: 2,154

    Can you link to a test case, please, as requested above,

    Colin

  • gulloagulloa Posts: 1Questions: 0Answers: 0

    The documentation for responsive extension is wrong at today 2021/07/26.
    It says the steps for column reorder extension, not for responsive.

    This are the steps that work for me.

    npm install datatables.net-responsive --save
    npm install datatables.net-responsive-dt --save

    Add on angular.json

    {
    "projects": {
    "your-app-name": {
    "architect": {
    "build": {
    "options": {
    "styles": [
    "node_modules/datatables.net-dt/css/jquery.dataTables.css",
    "node_modules/datatables.net-responsive-dt/css/responsive.dataTables.css",
    "src/styles.css"
    ],
    "scripts": [
    "node_modules/datatables.net/js/jquery.dataTables.js",
    "node_modules/datatables.net-responsive/js/dataTables.responsive.js"
    ]
    ...
    }

  • colincolin Posts: 12,608Questions: 0Answers: 2,154

    @gulloa I've just taken a look at the documentation but can't see what you're referring to. Please can you post a link to the page with the misinformation so that we can fix it.

    Thanks,

    Colin

Sign In or Register to comment.