Skip to Content (Press Enter)
2023-06-14 08-52-52
Arkyadeep Bharadwaj
28Views
6Comments
Solved
Cannot read property 'querySelectorAll' of null for TabContainer
Question
Reactive
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

0
0
28 Oct 2020
Copy Link
2021-08-30 15-28-09
Leandro Correa
Solution

Hi again,

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

See solution in context
TestRWA2.oml
1
0
28 Oct 2020
Copy Link
2023-06-14 08-52-52
Arkyadeep Bharadwaj

Thank You Leandro Correa for your perfect solution



0
0
29 Oct 2020
Copy Link
2021-08-30 15-28-09
Leandro Correa
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.


See solution in context
0
0
28 Oct 2020
Copy Link
2021-08-30 15-28-09
Leandro Correa

Hi Arkyadeep,

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


Kind regards,

Leandro.

0
0
28 Oct 2020
Copy Link
2023-06-14 08-52-52
Arkyadeep Bharadwaj

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

0
0
28 Oct 2020
Copy Link
2021-08-30 15-28-09
Leandro Correa
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.


0
0
28 Oct 2020
Copy Link
2021-08-30 15-28-09
Leandro Correa
Solution

Hi again,

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

TestRWA2.oml
1
0
28 Oct 2020
Copy Link
2023-06-14 08-52-52
Arkyadeep Bharadwaj

Thank You Leandro Correa for your perfect solution



0
0
29 Oct 2020
Copy Link
2021-03-18 21-03-15
Benjith Sam
 
MVP

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
0
0
28 Oct 2020
Copy Link
Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.