admin管理员组文章数量:1135242
I'm debugging a visual composer plugin that broke after I updated WordPress to 4.5 and I can't figure out why it is throwing a TypeError.
The error message in the console:
JQMIGRATE: Migrate is installed, version 1.4.0 load-scripts.php?....
Uncaught TypeError: $template.get is not a function composer-view.js?ver=4.1.1.1:73
The only occurrences of $template are found in the code below. I understand that this isn't very much context to go off of but, how can I resolve this error?
/**
* Convert html into correct element
* @param html
*/
html2element: function(html) {
var attributes = {},
$template;
if (_.isString(html)) {
this.template = _.template(html);
$template = $(this.template(this.model.toJSON()).trim());
} else {
this.template = html;
$template = html;
}
_.each($template.get(0).attributes, function(attr) { // **errors on this line**
attributes[attr.name] = attr.value;
});
this.$el.attr(attributes).html($template.html());
this.setContent();
this.renderContent();
},
Update:
It looks like this might be a problem with jQuery. WordPress 4.5 includes jQuery 1.12 which fixed a bug that allowed certain code to be run with incorrect syntax. I assume that the plugin code must have had incorrect syntax but ran nonetheless until now.
I'm debugging a visual composer plugin that broke after I updated WordPress to 4.5 and I can't figure out why it is throwing a TypeError.
The error message in the console:
JQMIGRATE: Migrate is installed, version 1.4.0 load-scripts.php?....
Uncaught TypeError: $template.get is not a function composer-view.js?ver=4.1.1.1:73
The only occurrences of $template are found in the code below. I understand that this isn't very much context to go off of but, how can I resolve this error?
/**
* Convert html into correct element
* @param html
*/
html2element: function(html) {
var attributes = {},
$template;
if (_.isString(html)) {
this.template = _.template(html);
$template = $(this.template(this.model.toJSON()).trim());
} else {
this.template = html;
$template = html;
}
_.each($template.get(0).attributes, function(attr) { // **errors on this line**
attributes[attr.name] = attr.value;
});
this.$el.attr(attributes).html($template.html());
this.setContent();
this.renderContent();
},
Update:
It looks like this might be a problem with jQuery. WordPress 4.5 includes jQuery 1.12 which fixed a bug that allowed certain code to be run with incorrect syntax. I assume that the plugin code must have had incorrect syntax but ran nonetheless until now.
https://wordpress.org/support/topic/read-this-first-wordpress-45-master-list#post-8271654
Share Improve this question edited Apr 13, 2019 at 17:39 Maxime 8,9595 gold badges51 silver badges54 bronze badges asked Apr 13, 2016 at 17:23 spencer.smspencer.sm 20.5k10 gold badges84 silver badges96 bronze badges 3- 6 Instead of including an image of your error message, please include it as text. This will help future readers who have a similar error message find your question through search. – buczek Commented Apr 13, 2016 at 17:26
- any success fixing this so far? – rubmz Commented Apr 14, 2016 at 7:07
- I have this error now: stackoverflow.com/questions/37090595/… – Graham Slick Commented May 7, 2016 at 16:39
10 Answers
Reset to default 125I was able to resolve the issue. Turns out I was using an older version of JS composer. Updating to the newest version broke my site so I tracked down the error and updated the html2element function to
html2element: function(html) {
var $template, attributes = {},
template = html;
$template = $(template(this.model.toJSON()).trim()), _.each($template.get(0).attributes, function(attr) {
attributes[attr.name] = attr.value
}), this.$el.attr(attributes).html($template.html()), this.setContent(), this.renderContent()
},
I was still getting this error after trying the patch in Ben's answer: Uncaught TypeError: Cannot read property 'custom' of undefined
So I modified the html2element in composer-view.js as follows:
html2element: function(html) {
var $template, attributes = {},
template = html;
$template = $(template(this.model.toJSON()).trim());
if($template.get(0))
{
_.each($template.get(0).attributes, function(attr) {
attributes[attr.name] = attr.value
})};
this.$el.attr(attributes).html($template.html()),
this.setContent(),
this.renderContent()
},
@Ben This works perfect!
Cause: Admin was not loading the correct visual editor for js_composer plugin after updatethis plugins.
=====================================================
Error:
Error: TypeError: $template.get is not a function Source File: wp-content/plugins/js_composer_salient/assets/js/dist/backend.min.js?ver=4.10 Line: 4047
=====================================================
Solution Goto file /wp-content/plugins/js_composer_salient/assets/js/dist/backend.min.js around line 4045:
======> Replace the code =====================================================
html2element: function(html) {
var $template, attributes = {};
_.isString(html) ? (this.template = _.template(html), $template = $(this.template(this.model.toJSON(), vc.templateOptions["default"]).trim())) : (this.template = html, $template = html), _.each($template.get(0).attributes, function(attr) {
attributes[attr.name] = attr.value
}), this.$el.attr(attributes).html($template.html()), this.setContent(), this.renderContent()
},
======> Replace with this code ========================================
html2element: function(html) {
var $template, attributes = {},
template = html;
$template = $(template(this.model.toJSON()).trim()), _.each($template.get(0).attributes, function(attr) {
attributes[attr.name] = attr.value}),
this.$el.attr(attributes).html($template.html()), this.setContent(),
this.renderContent()
},
Noticed that code was not being passed into the html2element function, but did exist in the function calling it (render)
The following code has completely corrected my problems, I can load the page, add, clone, remove, etc
render: function () {
var $shortcode_template_el = $( '#vc_shortcode-template-' + this.model.get( 'shortcode' ) );
if ( $shortcode_template_el.is( 'script' ) ) {
var newHtmlCode = _.template( $shortcode_template_el.html(),
this.model.toJSON(),
vc.templateOptions.default );
if(!_.isString(newHtmlCode)){
newHtmlCode = $shortcode_template_el.html();
}
this.html2element( newHtmlCode );
} else {
var params = this.model.get( 'params' );
$.ajax( {
type: 'POST',
url: window.ajaxurl,
data: {
action: 'wpb_get_element_backend_html',
data_element: this.model.get( 'shortcode' ),
data_width: _.isUndefined( params.width ) ? '1/1' : params.width,
_vcnonce: window.vcAdminNonce
},
dataType: 'html',
context: this
} ).done( function ( html ) {
this.html2element( html );
} );
}
this.model.view = this;
this.$controls_buttons = this.$el.find( '.vc_controls > :first' );
return this;
},I'm using the theme Applay (2.1.3, a bit outdated). I've just updated WP and all the plugins to the most recent version (4.5.2) and came to this issue as well. I did not analyzed the flow of this component (js_composer), just this "broken" function (it's not really broken). I realized that this.template and $template are getting wrong object types (it needs another validation aside _.isString(html)). I solved it by adding a try & catch block as follows:
ORIGINAL
html2element:function (html) {
var attributes = {},
$template;
if (_.isString(html)) {
this.template = _.template(html);
$template = $(this.template(this.model.toJSON()).trim());
} else {
this.template = html;
$template = html;
}
_.each($template.get(0).attributes, function (attr) {
attributes[attr.name] = attr.value;
});
this.$el.attr(attributes).html($template.html());
this.setContent();
this.renderContent();
},
MODIFIED
html2element:function (html) {
var attributes = {},
$template;
if (_.isString(html)) {
this.template = _.template(html);
} else {
try {
this.template = _.template(html());
} catch (err) {
this.template = html;
}
}
$template = $(this.template(this.model.toJSON()).trim());
_.each($template.get(0).attributes, function (attr) {
attributes[attr.name] = attr.value;
});
this.$el.attr(attributes).html($template.html());
this.setContent();
this.renderContent();
},
I am using the Astra theme. This fix is 99.9 % working. For some tho, this only stops the spinning wheel, but once the page loads visual composer does not.
I made a slight change to this code (that is posted everywhere by now)
Original Astra theme code here (composer-view.js)
html2element:function (html) {
var attributes = {},
$template;
if (_.isString(html)) {
this.template = _.template(html);
$template = $(this.template(this.model.toJSON()).trim());
} else {
this.template = html;
$template = html;
}
_.each($template.get(0).attributes, function (attr) {
attributes[attr.name] = attr.value;
});
this.$el.attr(attributes).html($template.html());
this.setContent();
this.renderContent();
},
The code that works :
html2element: function(html) {
var $template,
attributes = {},
template = html;
$template = $(template(this.model.toJSON()).trim()),
_.each($template.get(0).attributes, function(attr) {
attributes[attr.name] = attr.value
}); this.$el.attr(attributes).html($template.html()), this.setContent(), this.renderContent()
},
The main difference is located here (versus original code)
}); this.$el.attr
There is a semicolon instead of the original comma :) :
}), this.$el.attr
Cheers folks :) So
Well, i found the solution in this site: https://wordpress.org/support/topic/visual-composer-is-not-working
first: edit html2element:.... in in /wp-content/plugins/js_composer/assets/js/backend/composer-view.js
html2element: function(html) {
var $template, attributes = {},
template = html;
$template = $(template(this.model.toJSON()).trim()), _.each($template.get(0).attributes, function(attr) {
attributes[attr.name] = attr.value
}), this.$el.attr(attributes).html($template.html()), this.setContent(), this.renderContent()},
second: However if you open up the frontend editor you'll have this "trim" issue on custom_views.js:101 , and line 467 of another file. I forgot the name, but I think it may be frontend_editor.js.
edit in: \wp-content\plugins\js_composer\assets\js\frontend_editor\
- frontend_editor.js
- custom_views.js
Bad code:
this.$controls = $( _.template( template, data, _.extend( {},
vc.template_options,
{ evaluate: /\{#([\s\S]+?)#}/g } ) ).trim() ).addClass( 'vc_controls' );
Fixed code:
this.$controls = $( _.template( template, data, _.extend( {},
vc.template_options,
{ evaluate: /\{#([\s\S]+?)#}/g } ) )().trim() ).addClass( 'vc_controls' );
third: See the black magic.
Cheers.
Checkout below code for both $template.get is not a function and Uncaught TypeError: Cannot read property 'attributes' of undefined. Worked for me.
html2element: function(html) {
var $template, attributes = {},
template = html;
$template = $(template(this.model.toJSON()).trim());
if($template.get(0))
{
_.each($template.get(0).attributes, function(attr) {
attributes[attr.name] = attr.value
})};
this.$el.attr(attributes).html($template.html()),
this.setContent(),
this.renderContent()
}
I made this modification that works on my WP 4.8.1 (PHP7)
in the file wp-content/plugins/js_composer/assets/js/backend/composer-view.js
you must modify the render method :
replace this line
this.html2element(_.template($shortcode_template_el.html(), this.model.toJSON()));
by this line
this.html2element( $shortcode_template_el.html() );
It seems the _.template() function that doesn't work perfectly and doesn't return the good object, so better give the html code instead.
try updating your theme. Goto Appearance>Themes, and check for an update. This resolved the issue for me automatically upon update.
The error arises when you update to WP 4.5 for me running the Nimva theme. You have to update to 2.02 of Nimva, which allows auto updates.
本文标签： javascriptPlugin throwing TypeError after WordPress 45 updateStack Overflow
版权声明：本文标题：javascript - Plugin throwing TypeError after WordPress 4.5 update - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1736919853a1956424.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论