Uncaught TypeError Cannot set property value of null

Question

I m trying to pass the entered text to the controller using an ajax request  But i m getting athe error   Uncaught TypeError  Cannot set property  value  of null   when I tried to execute JS file    Here is the HTMLcode    lt form action    gt       lt input type  text  class  searchbox1  name  search  placeholder  Search for Brand  Store or an Item     value  text    gt       lt input type  button  class  searchbox submit1  name  submit  value  text  onClick  javascript getSearchText     gt   lt  form gt    Here is the JS code   function getSearchText         var searchText   document getElementByName  search   value      h url document getElementById  u   value      var theURL   h url  search all     deptid         searchText     1         ajax           url   theURL          fail  function                       success   function                        error function                          Please help me to fix this

User · Answer

h url document getElementById  u   is null here   There is no element exist with id as u

User · Answer

In case anyone landed on this page for a similar issue  I found that this error can happen if your JavaScript is running in the HEAD before your form is ready   Moving your JavaScript to the bottom of the page fixed it for my situation

User · Answer

The problem may where the code is being executed  If you are in the head of a document executing JavaScript  even when you have an element with id  u  in your web page  the code gets executed before the DOM is finished loading  and so none of the HTML really exists yet    You can fix this by moving your code to the end of the page just above the closing html tag   This is one good reason to use jQuery

User · Answer

It seems to be this function  h url document getElementById  u   value    You can help yourself using some  console log  to see what object is Null

User · Answer

The problem is that you haven t got any element with the id u so that you are calling something that doesn t exist  To fix that you have to add an id to the element    lt input id  u  type  text  class  searchbox1  name  search  placeholder  Search for Brand  Store or an Item     value  text    gt     And I ve seen too you have added a value for the input  so it means the input is not empty and it will contain text  As result placeholder won t be displayed   Finally there is a warning that W3Validator will say because of the     in the end        For the current document  the validator interprets strings like  according to legacy rules that break the expectations of most authors and thus cause confusing warnings and error messages from the validator  This interpretation is triggered by HTML 4 documents or other SGML-based HTML documents  To avoid the messages  simply remove the     character in such contexts  NB  If you expect  lt FOO   gt  to be interpreted as an XML-compatible  self-closing  tag  then you need to use XHTML or HTML5    In conclusion it says you have to remove the slash  Simply write this    lt input id  u  type  text  class  searchbox1  name  search  placeholder  Search for Brand  Store or an Item     gt

User · Answer

guys This error because of Element Id not Visible from js Try to inspect element from UI and paste it on javascript file   before    document getElementById  form salesoverviewform ticketstatusid   value  topping    After    document getElementById  form salesoverviewform j idt190 ticketstatusid   value  topping    Credits to Divya Akka

User · Answer

I knew that i am too late for this answer  but i hope this will help to other who are facing and who will face  As you have written h url is global var like var   h url  so you can use that variable anywhere in your file   h url document getElementById  quot u quot   value  Here h url contain value of your search box text value whatever user has typed   document getElementById  quot u quot    This is the identifier of your form field with some specific ID   Your Search Field without id  lt input type  quot text quot  class  quot searchbox1 quot  name  quot search quot  placeholder  quot Search for Brand  Store or an Item    quot  value  quot text quot    gt   Alter Search Field with id  lt input id  quot u quot  type  quot text quot  class  quot searchbox1 quot  name  quot search quot  placeholder  quot Search for Brand  Store or an Item    quot  value  quot text quot    gt   When you click on submit that will try to fetch value from document getElementById  quot u quot   value  which is syntactically right but you haven t define id so that will return null   So  Just make sure while you use form fields first define that ID and do other task letter    I hope this helps you and never get Cannot set property  value  of null  Error

User · Answer

You don t have an element with the id u That s why the error occurs  Note that the global variable document getElementById  u   value means you are trying to get the value of input element with name u and its not defined in your code

[javascript] Uncaught TypeError: Cannot set property 'value' of null

Examples related to javascript

Examples related to html