getElementById() not working

Justin Dreher
Kilo Expert

Hi all,

In trying to enhance the functionality of a widget in the service portal, I have come across what I fee is an error. I am using the method "getElementById()" on an element that I know for sure exists, and it is coming back null.

Is there a work around to this or and alternative method I should/could use?

Thanks!

1 ACCEPTED SOLUTION

I just realized I named the variable incorrectly in the ng-if lol. That's probably the issue

 

This is what I had:
<div id="ifTrue" ng-if="data.userFormApproval">

...

<div id="ifFalse"ng-if="!data.userFormApproval">

 

But you're setting the true/false to this variable in your server script: data.userFormApprovalArray.

So it should be:

<div id="ifTrue" ng-if="data.userFormApprovalArray">

...

<div id="ifFalse"ng-if="!data.userFormApprovalArray">

 

Let me know if that works! I edited my original post with that change.

View solution in original post

9 REPLIES 9

Prins Kumar Gup
Giga Guru

Hi Justin,

Please see the below link:

Alternative for document.getElementById

So here us my code for reference

document.getElementById('ifTrue').style.display = 'none';

I put in the $ in place of "document.getElementById" and while it got rid of the  existing error, I am now getting a new error "$(...).style is undefined"

Am I any farther along?

Josh Virelli
Tera Guru

Hi Justin,

Can you please post your HTML, Client Controller, & Server script from the widget in question? The code you have in place looks correct: document.getElementById('ifTrue').style.display = 'none';

Something strange must be happening and I'd be happy to take a look, I just need more information!

Thanks,

Josh

Thanks! code below:

Edit: just the code in question

HTML:


<div id="ifTrue">
<div ng-if="options.portal && approval.state == 'requested'" class="col-xs-6">
<button name="reject" class="btn btn-danger btn-block" ng-click="reject(approval.sys_id);">${Do Not Need}</button>
</div>
<div ng-if="options.portal && approval.state == 'requested'" class="col-xs-6">
<button name="approve" class="btn btn-success btn-block" ng-click="approve(approval.sys_id);">${Completed}</button>
</div>
</div>

<div id="ifFalse">
<div ng-if="options.portal && approval.state == 'requested'" class="col-xs-6">
<button name="reject" class="btn btn-danger btn-block" ng-click="reject(approval.sys_id);">${Reject}</button>
</div>
<div ng-if="options.portal && approval.state == 'requested'" class="col-xs-6">
<button name="approve" class="btn btn-success btn-block" ng-click="approve(approval.sys_id);">${Approve}</button>
</div>
</div>

Client Controller:

var userFormApproval = $scope.data.userFormApproval;
if(userFormApproval == true){
document.getElementById('ifTrue').style.display = 'none';
}else{
document.getElementById('ifFalse').style.display = 'block';
}

 

Server Script:

 

var userFormApproval = false;
if(j.instructions.indexOf('User Form') !== -1){
userFormApproval = true;
}else{
userFormApproval = false;
}

data.userFormApprvalArray = [];
data.userFormApprovalArray = userFormApproval;