# How to create grid view or whoever can support to create grid view?
**URL:** https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115
**Category:** Developer
**Created:** [December 24, 2019, 2:42am UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115 "2019-12-24T02:42:00Z")
**Posts on this page:** 20
**Page:** 1
### Author:  [@bala4901](https://discuss.tryton.org/u/bala4901)
#### Post date: [December 24, 2019, 2:42am UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115/1 "2019-12-24T02:42:00Z")
Hi,
I would like to create grid view at tryton client.
Either by xml or through html. May I know how can I achieve that?
Or can get paid service for this?
---
### Author:  [@ced](https://discuss.tryton.org/u/ced)
#### Post date: [December 24, 2019, 9:37am UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115/2 "2019-12-24T09:37:12Z")
> [@bala4901](#):
>
> I would like to create grid view at tryton client.
Could you explain a little bit more what is exactly? What are the data to display? What is the goal of the view? etc.
---
### Author:  [@bala4901](https://discuss.tryton.org/u/bala4901)
#### Post date: [December 25, 2019, 1:23am UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115/3 "2019-12-25T01:23:35Z")
Merry Christmas to All…
Thank you @ced for quick response.
I am going to make a view for displaying the Racking(Bin) status.
The model is Bank, Bay, Level, prohibited, state.
State has empty and occupied.
So the grid will show the color to determine the state.
Green is occupied, White is empty, yellow is prohibited.
1 Page is show the 1 Bank. Then user choose the bank to display the Grid status.
Best Regards
---
### Author:  [@ced](https://discuss.tryton.org/u/ced)
#### Post date: [December 25, 2019, 10:06am UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115/4 "2019-12-25T10:06:18Z")
> [@bala4901](#):
>
> I am going to make a view for displaying the Racking(Bin) status.
For which goal? How is it helping the user? and for which task?
> [@bala4901](#):
>
> So the grid will show the color to determine the state.
There is nothing in Tryton for this purpose. At best you generate an image and display it.
We had one time a request a little bit similar based on a actual plan. Our proposal (that we did not implement) was to have a static base in SVG with XML id on places we want to color. And generate a CSS with a color rule for each id. This image would be put in a simple HTML page that is templated and served by trytond.
---
### Author:  [@bala4901](https://discuss.tryton.org/u/bala4901)
#### Post date: [December 25, 2019, 6:49pm UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115/5 "2019-12-25T18:49:23Z")
Hi Ced,
The main goal is to let user to visualize the actual condition. We can show the data by tree or list, however, it might hard for them to imagine the real condition in the warehouse or racking.
Regarding your proposal to generate the image and display in trytond, are you mean to diplays the svg in trytond client? Or to host to another website such as flask?
---
### Author:  [@ced](https://discuss.tryton.org/u/ced)
#### Post date: [December 25, 2019, 9:29pm UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115/6 "2019-12-25T21:29:00Z")
> [@bala4901](#):
>
> The main goal is to let user to visualize the actual condition. We can show the data by tree or list, however, it might hard for them to imagine the real condition in the warehouse or racking.
Well I still do not understand the point. Either the number of cells is small then a simple list works, either the number of cells is high then a picture is neither practical (another metric could be used like a filling rate etc.).
> [@bala4901](#):
>
> are you mean to diplays the svg in trytond client? Or to host to another website such as flask?
You do not need flask to serve HTML page. Tryton can do that (like in `account_payment_stripe`).
Now I have difficulties to advise on how to use such image because I do not understand the use case.
---
### Author:  [@bala4901](https://discuss.tryton.org/u/bala4901)
#### Post date: [December 26, 2019, 2:21am UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115/7 "2019-12-26T02:21:55Z")
Hi @ced,
Thank you for your advice. I am doing like the account\_payment\_stripe using routes.
I just know that the Route can serve as a website. This is very helpful in term of for anything difficult to do in Trytond such as fancy design report.
Thank you
---
### Author:  [@bala4901](https://discuss.tryton.org/u/bala4901)
#### Post date: [December 26, 2019, 9:47am UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115/8 "2019-12-26T09:47:40Z")
Hi @ced,
Sorry to trouble you again.
May I know how to set the assets (images, css, js) folder? so that the website can call
---
### Author:  [@ced](https://discuss.tryton.org/u/ced)
#### Post date: [December 26, 2019, 9:49am UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115/9 "2019-12-26T09:49:43Z")
Create a route for each one.
But for css and js, I would simply embed them in the HTML.
---
### Author:  [@bala4901](https://discuss.tryton.org/u/bala4901)
#### Post date: [December 26, 2019, 10:04am UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115/10 "2019-12-26T10:04:40Z")
I created a folder “images” in module and put the image in the folder.
When I embed such as html below, it cannot read the folder. My question, How you simply embed them in the html using static path?
`
`
---
### Author:  [@ced](https://discuss.tryton.org/u/ced)
#### Post date: [December 26, 2019, 10:08am UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115/11 "2019-12-26T10:08:25Z")
As I said you must create a route that returns the image content.
(I created [Add a default static route for each module (#8957) · Issues · Tryton / Tryton · GitLab](https://bugs.tryton.org/issue8957) to ease development).
---
### Author:  [@bala4901](https://discuss.tryton.org/u/bala4901)
#### Post date: [December 26, 2019, 11:23am UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115/13 "2019-12-26T11:23:41Z")
I am sorry @ced. I had tried below method to create the static folder. But not success, could you show me some code/module for example??
routes.py
```
from os import path
from werkzeug import SharedDataMiddleware
STATIC_PATH = path.join(path.dirname( __file__ ), 'static')
def __call__ (self, environ, start_response):
return self.dispatch(environ, start_response)
def __init__ (self, query, per_page, page, endpoint):
self.dispatch = SharedDataMiddleware(self.dispatch, {
'/static': STATIC_PATH
})
```
html:
` 
`
---
### Author:  [@ced](https://discuss.tryton.org/u/ced)
#### Post date: [December 26, 2019, 12:18pm UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115/14 "2019-12-26T12:18:36Z")
Such route is not different than others.
Here is an example (not tested):
```auto
@app.route('/mymodule/static/')
def static(request, path):
file = tools.file_open(os.path.join('mymodule/static', path))
headers = {…}
return Response(wrap_file(file), headers=headers, …)
```
---
### Author:  [@bala4901](https://discuss.tryton.org/u/bala4901)
#### Post date: [December 26, 2019, 1:28pm UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115/15 "2019-12-26T13:28:48Z")
Thanks for your sample code. Below attached is working code for station folder. And maybe can be reference for others:
```
from os import path
STATIC_PATH = path.join(path.dirname( __file__ ), 'static')
@app.route('//booking/checkout//images/')
@with_pool
@with_transaction()
def js(request, pool, model, filename):
pp = '%s/%s/%s' % (STATIC_PATH, 'images', filename)
f = open(pp, 'rb')
return Response(wrap_file(request.environ,f))
```
---
### Author:  [@ced](https://discuss.tryton.org/u/ced)
#### Post date: [December 26, 2019, 4:06pm UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115/16 "2019-12-26T16:06:04Z")
Normally, you do not need of the `with_pool` nor `with_transaction` decorators. So the `` can also be removed from the URL pattern.
You should use `trytond.tools.file_open` because for now you have no validation against path escape like `database/booking/checkout/model/images/../../../../../../etc/password`.
You may also want to put some caching header to reduce the number of requests.
Finally if you feel it, you can propose a generic solution for [Add a default static route for each module (#8957) · Issues · Tryton / Tryton · GitLab](https://bugs.tryton.org/issue8957)
---
### Author:  [@bala4901](https://discuss.tryton.org/u/bala4901)
#### Post date: [December 27, 2019, 7:34am UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115/17 "2019-12-27T07:34:15Z")
Hi @ced,
STATIC\_PATH = path.join(path.dirname( **file** ), ‘static’)
I am using this because I am in development, if I am using tools.file\_open it call the path in the trytond which currently the image file does not exist.
I will interest to make generic solution. Before that, I want to confirm below items.
Putting js, css from external such as cdn, or static folder, is not working with the method Report.html. When using in html, report generator seem like ignore or passing the wrong close tag.
Can I say it is bug? or limitation from genshi?
I am sharing my outcome but JS and CSS are written in the HTML instead get from external.
---
### Author:  [@ced](https://discuss.tryton.org/u/ced)
#### Post date: [December 27, 2019, 9:34am UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115/18 "2019-12-27T09:34:08Z")
> [@bala4901](#):
>
> When using in html, report generator seem like ignore or passing the wrong close tag.
>
> Can I say it is bug? or limitation from genshi?
As far as I know, Genshi expect valid XML so HTML must be written as valid XML.
---
### Author:  [@bala4901](https://discuss.tryton.org/u/bala4901)
#### Post date: [December 27, 2019, 9:41am UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115/19 "2019-12-27T09:41:05Z")
As i expected, so that even we created a static folder. So far, we only can import the images but js and css hardly to be imported.
Is it worth to create the generic solution?
---
### Author:  [@ced](https://discuss.tryton.org/u/ced)
#### Post date: [December 27, 2019, 9:49am UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115/20 "2019-12-27T09:49:59Z")
I do not see why script and style could not be imported.
---
### Author:  [@system](https://discuss.tryton.org/u/system)
#### Post date: [January 26, 2020, 10:04am UTC](https://discuss.tryton.org/t/how-to-create-grid-view-or-whoever-can-support-to-create-grid-view/2115/21 "2020-01-26T10:04:54Z")
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.