Uncaught TypeError: Cannot read property 'html' of null

Freejoy · October 24, 2015, 8:01pm

I’m trying to figure out how to fix this error. Here’s the place where it says the error is happening:

function  getnp(){
  var order_id = document.getElementById("order_id").value;
       $("div#jfjfjf").html('<br><br><br><div style="background: url(<?php echo $this->getSkinUrl('images/opc-ajax-loader.gif', array('_secure'=>true)) ?>);width:16px;height:16px;text-align:center;margin-left:270px;">'); 
        $.ajax({
          type: "GET",
             
        //    url: '<?php echo Mage::getUrl('rma/index/order') ?>',
       //     url: '<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_WEB);; ?>/oproducts.php',
              url: '<?php echo Mage::getUrl('rma/index/order',array('_secure'=>true)) ?>',
          data: "oid="+ order_id , // appears as $_GET['id'] @ ur backend side
          success: function(data) {
                // data is ur summary
               $('#jfjfjf').html(data);
          }
     
        });
     return true;
     }

The thing about it it has been working fine and just stopped working.

Thank you

Alaanor · October 24, 2015, 8:08pm

I think it’s hard to resolve your problem without more information.

But as I understand, the value of data is null. So this line $('#jfjfjf').html(data); can’t work and get a exception.

Check my hypothesis by adding an alert(data); before $('#jfjfjf').html(data); and see the result.

Freejoy · October 24, 2015, 8:14pm

Thanks

I added it this way:

function  getnp(){
  var order_id = document.getElementById("order_id").value;
  alert(data);
       $("div#jfjfjf").html('<br><br><br><div style="background: url(<?php echo $this->getSkinUrl('images/opc-ajax-loader.gif', array('_secure'=>true)) ?>);width:16px;height:16px;text-align:center;margin-left:270px;">'); 
        $.ajax({
          type: "GET",
             
        //    url: '<?php echo Mage::getUrl('rma/index/order') ?>',
       //     url: '<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_WEB);; ?>/oproducts.php',
              url: '<?php echo Mage::getUrl('rma/index/order',array('_secure'=>true)) ?>',
          data: "oid="+ order_id , // appears as $_GET['id'] @ ur backend side
          success: function(data) {
                // data is ur summary
               $('#jfjfjf').html(data);
          }
     
        });
     return true;
     }

Now I get: Uncaught ReferenceError: data is not defined

Alaanor · October 24, 2015, 8:26pm

Not here

But here:

success: function(data) {
    // data is ur summary
    alert(data);
    $('#jfjfjf').html(data);
}

You must try to understand what is the error, when you see that:

Uncaught ReferenceError: data is not defined

That mean data is not defined, that mean data has not been declared at this time, so that normal you get a error.

Freejoy · October 24, 2015, 8:37pm

Yeah, I don’t know much about JavaScript (as you might tell )
I put it where you said and I still get the same error: Uncaught TypeError: Cannot read property ‘html’ of null

Alaanor · October 24, 2015, 8:38pm

Of course you get the same error. alert() is just a function for displaying a message at the screen. So what is the message at screen ?

Freejoy · October 24, 2015, 8:58pm

No error messages are showing on my screen anywhere.

Alaanor · October 24, 2015, 9:10pm

Please try this:

function  getnp(){
  var order_id = document.getElementById("order_id").value;
       $("div#jfjfjf").html('<br><br><br><div style="background: url(<?php echo $this->getSkinUrl('images/opc-ajax-loader.gif', array('_secure'=>true)) ?>);width:16px;height:16px;text-align:center;margin-left:270px;">'); 
        $.ajax({
          type: "GET",
             
        //    url: '<?php echo Mage::getUrl('rma/index/order') ?>',
       //     url: '<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_WEB);; ?>/oproducts.php',
              url: '<?php echo Mage::getUrl('rma/index/order',array('_secure'=>true)) ?>',
          data: "oid="+ order_id , // appears as $_GET['id'] @ ur backend side
          success: function(data) {
                // data is ur summary
               alert(data);
               $('#jfjfjf').html(data);
          },
          error: function(jqXHR, textStatus, errorThrown) {
              alert(textStatus);
              alert(errorThrown);
              alert(jqXHR);
          }
     
        });
     return true;
     }

I’ve added a error possibility for see error (if there is any error).
The error is probably in your php script (indicated in url), and this url return nothing. You can try to see this by accessing at this url. For example if your url is http://mywebsite.com/mypage.php, so you should enter that in your browser and see result http://mywebsite.com/mypage.php?oid=123.

Freejoy · October 24, 2015, 9:15pm

I get this error: Uncaught ReferenceError: data is not defined

Thanks

Alaanor · October 24, 2015, 9:21pm

Sorry I’ve copied your script with the bad alert. See my edit, copy again the code and try again.

Freejoy · October 24, 2015, 9:28pm

I get the same error: Uncaught TypeError: Cannot read property ‘html’ of null

Alaanor · October 24, 2015, 9:34pm

Yeah, but what is displayed to screen ? In all case there is a message at your screen.

Please try to understand, we try to understand where is the error and not try to fix for the moment. When we have found where is the error then we’re going to try to fix them.

Freejoy · October 24, 2015, 9:41pm

Okay

let me explain what I’m doing.

my url is: /index.php/rma/index/request

the order id I’m testing is: 37024

so I tried going here: /index.php/rma/index/request?oid=37024

but nothing shows, but chrome says: Uncaught TypeError: Cannot read property ‘html’ of null

I’m I doing it correct?

Alaanor · October 24, 2015, 9:46pm

No

You use the url where you have the code. Your ajax doesn’t try to fetching from this url.
You show your javascript code with php, but not the javascript code generated, so I can’t see what your php function return.

The url is at this line:

Freejoy · October 24, 2015, 9:55pm

okay
at url: /rma/index/order?oid=37024

nothing much shows up on the page so here is the complete page source:

function checkQty(id){
      var rma_qty = document.getElementById("rma"+id).value;
      var o_qty = document.getElementById("o"+id).value;
          if(isNaN(rma_qty)){
                alert('not number');
                document.getElementById("rma"+id).value=1
          }else{
            if(o_qty >= rma_qty){
              //  alert('Rma quantity should be less than ordered quantity');
                //document.getElementById("rma"+id).value=1
          }else{
                alert('Rma quantity should be less than ordered quantity');
                document.getElementById("rma"+id).value=1
          }
}
}

<div class="entry-edit">
        <div class="entry-edit-head">
            <h4 class="icon-head head-products">Items RMA Requested for</h4>
        </div>
    </div><div class="grid np">
  <div class="hor-scroll">
<table cellspacing="0" class="data order-tables" width="90%">
<thead>
<tr class="headings">
<th><strong>Items</strong></th><th><strong>Price</strong></th><th><strong>Qty</strong></th><th><strong>Return Qty</strong></th>
</tr>
</thead>
<tbody class="even">
<tr><td> <input type="hidden" size="2" name="maxpid" value="" /></td>
</td></tr>              
            </tbody>
            </table>
  </div>

Is this correct? I had to remove the script tags.

Alaanor · October 24, 2015, 10:04pm

So let’s try to understand:

you call a ajax function that try to get some content at /rma/index/order?oid=37024
you try to add the content of the ajax request into a html node. (#jfjfjf).

BUT ! you just said:

So, that mean, you try to add to content of the node: null. Here is the error. Javascript don’t like null value.
You must understand the problem is your php page. (/rma/index/order?oid=37024) This page must return a content, but instead of a content, it’s return nothing. (null)

You have to fix /rma/index/order?oid=37024.

Freejoy · October 24, 2015, 10:11pm

I very much appreciate your time on this. I least have a direction to look. I might can fix it now.

Mittineague · October 24, 2015, 10:35pm

“data” undefined sounds like there is a problem with data not being returned.
But I’m wondering it it’s really the “html” that is the problem. i.e. what’s being returned is not HTML (a JSON object?)

Alaanor · October 24, 2015, 10:42pm

Check this answer on stackoverflow and his example.

As you can see, that maybe not the best function. But in all case, it’s should show something.

system · January 24, 2016, 5:43am

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

Topic		Replies	Views
Fixing "Cannot read property 'data1' of null" 5 different ways JavaScript	11	3946	January 25, 2017
Xml - can't read property of null JavaScript	9	10961	June 1, 2016
Uncaught TypeError: Cannot read property 'value' of null JavaScript	4	59697	October 8, 2014
Uncaught TypeError: Cannot read property 'serializeArray' of null JavaScript	5	2815	June 6, 2018
TypeError: Cannot read property 'style' of null JavaScript	1	1223	July 22, 2011

Uncaught TypeError: Cannot read property 'html' of null

Related topics