Time tracking dashboard

Community feedback

• 

  Bryan Li•3,530

  @Zy8712Posted 10 months ago

  Your site looks pretty good, though there are several things I'd suggest you change with regards to how you implemented your site.

  From what I can see, you gave each of your boxes an id so that when a button is clicked to change the viewing option, it changes the boxes displayed. But the way you implemented it results in you having 18 ids, one for each box. This is sorta really inefficient (I used to do the same thing), so what I suggest you to do is instead:

  • have a <div> encapsulate the the six boxes for each of the filter options (one div surrounding the "daily" boxes, one for the "weekly", one for the "monthly")
  • once you've done that you can get rid of the id's for the 18 boxes, and just have 3 id's for the 3 container divs
  • you may need to play around with the css as the container divs might affect how your boxes are laid out
  • then just do something similar to what you already have in your javascript file right now but you only need to change the display of 3 divs
  • this will get rid of many lines of code from your .js file

  There is another way for you to handle this project which is to use javascript to dynamically load in the data from the .json file and create the div boxes in your javascript file. It sorta just uses a template and loop mechanism where you define the html structure you want and then the js code injects the data. If you want your code for this project to be really minimalistic & clean, I suggest you to look up how to do this.

  Hope I was able to somewhat help 👍

  Marked as helpful

  1

  ---

  

  fantastizeey1•340

  @fantastizeey1Posted 10 months ago

  thank you so much i really appreciate that ill try to read on that @Zy8712

  0