Uncaught TypeError: Cannot set property 'innerHTML'

JavaScript
1

As soon a visitor fills in a value it will be pushed an error inside console. I have noticed from internet it is an issue with the loading content and script but API code is done async defer

  1. On another contact form it is pushed:
    jInvalidValueError: not an instance of HTMLInputElement
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=places&key=XXX&language=de" async defer></script>

  1. I have tested a script using Autocomplete but there is a message:
    Uncaught TypeError: Cannot set property ‘innerHTML’ of XXX null

  2. Uncaught TypeError: document.getElementById(…) is null even I set ‘’; when it is filled in street address: ```
    on(‘change’, ‘#’+searchInput, function ()
    Code is the following:

var searchInput = 'search_input';

  $(document).ready(function ()
   {
    var autocomplete;
    autocomplete = new google.maps.places.Autocomplete((document.getElementById(searchInput)),
     {
     types:['geocode'],
     }
    );

    google.maps.event.addListener(autocomplete, 'place_changed', function ()
     {
      var near_place = autocomplete.getPlace();
      document.getElementById('latvalue').value = near_place.geometry.location.lat();
      document.getElementById('lngvalue').value = near_place.geometry.location.lng();

      document.getElementById('latshow1').innerHTML = near_place.geometry.location.lat();
      document.getElementById('lngshow1').innerHTML = near_place.geometry.location.lng();
     }
    );
   }
  );

  $(document).on('change', '#'+searchInput, function ()
   {
      document.getElementById('latvalue').value = '';
      document.getElementById('lngvalue').value = '';

      document.getElementById('latshow1').innerHTML = '';
      document.getElementById('lngshow1').innerHTML = '';
   }
  );
2

Show us the HTML.

Based on this code and error, either “latshow1” or “lngshow1” does not exist as an ID in your html.

3

In fact you are right. But latshow1 and lngshow1 is not hidden element. Is this an issue and I place as hidden elements? I will need to test.

<input type="hidden" id="latvalue" name="latvalue" />
<input type="hidden" id="lngvalue" name="lngvalue" />
4

Point number 3 is fixed: **Uncaught TypeError: document.getElementById(…) is null using HTML element.

How to solve point number one?
Issue: jInvalidValueError: not an instance of HTMLInputElement

5

Thank you for all help. I have solved point number one and two inside Console. If you use two ID’s it will not work.

var searchInput = 'ID1';
var searchInput = 'ID2';
1 Like
6

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.