Giter VIP home page Giter VIP logo

Comments (7)

kookma avatar kookma commented on May 26, 2024 1

@pubmania
Many Thanks! Good suggestion, I add it to todo list and will implement it hopefully for next release!
But I think I had to rewrite the dynamic-table code I am not sure if css can transpose the table!

There are loops to iterate on tiddlers and create one row at a time! Now I have to iterate on fields instead of tiddlers!
So, it take times and needs rewrite the dynamic table codes

from tw-shiraz.

kookma avatar kookma commented on May 26, 2024 1

@pubmania
Many thanks for your efforts. I will consider to add this in new release! I am very busy now and hopefully I will find time to do it.
I will write you then to see how we can add this in an optimum way!

from tw-shiraz.

pubmania avatar pubmania commented on May 26, 2024 1

@kookma you are very kind and I do not believe I am worthy of thanks from the creator of the tool.

All thanks are only for your hard work and generosity to share these tools.

I will be glad to help in anyway I can. :)

from tw-shiraz.

pubmania avatar pubmania commented on May 26, 2024

See the thing is I used that stackoverflow css solution on TW-Shiraz demo site and it did work in transposing the rows but problem was that it did not align the column headers transposed as rows with rest of the cells... once I am on the laptop later today, I will post the css change I applied on the demo site to make it work.... seeing that might trigger an idea perhaps.

from tw-shiraz.

kookma avatar kookma commented on May 26, 2024

@pubmania
The issue is not related to css, the issue is the way rows are populated in the code

from tw-shiraz.

pubmania avatar pubmania commented on May 26, 2024

hmm you ofcourse know better so I can't add much value but see what I mean in screenshots below after I added a style called table-custom on stylesheet:

.table-custom, 
.table-custom thead td, 
.table-custom th, 
.table-custom td{
  display: block;
} 
.table-custom tr{
  display: block; 
    float: left;
}

image

Then on a new tiddler I used following macro call:

<<table-dynamic filter:"[tag[sample]]" fields:"title fa fb email created tags" stateTiddler:"exmp02" class:"table-custom thead-dark" caption:"''Table 2. Dynamic table example''">>

The columns were all changed to rows as shown below:

image

Problem as I mentioned before is the header is not aligned to rest of the data. Now this I did was quick and dirty but when I was doing it last time i managed to apply css such if "table-custom" was not applied to a table it remained like a normal table. I changed the css such that only table with table-custom css applied will be impacted.

image

I also checked and editing deletion all works perfect - just the alignment that is screwed up :(.

from tw-shiraz.

pubmania avatar pubmania commented on May 26, 2024

Hey I did it with custom CSS. 😃

I added the following style in the system tiddler: $:/plugins/kookma/shiraz/styles/tables

(The only thing missing in previous time was .table-custom thead, as I don't think .table-custom tbody td, is adding any value but I just left it there just in case.)
EDIT 1: Included .table-custom caption too as that ensures caption is also displayed properly.

.table-custom, 
.table-custom thead,
.table-custom caption,
.table-custom thead td,
.table-custom thead tr,
.table-custom tbody td,
.table-custom th, 
.table-custom td{
  display: block;
} 
.table-custom tr{
  display: block; 
    float: left;
}

and then when I call with following macro on a new tiddler:

<<table-dynamic filter:"[tag[sample]]" fields:"title fa fb email created tags" stateTiddler:"exmp02" class:"table-custom thead-dark">>

I get the transposed table:

shiraz_tiddlywiki_transpose_table

from tw-shiraz.

Related Issues (17)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.