0

Wondering if anyone could help with the following code. I have a combobox called "cboAgreement" which is a dropdown with two values "Agree" and "Disagree".

I have a form where, the comments grid is initially hidden, but when a user chooses "Disagree" the comments grid should appear.

When i inspect the webpage, it gives back this error:

"Uncaught TypeError: Cannot read property 'value' of null"

I have tried changing the if statement to decision.getvalue() but again same thing. 

<script type="text/javascript">

  var commentsGrid = document.getElementById("comms");
  var decision = document.getElementById("cboAgreement").value;

  commentsGrid.style.visibility = "hidden";


  if (decision == "Disagree") {
  commentsGrid.style.visibility = "visible";
  }else{
  commentsGrid.style.visibility = "hidden";
  }


</script>

and the combo box is as follows:

<sq8:ComboBox runat="server" ID="cboAgreement"><Items>
<sq8:ComboBoxItem runat="server" Text="Agree" Selected="True"></sq8:ComboBoxItem>
<sq8:ComboBoxItem runat="server" Text="Disagree"></sq8:ComboBoxItem>
</Items>
</sq8:ComboBox>
<sq:BindableControl runat="server" TargetControlID="cboAgreement" DataField="cboAgreement"></sq:BindableControl>

What am i doing wrong? I should say, I'm new to JavaScript so 99.9% doing something incorrect!

Thanks in advance for any help.

Hasta Dhana
  • 4,699
  • 7
  • 17
  • 26
Adam
  • 7
  • 1
  • 7
  • It means it could not find `document.getElementById("cboAgreement")` I am betting your serverside framework is changing the ids or you are referencing the elements before they exist on the page. – epascarello May 24 '19 at 13:42
  • It could be your 2nd point. I've added in `Sys.Application.add_load(FormLoad) function FormLoad() { HideComments(true); Decision(true); } ` The Decision function has the code i've shown above but i'm still getting the error. – Adam May 24 '19 at 13:52
  • The `commentsGrid.style.visibility = "hidden";` works fine, this is an id of a div. I don't think the ids are being changed. – Adam May 24 '19 at 13:53
  • View the page source, it is not that hard to tell. – epascarello May 24 '19 at 13:54

1 Answers1

0

It means that you are trying to access a property of an object that is undefined, in other words you are trying to get it is value while it is still empty This usually happens when we don't test an object before using it. I recommend checking the element exists before getting it is value.

   if (decision) {
      decision = decision.value; 
   }

Also check this quick tutorial: https://idiallo.com/javascript/uncaught-typeerror-cannot-read-property-of-null

aisha
  • 33
  • 8
  • Actually, i may have done it wrong. This brings back an error: `var decision = document.getElementById("cboAgreement").value; if (decision) { decision = decision.value; }` – Adam May 24 '19 at 14:21
  • your not suppose to get the value of an element before checking that is there remove the .value from the var deceleration. – aisha May 24 '19 at 14:34
  • ok. I did that and i got no errors in the inspect menu. Not really sure what to do next? – Adam May 24 '19 at 14:38
  • I think it may be to do with the "comboboxItem" part, it doesn't seem to find the items. – Adam May 28 '19 at 10:24
  • could you help? – Adam May 28 '19 at 10:30
  • I haven't worked on comboboxItem before, will check if I can find anything and will let you know. – aisha May 28 '19 at 15:28