I would like to refactor a single page web application project to use Browserify as its JavaScript loading schema. I've researched Browserify but there are still things that I don't know how to solve. Allow me to describe the JavaScript loading schema that is used in the project that I want to refactor.
The first script element is inline to the generated HTML. We need that in order to pass Backend configuration to the JavaScript engine. For example:
<script type="text/javascript">
var OUR_COMPANY = {
settings: {
user: '${user}'
}
};
</script>
Then we begin to load JavaScript files from a CDN and local project in an intermixable manner (notice that we use a Backend variables once again to distinguish where the JavaScript file is located):
<!-- resURL means CDN -->
<script type="text/javascript" src="${properties.resURL}/js/jquery/jquery-2.0.3.min.js"></script>
...
<!-- managerURL means local project -->
<script type="text/javascript" src="${properties.managerURL}/js/the_project/grids/InlineEdits.js"></script>
...
<script type="text/javascript" src="${properties.resURL}/js/jquery/plugin/jqgrid/v4.6.0/js/jquery.jqGrid.m1.min.js"></script>
Can somebody please give me an idea on how to convert this project's JavaScript loading schema so as to replace it with Browserify?
Related
Situation:
I have a server side running with express.js and there I get data from SQL database. I would like to show this data to the client side, by sending it to the client.
In the front-end, I need to take this data and make it into a chart. It is possible to do it with the tag in the HTML and include the Plotly library, which I want to use. However, I would like this operation to be done in a separate file, an external JS script for client. This avoids hard-to-read code in the HTML.
The problem is, how can I import Plotly to the external front-end file and use it?
I hope I understood your need correctly :
One simple option would be to include both of your script in your html related document with the one required by the second one first :
...
<script src="path script 1" />
<script src="path script 2 depending on script 1" />
so in your case using CDN :
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<script src="path of your script where you use ploty"></script>
PS:
Also just a proposition but did you thing about importing Ploty in your js backend and use it in your front-end ? or with post/get or with socket ?
Well, simply load it from a CDN :) That's what CDNs are here for
<script src="https://cdnjs.cloudflare.com/ajax/libs/plotly.js/1.33.1/plotly-basic.min.js">
I’m using Odoo controller to create a web page and make it public to customer so he doesn’t need to login.
In this page I’m trying to use CSS and JS libraries which exists in files inside the module (static folder).
The problem is that the page can’t reach these resources because it searches for them in the domain of the URL not in the filesystem (ex. http://localhost:8069/mywebpage)
I tried to inherit the template and the qweb design and inject the files but I got the same problem.
<template inherit_id="..."> <xpath expr="." position="inside"> <link rel="stylesheet" href="...">
The only solution I have found is copy/paste the source code of the JS libraries and CSS inside the template which is not a practical solution.
How can I make the routed page access the CSS and JS resources inside Odoo module?
Just put the module path of your assets resources, like:
<link rel="stylesheet" href="/your_custom_module/static/src/css/file.css">
And be sure the file will be there, the same for js script definition.
Also you should include in your posts the exact info and value that you are using, not .... It doesn't help you into get a response using ..., it just makes things difficult.
I am getting problem in referencing Javascript file.
My all js files reside in my js folder:MyProject/Js/*.js
Now on my master page i am refering my file like this:
<script src="js/jquery-1.9.1.js"></script>
<script src="js/jquery-1.9.0.min.js" type="text/javascript"></script>
Error showing in console:
SyntaxError: expected expression, got '<'.
On searching i have found that this issue comes due to inappropriate referencing of js files so i have resolve this error by doing this:
<script src="../js/jquery-1.9.1.js"></script>
<script src="../js/jquery-1.9.0.min.js" type="text/javascript"></script>
This above solution works when my .aspx page would be like this:
MyProject/Admin/Abc.aspx //This will work
But problem will occur when any of my .aspx page would be like such:
MyProject/Admin/Subfolder/Abc.aspx // This will not work
My Abc.aspx page contains master page but now in this case this will not load my js files due to ../
So can anybody tell me whats the correct way to reference js files which will work in both the cases??
Note:I am referencing all js files in to my master page and my master page is in:
MyProject/MasterPage.Master
I think you can give a try:
1) Use Bundling to reduce the loading time (Your script will be shorter as well)
2) Use ~/ instead of ../ to make your script/code work even if you relocate the pages.
You can easily find the scripts and codes of jquery bundle if you create a new ASP.NET application in Visual Studio.
I am new to Jquery and AJAX. I am trying to upload the file using AJAX call. When I set the script reference as from website, its working fine, but when I download it and set reference as local folder, its not working. What is wrong with my code?
When I use :
<script src="http://malsup.github.com/jquery.form.js"></script>
its working fine,
but when I use
<script type="text/javascript" src="http://localhost:8080/Upload/js/jquery.js"></script>
or
<script type="text/javascript" src="js/jquery.js">
its not working......
Add jquery.form.js library in your website folder under js folder, and
Change
<script type="text/javascript" src="js/jquery.js">
To
<script type="text/javascript" src="js/jquery.form.js">
This version points to a file on that web site:
<script src="http://malsup.github.com/jquery.form.js"></script>
This version points to a file on your LOCAL server (machine) via port 8080 (usually NOT a great idea)
<script type="text/javascript" src="http://localhost:8080/Upload/js/jquery.js"></script>
This verison points to a js folder relative to the page it is linked on
<script type="text/javascript" src="js/jquery.js">
In order to use a file locally (like the last two), you will need to download that file, and save it to your web server (or local server) in a folder. In the second example, this would mean saving it to the Upload\js folder at the root of your local servers site (that machine).
In the third example, you would need to find the page it is linked in, create (if not present) a js folder under that folder and save the js file at that location.
Note that it is always a good idea to use the original name form or something similar rather than jQuery.js - as that is often confused with the jQuery library itself.
An examples might be save it as:
jquery.form.js
malsup.jquery.form.js
malsup.version1.jquery.form.js
or some such named instance.
NOTE One way of making this as generic as might be would be to use
<script type="text/javascript" src="/Upload/js/jquery.js"></script>
This points to a folder called Upload with a sub folder js (Upload\js)which is based at the root of your web site. For instance if your site is based at your windows e: drive in a wwwroot folder it might be:
E:\wwwroot\Upload\js\malsup.jquery.form.js
Is there any way to use ASP.NET's 'web application root' operator ~ in a script tag? If not, is there any way to mimic such behavior?
My application uses nested master pages for different sub directories; A content page uses its directory-specific master page, which uses the root master page. I'd like to be able to include my <script> tags in the root master page, so I'm not repeating code all over the place, but since I don't necessarily know the depth of the path for any given content page, I can't reliably provide paths to the scripts folder.
I considered using paths in the form /scripts/jquery.js, but since the Visual Studio development server starts the application in a subdirectory of the server root, this will not translate well to the live server. To illustrate:
<!-- dev server path -->
<script type="text/javascript" src="/my_project/scripts/jquery.js"></script>
<!-- live server path -->
<script type="text/javascript" src="/scripts/jquery.js"></script>
You can, of course see the issue. Since I am not the only developer on the project, I have very little control over what happens in the "go live" process; otherwise, it could just be a matter of removing /my_project in the "go live" process.
There are some possible cases on that.
1) For large project use the local iis5.1 or other local iis, and not the VS web that runs.
2) You can avoid the first spash and use relative paths... eg:
<script type="text/javascript" src="scripts/jquery.js"></script>
<script type="text/javascript" src="../scripts/jquery.js"></script>
so you do not force him to start from beggining.
3) You can place a literal control there and just render the script tag on Page_Load with the correct path every time
4) and you can just render the src on page
<script type="text/javascript" src="<%=ResolveUrl("~/scripts/jquery.js")%>" ></script>
I am using the 1 and 3.