How can i use Ajax request on multiple files? - javascript

I have a JavaScript file called newsletter_init.js and it makes an Ajax request.
I add this JS file to every .php on my project and the issue here.
For example I use newsletter_init.js in my index.php and a URL for the ajax request will be res/ajax/request_newsletter.php.
Ok, that's working but when I add the same JS file on another directory for example adding newsletter_init.js on a index.php but placed on blog folder the URL will be invalid as it will search for ../res/ajax/request_newsletter.php instead of res/ajax/request_newsletter.php.
File structure about the scope:
index.php
blog > index.php
I have another way to do this:
Add content of newsletter_init.js on every file and change url but this is not a good way to approach this.
I have tried to use __DIR___ in PHP but i don't understand how to use it in this situation.
I have tried $(location).attr(pathname); in jQuery but it return the fild name also for example localhost/homepage/index
I can't use a direct url as i will change from localhost to my site so, i need a dynamic way.

Just ensure your path is relative to the root directory.
/res/ajax/request_newsletter.php
Not:
res/ajax/request_newsletter.php
If you don't add the first slash, it will try to find that path starting in the directory where you are making the call (i.e. wherever your current PHP script is running).

Related

How to get the url serving the current js file

Suppose I have a site at www.somewhere.com that loads a javascript file called Test.js hosted at www.aplace.com. From within Test.js, how can I get the url www.aplace.com?
When I use window.location, I get the url of the site (somewhere.com) instead of the url of Test.js.
The reason I am asking is because I need to make a post request from Test.js to www.aplace.com/dirA/dirB/dirC/Test.js to www.aplace.com/dirD but I can't hardcode the URL.
They should be in <script> in src='{THE_URL}', perhaps try scraping if API is not present.

window.open() not working when the file location is within a subfolder

I am quite new to programing so I apologize for any blatant ignorance, but, I can't find this answer.
I am using window.open() to open a .php file in a popup and passing a variable within the URL for use with $_GET.
Everything works fine when the .php page file I am opening is located in my main directory, for example:
window.open("../filetoopen.php?link="+variable, ...)
But, when I move filetoopen into a different subfolder and change the path, the webpage will not load.
example:
window.open("../subfolder/filetoopen.php/link="+variable, ...)
Just as a side note, I am working on a web app that has been developed by multiple people over several years and have only just begun familiarizing myself with its inner workings.
Any insight/suggestions would be much appreciated.
I figured out the issue:
There was another .php file located in the root directory which was needed to be referenced for the page to load.
example:
include 'utils.php';
And, when I moved the file within the subfolder, I did not change the path of the other file as well.
example:
include '../utils.php';
Thank you for all your responses.

PHP to Javascript: dirname and document_root

I got a little problem. I am working on a project and I got my root, then I got 2 folders: website1 and website2.
website1 is the staff panel, where the upload script is on (where this problem is on). website2 is the website the 'customer' will see. Here all the uploaded images, PDFs etc. are uploaded to.
So, I have a few notes before I start:
I cannot use PHP in my Javascript. The Javascript is in .js files and not in my .php file.
I cannot do this at my AJAX request as something client-side has to be done correctly to see the image.
So basically, I am in website1 and when I upload a file (with DropzoneJS (http://www.dropzonejs.com/)) it does a AJAX request. Here it has to upload a file to a directory in website2. In website1 I have to see that image after uploading it in a IMG tag.
So in PHP I got this:
$uploadPath = filter_input(INPUT_POST, 'uploadPath');
$uploadPath = dirname(getenv('DOCUMENT_ROOT')) . '/' . $uploadPath;
This works and the file gets uploaded to that directory. $uploadPath is this (in Javascript, sent as POST parameter in AJAX request):
/SITE2/assets/uploads/
Now I need to translate the dirname and getenv('DOCUMENT_ROOT') into Javascript. I tried document.location.hostname but this does return a different value than getenv('DOCUMENT_ROOT').
document.location.hostname: 127.0.0.1
getenv('DOCUMENT_ROOT'): D:/xampp/htdocs
How can I get the same value as getenv('DOCUMENT_ROOT') in Javascript?
In php file you can create script with JavaScript variable like this:
<script>
var DOCUMENT_ROOT = "<?= getenv('DOCUMENT_ROOT') ?>";
</script>
the other option is to have your JavaScript file as PHP script then you can use PHP code inside.
You have two options, but I caution you sending the actual file path on the server/disk to the client side is a bad idea.
Use Ajax so the client sends a request like $.ajax({url: "getdir.php", success: someJSFuntion } );
Change your JavaScript file to be a ".php" file and then include the code right in there.
There is no spec that says you can't have your JS file be a ".php" file. So you'd link to it like this:
<script type="text/javascript" src="/js/myjs.php"></script>
And that would let you use PHP directly in your JS file.
Check out php.js for a JavaScript port of dirname...
http://phpjs.org/functions/dirname/
As for getenv('DOCUMENT_ROOT'), you can't get this variable value via JavaScript. The reason for this is the client-side "location" of the JavaScript file says nothing about it's actual location on the server. The best you can do is get the parent directory of the file or the domain name.
For example:
http://example.com/path/to/file
The "DOCUMENT_ROOT" as far as JavaScript is concerned is...
/path/to
It seems very improper to even assume the need to have the server-side location of the file available to the JavaScript. I would simply use either a specific URL query that indicates what location to use, or to send the location back with the AJAX response since you can add whatever you need there.
{
"document-root": "/SITE2/assets/uploads/",
"normal-response": {
...
}
}
And then wherever you would normally use what is normally received, this use...
// For example
var response = JSON.parse (request.responseText);
// Normal response
console.log (response['normal-response'][...]);
// Document Root
console.log (response['document-root']);

Call javascript code on page using PageAsyncTask

I have two ASPX pages (P1.aspx and P2.aspx). The first (P1.aspx) contains a lot of JavaScript code.
How can I call all this JavaScript from another page (P2.aspx)?
I tried to do this using PageAsyncTask from code behind of P2.aspx, but JavaScript code (on P1.aspx) didn't work.
Any suggestions?
you cant do that.
put the javascript into JS file and reference it when needed.
What you can do ( I think) is to get the HTML content of the file and then EXTRACT the JS data
edit
try that (I dont think that it will include the inside JS - but try it yourself)
WebRequest oRequest;
WebResponse oResponse;
oRequest = WebRequest.Create("http://www.google.com/");
oResponse = oRequest.GetResponse();
StreamReader sr = new StreamReader(oResponse.GetResponseStream());
string pagedata = sr.ReadToEnd();
pagedata+=#"sdfsdf";
All javascript code you want to use on a page has to be included in that page or dynamically loaded by that page. You cannot call code that is only in another page.
The usual way of sharing code among pages is to have a .js file that contains common code that is included in more than one page and then a .js file that contains code that is unique to each specific page (if required).
One way to do this is <!--#INCLUDE FILE="somefile.aspx" --> but your aspx page will complain that there can be only one 'page' directive. So in order to do this properly you need to include as the previous mentiond the js files in the aspx file.
One way is makeing a master page and include all the necessary js code in there, then all pages that are loaded within the masterpage will automatically inherit the javascript included libraries.
Another way is to make an html file that includes all the libraries and then use the <!--#INCLUDE FILE="myjslibs.html" --> to include all your code there to each page.
So actually copy all your code in one file and then include that just one file each time in every page.

jQuery conflicts with another jQuery library

I am currently trying to implement a jquery slider into a joomla website.
I already implemented NoConflict(); so that it doesn't step into joomla. And it works, BUT for another reason wich I do not understand it enters another jquery file called jsloader.js of a plugin I use for picture gallery display.
I suppose all the module jquery files get preloaded before the one im calling inside the template.
it enters the function() in the jsloader.js instead of the one in my jquery file.
How Can I force it to enter my jquery file instead of other
The first problem is that you've got the jquery.js file coming after the jsloader.js file. You need to make sure that jquery.js is included before any plugins - the order is important.
The second problem is that this:
<script type="text/javascript" src="//templates/template/js/jquery-1.2.6.min.js"></script>
Doesn't do what you think. When there are two slashes at the beginning of the URL, the browser interprets the first entry after the double-slash as the hostname, not a directory. What you actually want is:
<script type="text/javascript" src="/templates/template/js/jquery-1.2.6.min.js"></script>
With only one slash.
In case you're wondering, the reason for this is so that you can specify a file on a different host, but using the same scheme. So if you have a page that works in HTTP and HTTPS, then you can specify files on a different site, using the same scheme (HTTP vs. HTTPS) by using the src="//example.com/script/whatever.js" format.

Categories

Resources