# Customizing Perspective Table and json scripting help

**URL:** <https://forum.inductiveautomation.com/t/customizing-perspective-table-and-json-scripting-help/62348>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [July 27, 2022, 1:30pm UTC](https://forum.inductiveautomation.com/t/customizing-perspective-table-and-json-scripting-help/62348 "2022-07-27T13:30:56Z")\
**Posts on this page:** 9\
**Page:** 4

<div class="post-metadata">

**Author:** ![zacharyw.larson](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/zacharyw.larson/32/23749_2.png) [@zacharyw.larson](https://forum.inductiveautomation.com/u/zacharyw.larson)\
**Post date:** [March 23, 2023, 1:37pm UTC](https://forum.inductiveautomation.com/t/customizing-perspective-table-and-json-scripting-help/62348/61 "2023-03-23T13:37:04Z")

</div>

Thanks, I will try it.

---

<div class="post-metadata">

**Author:** ![pascal.fragnoud](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pascal.fragnoud/32/24728_2.png) [@pascal.fragnoud](https://forum.inductiveautomation.com/u/pascal.fragnoud)\
**Post date:** [March 23, 2023, 2:10pm UTC](https://forum.inductiveautomation.com/t/customizing-perspective-table-and-json-scripting-help/62348/62 "2023-03-23T14:10:25Z")

</div>

I don't think his goal was to improve performances, but rather to make things simpler for him.

---

<div class="post-metadata">

**Author:** ![zacharyw.larson](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/zacharyw.larson/32/23749_2.png) [@zacharyw.larson](https://forum.inductiveautomation.com/u/zacharyw.larson)\
**Post date:** [March 23, 2023, 2:14pm UTC](https://forum.inductiveautomation.com/t/customizing-perspective-table-and-json-scripting-help/62348/63 "2023-03-23T14:14:12Z")

</div>

I really conflated describing what I was doing.

I appreciate the help from both angles.

---

<div class="post-metadata">

**Author:** ![zacharyw.larson](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/zacharyw.larson/32/23749_2.png) [@zacharyw.larson](https://forum.inductiveautomation.com/u/zacharyw.larson)\
**Post date:** [March 23, 2023, 3:20pm UTC](https://forum.inductiveautomation.com/t/customizing-perspective-table-and-json-scripting-help/62348/64 "2023-03-23T15:20:26Z")

</div>

> [@pascal.fragnoud](#):
>
> Well, if you disable the header and pager, disable the stripes, add 'borderStyle: none' to the table styles...

Can I keep the headers, but get rid of the shadow and line from within the component?

---

<div class="post-metadata">

**Author:** ![pascal.fragnoud](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pascal.fragnoud/32/24728_2.png) [@pascal.fragnoud](https://forum.inductiveautomation.com/u/pascal.fragnoud)\
**Post date:** [March 23, 2023, 3:44pm UTC](https://forum.inductiveautomation.com/t/customizing-perspective-table-and-json-scripting-help/62348/65 "2023-03-23T15:44:32Z")

</div>

Everything is possible !

As there's no option for this, you'll need to use css.  
Weirdly enough, trying to set `box-shadow: none` in the header's style doesn't do anything.  
I guess the box shadow is set on another div that the one the styles are applied to.

But it's easy enough to find where that box shadow is, and add a rule that targets it in the style sheet.  
To make sure it's only applied to THAT table (you don't want to start messing up other tables in your project), you can add a `domId` to your table, so that we can target it specifically.  
I gave a domId of "faketable" to mine:

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/4/3/43cd4fbfd01f1fb34c6a7f301d4fe8b29c72ff89.png)

Then added this to the stylesheet:

```css
#faketable .ia_table__headContainer {
	box-shadow: none;
}

```

If you don't have a stylesheet, your ignition version is too old (I think it was introduced in 8.1.21 ?).  
In this case, you can put that css in your theme file instead.  
Or inject it, oldstyle !

Results:

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/4/0420495570836f572e1c5802b0af39957d6520cc.png)

---

<div class="post-metadata">

**Author:** ![zacharyw.larson](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/zacharyw.larson/32/23749_2.png) [@zacharyw.larson](https://forum.inductiveautomation.com/u/zacharyw.larson)\
**Post date:** [March 23, 2023, 4:06pm UTC](https://forum.inductiveautomation.com/t/customizing-perspective-table-and-json-scripting-help/62348/66 "2023-03-23T16:06:12Z")

</div>

Thanks

I ended up turning the header off, and using a couple flex containers to align labels.  
The numbers are in a table in the image on blue background.  
Customized table column text, row height, and row style.  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/4/d/4d1d44cfef6b4ce7842a5b8a9b84b3926e014f75.png)

> [@pascal.fragnoud](#):
>
> ```auto
> .ia_table__headContainer {
> box-shadow: none;
> }
> 
> ```

Thanks for finding the thing to target. I still struggle with that part.  
Thanks for showing me the dom id.  
I usually use the background style trick where you open the brackets on the object itself to target, Victor showed me.

---

<div class="post-metadata">

**Author:** ![zacharyw.larson](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/zacharyw.larson/32/23749_2.png) [@zacharyw.larson](https://forum.inductiveautomation.com/u/zacharyw.larson)\
**Post date:** [March 23, 2023, 5:06pm UTC](https://forum.inductiveautomation.com/t/customizing-perspective-table-and-json-scripting-help/62348/67 "2023-03-23T17:06:29Z")

</div>

oh no

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/6/5/6587b2dfef92407e7a3391b97097f1fbcb228b40.png)

It looked great, now suddenly it has changed. All did was close and open the designer.

* * *

I think I figured it out.  
I had basis 100%.  
I must have changed the width of something else, and then 100% was smaller.  
So now my table is set to 300px to show right.

---

<div class="post-metadata">

**Author:** ![pascal.fragnoud](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pascal.fragnoud/32/24728_2.png) [@pascal.fragnoud](https://forum.inductiveautomation.com/u/pascal.fragnoud)\
**Post date:** [March 24, 2023, 10:36am UTC](https://forum.inductiveautomation.com/t/customizing-perspective-table-and-json-scripting-help/62348/68 "2023-03-24T10:36:58Z")

</div>

> [@zacharyw.larson](#):
>
> I usually use the background style trick where you open the brackets on the object itself to target, Victor showed me.

That's the old style injection, not necessary anymore with the introduction of the style sheet.

---

<div class="post-metadata">

**Author:** ![zacharyw.larson](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/zacharyw.larson/32/23749_2.png) [@zacharyw.larson](https://forum.inductiveautomation.com/u/zacharyw.larson)\
**Post date:** [March 24, 2023, 12:19pm UTC](https://forum.inductiveautomation.com/t/customizing-perspective-table-and-json-scripting-help/62348/69 "2023-03-24T12:19:22Z")

</div>

The footprint is small though.

[Previous page](https://forum.inductiveautomation.com/t/customizing-perspective-table-and-json-scripting-help/62348.md?page=3)