11
Views
6
Comments
Solved
Cannot read property 'querySelectorAll' of null for TabContainer
Question
Application Type
Reactive

Hi All

i am using tabcontainer in my reactive application.based on dropdown value i have to show the Tab.when i am trying to open the data in edit mode that time im getting below error:

"Cannot read property 'querySelectorAll' of null "

i am not able to track why it is coming.please help to resolve this


error log is given below

Cannot read property 'querySelectorAll' of null

eSpaceVer: Id=78174, PubId=0, CompiledWith=11.9.0.17011
RequestUrl: https://devos.orthobanc.com/OBApplication/moduleservices/log?clientTimeInMillis=1603889834342 (Method: POST)
AppDomain: /LM/W3SVC/1/ROOT/OBApplication-846-132483633473825070
FilePath: D:\OutSystems\Platform Server\running\OBApplication.797265816\
ClientIp: 10.100.4.202 X-Forwarded-For: 2405:201:d000:70f0:2c76:1ae5:aaf3:afa2
Locale: en-US
DateFormat: MM/dd/yyyy
PID: 11156 ('w3wp', Started='10/26/2020 2:43:01 PM', Priv=2983Mb, Virt=2114235Mb)
TID: 173
Thread Name:
.NET: 4.0.30319.42000
Client Runtime Packages: client-runtime-core= 1.3.0;client-runtime-view-framework-react= 1.3.0;client-runtime-widgets= 1.3.0;
Client-Side Log

TypeError: Cannot read property 'querySelectorAll' of null
at https://devos.orthobanc.com/OBApplication/scripts/OutSystemsUI.controller.js?J1qymVmw8EECicZh1n+h7A:4630:25
at Controller.e.safeExecuteJSNode (https://devos.orthobanc.com/OBApplication/scripts/OutSystems.js?xMOoxMfm84XXmTysZD6avg:14:26836)
at Controller.OutSystemsUIController.default.tabsGoTo$Action (https://devos.orthobanc.com/OBApplication/scripts/OutSystemsUI.controller.js?J1qymVmw8EECicZh1n+h7A:4586:12)
    at https://devos.orthobanc.com/OBApplication/scripts/ProviderPortal.ResponsibleOnboarding.CreateContractPlan.mvc.js?jyWJ2qxrIMyz2G+Yqi381g:6175:32

mvp_badge
MVP
Rank: #159
Solution

Hi again,

Here is another approach, using CSS.  There is a .oml attached as a sample.

TestRWA2.oml

Thank You Leandro Correa for your perfect solution



mvp_badge
MVP
Rank: #159
Solution

I think you're trying to access the tabs component and it is not exist in the page because the if statement.

Maybe you could try another approach and use Containers and set them visible properties as per condition.


mvp_badge
MVP
Rank: #159

Hi Arkyadeep,

Can you attach your .oml or a simple sample, please?


Kind regards,

Leandro.

i cant share the OML file but i can share the screenshot of my code.

mvp_badge
MVP
Rank: #159
Solution

I think you're trying to access the tabs component and it is not exist in the page because the if statement.

Maybe you could try another approach and use Containers and set them visible properties as per condition.


mvp_badge
MVP
Rank: #159
Solution

Hi again,

Here is another approach, using CSS.  There is a .oml attached as a sample.

TestRWA2.oml

Thank You Leandro Correa for your perfect solution



mvp_badge
MVP
Rank: #75

Hi Arkyadeep,

I do have one more solution for the mentioned use-case using JavaScript.

JavaScript Snippet:

- JS to change the active tab on the basis of Tab index (starts from 0 ) value

document.getElementById($parameters.NavigationEleId).changeTab($parameters.newIndex)

See this sample app-TabContanierDemo

Please refer the attached .oml (you can easily customize the code flow as per your requirement)

Hope this helps you!


Kind regards,

Benjith Sam

ReactiveDynamicTabActiveTabSelection.oml