Visual composer doesn't load and gives TypeError: _.template(...).trim is not a function

Question

My visual composer plugin doesn't work. It stuck on the loading page. And it gives an error "TypeError: .template(...).trim is not a function" Error is on this line of code: this.$controls = $(.template(template, data, vc.template_options).trim()).addClass('vc_controls');

Please help me to fix this out.

Here is the error which I get:

Answer 1

If you are unable to solve this error by upgrading or downgrading your theme or plugin, you could at least make the below changes.

1. Open the following two files:

wp-content\plugins\js_composer\assets\js\frontend_editor\frontend_editor.js
wp-content\plugins\js_composer\assets\js\frontend_editor\custom_views.js

2. Replace

this.$controls = $( _.template( template, data, vc.template_options ).trim() ).addClass( 'vc_controls' );

with

this.$controls = $( ( "vc.template_options" ).trim() ).addClass( 'vc_controls' );

This will surely work.

Answer 2

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 = {},
        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()
},