Ошибка cannot read property document of null

novichok79

23.10.19 — 12:32

novichok79

1 — 23.10.19 — 12:33

причем, если выкачать html документа с удаленного сервера и заполнить им данные поля HTML, то в веб-клиенте работает все, кроме ajax вызовов, из-за того, что стучусь с localhost’а.

Garykom

2 — 23.10.19 — 12:40

novichok79

3 — 23.10.19 — 12:43

(2) ну мне кажется что где-то при открытии обработки в 1С, который лежит в iframe.

Случайный прохожий

4 — 23.10.19 — 12:49

Cannot read property document of null? На инфостарте прям недавно ветка поднималась (ошибка связанная с печатью из браузера). Но проблему пока не решили.

novichok79

5 — 23.10.19 — 12:54

(4) ПолеHTML.document = Неопределено

Cyberhawk

6 — 23.10.19 — 13:13

Ну так после 8.3.14.какой-то там это свойство упразднено

Cyberhawk

7 — 23.10.19 — 13:15

Вместо него в определенных сценариях теперь defaultView

novichok79

8 — 23.10.19 — 13:19

(7) defaultView это свойство поля «document», который = неопределено.

Garykom

9 — 23.10.19 — 13:25

acht

10 — 23.10.19 — 13:49

Garykom

11 — 23.10.19 — 13:55

(10) А что будет если веб-клиента 1С открыть в ie ?

acht

12 — 23.10.19 — 14:02

(11) Это тоже браузер что-ли?

novichok79

13 — 23.10.19 — 16:23

еще проблемка — как определить dblclick, это делать fireEvent onclick с какими-то параметрами 1С? как-то коряво получается.

DrWatson

14 — 23.10.19 — 16:31

I get the error: TypeError: Cannot read property ‘document’ of null on Infragistics.lob.js:880

Steps to recreate:

1: Hit script link which executes previewHTMLContent function (append the html to htmlEditor div).

2: Hit edit button which executes loadHTMLEditor function. This clears the content/styles/css of the htmlEditor div then loads the HTML editor with the content html.

3: Change the script by clicking on a new script link and the previewHTMLContent function is executed again with the new HTML

4: Hit edit button for new script. This is where the div empties out and the javascript error occurs. 

Once you load the HTMLEditor, are you unable to reload it?

HTML:

<div>
<div class=»col-md-4″>
<div class=»panel panel-default»>
<div class=»panel-heading»>
<button class=»btn btn-info pull-right» type=»button»><span class=»glyphicon glyphicon-plus»></span> Add</button>
<h3>Script Documents</h3>
<div class=»clearfix»></div>
</div>
<div class=»panel-body»>
<ul class=»nav nav-pills»>
@foreach (var script in @Model)
{
<li>
<span class=»glyphicon glyphicon-arrow-right pull-right»></span>
<a href=»BLOCKED SCRIPTvoid(0);» class=»btn btn-default btn-script» data-id=»@script.ID»>@script.Name</a>
</li>
}
</ul>
</div>
</div>
</div>
<div class=»col-md-8″>
<div class=»panel panel-default»>
<div class=»panel-heading»>
<button id=»Edit» class=»btn btn-info pull-right» type=»button» data-id=»»><span class=»glyphicon glyphicon-pencil»></span> Edit</button>
<h3>Details</h3>
<div class=»clearfix»></div>
</div>
<div class=»panel-body»>
<div id=»container»>
<div id=»htmlEditor»></div>
</div>
</div>
</div>
</div>
</div>

Javascipt:

$(function () {
$(‘a.btn-script’).click(function () {
var id = $(this).data(‘id’);
$.ajax({
url: «/Scripts/Display/»,
type: «POST»,
data: { id: id},
success: function (result) {
clearContent();
previewHTMLContent(result.script);
setEditDataId(id);
}
});
});

$(‘#Edit’).click(function () {
$.ajax({
url: «/Scripts/Display/»,
type: «POST»,
data: { id: $(this).data(‘id’) },
success: function (result) {
clearContent();
loadHTMLEditor(result.script);
}
});
});
});

function setEditDataId(id) {
$(‘#Edit’).data(‘id’, id);
}

function previewHTMLContent(script) {
var contentText = $(«<div/>»).html(script).text();
$(«#htmlEditor»).append(contentText);
}

function loadHTMLEditor(script) {
var height = $(‘html’).hasClass(‘touch’) ? 500 : 800,
contentText = $(«<div/>»).html(script).text();
var $igTBar = null;

$(«#htmlEditor»).igHtmlEditor({
height: height,
width: «98%»,
customToolbars: [
{
name: «DeleteContentButton»,
collapseButtonIcon: «ui-igbutton-collapse»,
expandButtonIcon: «ui-igbutton-expand»,
items: [{
name: «appendDeleteButton»,
type: «button»,
handler: appendDeleteButton,
scope: this,
props: {
isImage: {
value: false,
action: ‘_isSelectedAction’
},
imageButtonTooltip: {
value: «Clear all content»,
action: ‘_tooltipAction’
},
imageButtonIcon: {
value: «ui-icon-contact»,
action: ‘_buttonIconAction’
}
}
}]
}]
});

$(«#htmlEditor»).igHtmlEditor(«setContent», contentText, «html»);

changeToolbarsPosition();
}

function appendDeleteButton(ui) {
$(«#htmlEditor»).igHtmlEditor(«setContent», «», «html»);
}

function changeToolbarsPosition() {
$($(«#htmlEditor»).find(«span[id*=’insertObjectToolbar’].ui-igtoolbar»)).insertAfter($(«#htmlEditor»).find(«span[id*=’textToolbar’].ui-igtoolbar»));
}

function clearContent() {
$(«#htmlEditor»).empty();
$(«#htmlEditor»).removeClass();
$(«#htmlEditor»).removeAttr(‘style’);
}

Controller:

public ActionResult Index()
{
List<CRMScript> scripts = _CrmScriptRepository.GetAllScripts();

return View(scripts);
}

[HttpPost]
public ActionResult Display(int? id)
{
List<CRMScript> scripts = _CrmScriptRepository.GetAllScripts();

string script = scripts.FirstOrDefault(s => s.ID == id).Script;

if (script == null) HttpNotFound();

return Json(new {success = true, script});
}

TL;DR;

• You are accessing a property of an object that is null. For example, document.getElementById(‘stuff’) returns null. So adding .value will cause the error.
• You are trying to access a DOM element before the DOM is ready. Use onload or DOMContentLoaded.
• Test if an object is valid before accessing its property.

There are a few variations of this error depending on the property you are trying to access. Sometimes instead of null it will say undefined. An example will be:

Uncaught TypeError: Cannot read property 'value' of null

Uncaught TypeError: Cannot read property 'innerHTML' of null

All this means is that you are trying to access a property of an object that is undefined. These usually happens when we don’t test an object before using it. Here is a common scenario.

// We want to get the value of an input. 
var inputVal = document.getElementById("input").value;

This will result in Uncaught TypeError: Cannot read property 'value' of null. The reason will be that the element with id input does not exist. Let me break it down in simpler steps;

var input = document.getElementById("input"); 
input // when this fails, it returns null. input = null
var inputVal = input.value;
// this is the same as the following. 
var inputVal = null.value;
// null does not have the property 'value'

When you break it down, the error actually makes sense. To make sure that you don’t get this error, you have to make sure that btn, or any object you use, is not null before you use it. For our example:

var input = document.getElementById("btn");
var inputVal = "";
if (input) {
    inputVal = input.value;
}

Sometimes, your object is nested deeper like Tree.folder.path. You just have to make sure that if you need to access folder, than Tree has to be defined. And if you need to access path, then folder needs to be defined.

In some cases, this error is a symptom of another issue. Why would getElementById return null if the element actually exists on the page? Probably because the function is called before the DOM is ready. Always be careful when accessing a DOM element before it is ready.

Tag1 supports the Drupal Project.

getFrameDocument : function()
		{
			var $ = this.$;

			try
			{
				// In IE, with custom document.domain, it may happen that
				// the iframe is not yet available, resulting in "Access
				// Denied" for the following property access.
				$.contentWindow.document;
			}
			catch ( e )
			{
				// Trick to solve this issue, forcing the iframe to get ready
				// by simply setting its "src" property.
				$.src = $.src;

				// In IE6 though, the above is not enough, so we must pause the
				// execution for a while, giving it time to think.
				if ( CKEDITOR.env.ie && CKEDITOR.env.version < 7 )
				{
					window.showModalDialog(
						'javascript:document.write("' +
							'<script>' +
								'window.setTimeout(' +
									'function(){window.close();}' +
									',50);' +
							'</script>")' );
				}
			}

			return $ && new CKEDITOR.dom.document( $.contentWindow.document );
		},

diff --git a/includes/ckeditor.utils.js b/includes/ckeditor.utils.js
index 0a2aee8..ccd7c89 100644
--- a/includes/ckeditor.utils.js
+++ b/includes/ckeditor.utils.js
@@ -333,9 +333,9 @@ window.CKEDITOR_BASEPATH = Drupal.settings.ckeditor.editor_path;
     function(context, settings, trigger){
       $(context).find("textarea.ckeditor-mod.ckeditor-processed").each(function () {
         var ta_id=$(this).attr("id");
-        if (CKEDITOR.instances[ta_id])
+        if (CKEDITOR.instances[ta_id]) {
           $('#'+ta_id).val(CKEDITOR.instances[ta_id].getData());
-        if(trigger != 'serialize') {
+        //if(trigger != 'serialize') {
           Drupal.ckeditorOff(ta_id);
           $(this).removeClass('ckeditor-processed');
         }