I would like to utilize the external multi modal Github script in meteor to run with bootstrap modals taken from a meteor bootstrap package I have installed on my app. There is no meteor package for this. I'm using the $.getScript() jQuery function to get the source JS file. It is set up like such:
Meteor.startup( function () {
$.getScript("https://cdn.rawgit.com/ngzhian/multi-step-modal/master/multi-step-modal.js");
});
Unfortunately when I include this, the file from the URL gets loaded but the modal functionality doesn't work. I believe that all the HTML is correct. Is there an alternative way to include third party libraries? Could the library possibly be broken?
Meteor.startup( function ()
{
$.getScript("https://cdn.rawgit.com/ngzhian/multi-step-modal/master/multi-step-modal.js",function()
{
// Here the script is loaded and you can use it's functions
});
});
Related
I want to load a script and after executing this script launch a trigger. Formerly we did it with jquery and now we go to Alloyui. I'm trying to do this in Liferay 7 with AlloyUI. But I can't find the way, how can I do it?
jQuery.getScript("http://localhost:8082/js/test.js")
.done(function( script, textStatus ) {
work();
$(document).trigger('testEvent');
}
Thank you
Use aui:script to load modules within Liferay DXP (7.x).
The aui:script tag is a JSP tag that loads JavaScript in script tags on the page, while ensuring that certain resources are loaded before executing.
It tag supports the following options:
require: Requires an AMD module that will be loaded with the Liferay AMD Module Loader.
use: Uses an AlloyUI/YUI module that is loaded via the YUI loader.
position: The position the script tag is put on the page. Possible options are inline or auto.
sandbox: Whether to wrap the script tag in an anonymous function. If set to true, in addition to the wrapping, $ and _ are defined for jQuery and underscore.
Example: if you want to load the module foo and use its default function, you can use the following:
<aui:script require="path_to_foo_module as foo">
foo.default('', {
// Your code here;
});
</aui:script>
Here is the real application that is being used at official liferay portal: https://github.com/liferay/liferay-portal/blob/master/modules/apps/commerce/commerce-order-web/src/main/resources/META-INF/resources/commerce_order/general.jsp#L430-L437. Where it calls the JS module at here: https://github.com/liferay/liferay-portal/blob/master/modules/apps/commerce/commerce-frontend-js/src/main/resources/META-INF/resources/components/summary/Summary.js
my friends. I am writing an simple app in electron framework-- basic just Node.js as end and HTML as front.
I try to use jquery lib in my html page like this :
$(document).ready(function(){})
The werid part is, if I run this HTML directly in browser, the jquery could work.But when I use it as a part of my electron project,ego:dependency. The jquery could not work.I have tried both use external source and local file.
I get a error like this:
Uncaught Reference Error: $ is not defined
And in the dev tool: the source panel could show the domain and the file I want to use.
But the network panel did not show correspond information as while open in browser does.
npm install jquery in your project then import jquery as $
I'm trying to make a web application using Node.js and Express and PugJS as a template engine.
My problem: I'm using a google maps API and I want to code all my google maps API functions into a separate javascript file. I can't figure out how to render this external javascript file in the pugJS page and call to functions from the external js file.
Thats pretty easy; you should use the tag script, like follows;
// jquery as an example, include your own script
script(src='/assets/plugins/jquery/jquery.min.js')
script.
// call your functions here
$(function () {
alert('hey')
})
So I'm trying to inlcude an external .js file in my SAPUI5 Controller.
jQuery.sap.includeScript("externalLibrary.min.js",
function() {
//initalizing objects from library
});
However, the callback which should be called once the script is loaded, never gets called. The error message it gives me is:
"externalLibrary.min.js:16 Uncaught TypeError: Cannot read property
'Constructor' of undefined"
Whats another way I could do this? I was looking into jQuery.sap.registerModulePath() and jQuery.sap.registerResourcePath() but couldn't find a good example of the use of these nor an explaination of the difference between the two online.
Thanks a lot!
You can try jQuery.sap.includeScript(vUrl, sId?, fnLoadCallback?, fnErrorCallback?)
https://sapui5.hana.ondemand.com/docs/api/symbols/jQuery.sap.html#.includeScript
in fiori launchpad based app , we use component.js as root , so we don't have index.html to include scripts (if you use XML view instand of HTML view).
try
jQuery.sap.includeScript({
url: "https://maps.googleapis.com...",
id: "IncludeGoogleMapsScript"
}).then(function() { ... })
Not working in portal service , fallback is provided :
UsingjQuery.sap.includeScript().then() in HCP Firori Launchpad
You can use jQuery.sap.registerResourcePath('lib', URL) and then jquery.SAP.require('lib.file'). You can do both one after another or register in the init and later require. Does not matter. I don't have an example at hand as I am on a phone but it works. What you need to keep in mind is that this example would load something like URL/file.js so you need to adjust accordingly. The name you give to the lib does not matter.
You can also inject a script tag into the current page ,however, the require will load the external lib synchronously while if you inject a script tag you need to wait until it is loaded with a callback.
PS: the capitalization on those methods is not right
Got it! For future reference, it works to load the files from the index html like so:
<script src="library.js"></script>
The main problem was that I was trying to include external dependencies which also contained jQuery. So, I had to remove that from the file and now it's working.
I want to lazy load all the 3rd party JS/CSS after my home page is displayed since the external plugins etc are used when user navigates away from home page onto some specific module.
So far I have succeeded for normal .js & .css external libraries thanx to http://wonko.com/post/lazyload-200-released
However this fails for a path like this http://maps.google.com/maps/api/js?sensor=true
Code:
LazyLoad.js('http://maps.google.com/maps/api/js?sensor=true', function () {
alert('Your JS has been loaded');
});
I think the solution would be how to lazy-load web url?
I believe you want something like:
$.getScript('http://maps.google.com/maps/api/js?sensor=true');
using jQuery. The API will give details of the call back. Else Google may have some mechanism requiring it to be present from load. Just a guess.
Found a solution:
Check the URL:'http://maps.google.com/maps/api/js?sensor=true'
You would find main.js is being imported by it . A simple getScript for sensor=true will not give whole google object so next import also required.
var t=setTimeout(function(){
jQuery.getScript('http://maps.google.com/maps/api/js?sensor=true');
jQuery.getScript('http://maps.gstatic.com/intl/en_us/mapfiles/api-3/10/20/main.js');
},1000);