• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

XF 2.0 Extend Js

XenConcept

Formerly Rémi C
#1
I'm trying to extend my class js but I can not seem to get the original options

Original :

JavaScript:
XF.SendMessage = XF.Click.newHandler({

   eventNameSpace: 'XFSendMessageClick',
  
    options: {
       url_post: '{{ link('test/post.json') }}'
    
    },
    
    init: function () {},
    click: function (e) {}
});

XF.Element.register('send-message', 'XF.SendMessage');
Extend :

JavaScript:
 XF.Element.extend('send-message', {


        options: $.extend({}, XF.SendMessage.prototype.options, {

            test: 'test'

        }),

        init: function () {

        },

        click: function (e) {


            console.log(this.options)

        }




    });

Thank you for your help
 

Mike

XenForo developer
Staff member
#2
Your original object is a click handler system, the latter is trying to extend via the element handler system, though I would expect the options to be available since you effectively defined them locally.
 

XenConcept

Formerly Rémi C
#3
I did not understand.

My first code is in the template.

Code:
<xf:js>
XF.SendMessage = XF.Click.newHandler({

   eventNameSpace: 'XFSendMessageClick',
 
    options: {
       url_post: '{{ link('test/post.json') }}'
   
    },
   
    init: function () {},
    click: function (e) {}
});

XF.Element.register('send-message', 'XF.SendMessage');
</xf:js>
<xf:js src="test/test.js" />
The code in the JS file:

JavaScript:
 XF.Click.extend('send-message', {


        options: $.extend({}, XF.SendMessage.prototype.options, {

            test: 'test'

        }),

        init: function () {

        },

        click: function (e) {


            console.log(this.options)

        }




    });
But I do not have enough code options in the template
 

XenConcept

Formerly Rémi C
#4
Then I change the code of the file by:

JavaScript:
 XF.Click.extend('send-message', {




        init: function () {

        },

        click: function (e) {


            console.log(this.options)

        }




    });
This shows me the options of the template but how to define other in the file?
 

Mike

XenForo developer
Staff member
#5
I'm not clear why you're mixing JS code in a template and code in a file. All of this should be in a file. You would pass in any changed values for options when you need it. (See how XF calls various handlers with options.) This is likely the problem as the code is not executing in the order you expect.
 

XenConcept

Formerly Rémi C
#6
I'm not clear why you're mixing JS code in a template and code in a file. All of this should be in a file. You would pass in any changed values for options when you need it. (See how XF calls various handlers with options.) This is likely the problem as the code is not executing in the order you expect.

I mixed the codes because I have options in the panel and I declare them in the template.

Is there other solution?