external javascript file problem

[usdc-or]

I know you're going to say to need to see the site, but it's on an Intranet so I can't show you. But I've been banging my head against this for days.

I want to use an external js file (in my case, 295.js). I have wrapped my functions (currently just alert with the value of the element) in the code suggested here: http://fabrikar.com/forums/index.php?wiki/javascript/ to ensure fabrik.js is loaded and that it will function on new or edit. But I am getting an error: "TypeError: Fabrik is undefined."

I've also tried just:

requirejs(['fab/fabrik'], function () {  
   var name = Fabrik.getBlock('form_295').elements.get('inoutperson___io_type_raw');
   alert(name);
});

which results in this error: TypeError: Fabrik.getBlock(...).elements is undefined

What am I missing here? It's like it's not loading Fabrik.js.

I am not very strong with javascript. I'm at my wit's end. Any help is appreciated. FWIW, I notice my subscription likely ran out in March; I will see about that.

Best,
K

 

[cheesegrits]

Guess what? I need to see the site.

So when you say "external js", do you mean a file in the ./components/com_fabrik/js folder?

-- hugh

 

[usdc-or]

Yes, that's exactly what I mean. I can't grant you access (not within my powers) so I'll have to check on that with the higher ups.

Tell me at least though if I'm headed the right way. Just trying to get the value of an element (inoutperson___io_type).

 

[cheesegrits]

Yes, the Fabrik object should absolutely be defined, and I really can't tell you what the problem is without seeing the page.

However, even if the Fabrik object is defined, it is quite likely that either the form block itself won't exist at that point, or the elements won't have been added yet. JS is asyncronous, so the form and element init code may well not have finished running yet.

So you could do ...

requirejs(['fab/fabrik'], function () {
    var form = Fabrik.getBlock('form_2', false, function(form) {
        var el = form.elements.get('fab_main_test___name');
        var val = el.getValue();
        alert(val);
    });
});

... which will ensure the block itself exists. The inline function will get called as soon as the block exists.

Or you could do ...

requirejs(['fab/fabrik'], function () {
   // wait for the elements to be added to the form ...
   Fabrik.addEvent('fabrik.form.elements.added', function (form) {
       // make sure it's the form ID we want ...
        if (form.id == 2) {
            var el = form.elements.get('fab_main_test___name');
            var val = el.getValue();
            alert(cal);
        }
   });
});

... which will ensure the elements have all been loaded.

Note those examples are form my test form with id 2, obviously replace that with your ID.

-- hugh

 

[usdc-or]

Thank you Hugh. I will see if this works, and, if not, I'll see about getting you access. Not impossible, just hard... the guy I need is out of the office!

Kelly

 

[usdc-or]

The first solution, that checks for the block, did not do the trick, but the second, that ensures the elements have loaded, was the key to the puzzle. I really appreciate your suggestions; they helped so much.

One more question--now I will have to check if I am loading a form or a detail view. I have added

var form = Fabrik.getBlock('form_295');

inside the

 Fabrik.addEvent('fabrik.form.elements.added', function (form) {

so that I can test if it is false (as recommended elsewhere on this site). So far it is working. Do I need to do something to ensure the block will load first every time (like your code above) ?

Thanks again,
Kelly

 

[cheesegrits]

Nope, you don't need to do anything to check the block has loaded. The fabrik.form.elements.loaded event only ever fires once all the elements have been initialized, and the block has been created.

-- hugh

 

[usdc-or]

Thank you for your help, I really appreciate it!