I'm trying to create a javascript file with functions that allow me to redirect to another page. But it is not redirected. This is my code:
on my functions.js
function openUrl(url) {
window.location = url;
}
on my php page
<script>openUrl('<?=$my_url?>');</script>
<script src="./functions.js" type="text/javascript"></script>
Order matters
You call openUrl, which (if you have looked at the Console in your browser's developer tools) is throwing a ReferenceError because it isn't defined.
Then you load your functions.js which defines openUrl (but by then it is too late).
That said, if you are generating an HTML document which immediately goes to a new URL with JS then you should probably be simply issuing a 301 or 302 redirect response instead of an HTML document in the first place.
switch these two lines
<script src="./functions.js" type="text/javascript"></script>
<script>openUrl('<?=$my_url?>');</script>
Related
I want to process a GET extension in a HTML page and not a PHP page.
I have looked through the internet and not found anything.
URL = examplesite.com?id=1234
I assume this would go to the index page on the domain. As the index page is a HTML page, is there a way to get the details of the extension transferred to another link I have in the html script that emails me when someone looks at the site.
<script src="trigger.php">
</script>
This way I can customise the extension to know where the person found me. id=1234 is from twitter, id=2345 from FB etc.
Then i could place the extension onto the script to send me the email.
<script src="trigger.php?id=1234">
</script>
Is there a way to get the HTML page to process extension and pass it on in a variable of some sort.
Thanks in advance
Robert
You can do it in Javascript in the HTML. window.location.search contains the query string from the URL.
You can then use an AJAX request to send the query string to your server script.
<script>
$(document).ready(function() {
var script = 'trigger.php' + window.location.search;
$.get(script);
});
</script>
This is not possible with plain HTML. By definition, HTML is not dynamic. It can't process anything you want. However, there are three options.
Firstly, you can use JavaScript and AJAX calls to make another HTTP request to examplesite.com/processID.php (or another PHP page) which will process the request.
Another way to use JavaScript would be to use a client side API such as MailChimp to send the email directly from the users computer.
Or you could just redirect your root page for your domain examplesite.com to lead to index.php. I'm sure that's very easy to configure in mainstream servers such as Apache or Nginx. Otherwise please ask another question on Server Fault about how to set this up using your server.
If you are using a PHP hosting provider, they should also be able to help redirect the root page. If you don't have any access to PHP on your hosting provider, you're out of luck. You must only use the second option.
Do it with ajax
<form id="form1">
<input type="text" />
<button type="submit" id="sendforms">send</button>
</form>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#sendforms").click(function() {
var combinedFormData = $("#form1").serialize();
$.get(
"trigger.php",
combinedFormData
).done(function(data) {
//alert("Successfully submitted!");
$("#result").html(data);
}).fail(function () {
//alert("Error submitting forms!");
})
});
});
</script>
how do i redirect to a welcome page from an index page using javascript?
The site is offline and on a development machine and not in a server www directory like (wamp, lamp, apache etc) . I would like to do it without using PHP, python etc cause I already know how it is done in php using header(location ... ).
The directory structure
site
|
|--img
|--css
|--index.html
|--welcome.html
|--error.html
I have already tried window.location, window.location.href etc.
Inside the script of index.html.
if (true){
self.location("welcome.html");
}
else{
window.location.href = "error.html";
}
Though Window.location is a read-only Location object, you can also
assign a DOMString to it. This means that you can work with
window.location as if it were a string in most cases: window.location
= 'http://www.example.com' is a synonym of window.location.href = 'http://www.example.com'.
Mozilla Docs -- Window.location
It is not a function but you can assign a string to it.
Just write:
window.location="error.html";
self.location="error.html"; is fine too
You could also use a meta-refresh redirect:
<meta http-equiv="refresh" content="0;URL='welcome.html" />
Or just do window.location="welcome.html" instead of self.location("welcome.html")
``This is very simple to do a page redirect using JavaScript at client side. To redirect your site visitors to a new page, you just need to add a line in your head section as follows:
<head>
<script type="text/javascript">
<!--
window.location="http://www.newlocation.com";
//-->
</script>
</head>
Thanks for all your advice.
But I was able to do it myself using window.location method. I found that the method was not the problem because I had tried it already previously.
The problem was that the redirection happened but since the function "checkLogin" was called by the onsubmit function of html element form,
it kept coming back to the same login page.
I fixed it by returning false at the end of the checkLogin() script.
But Thanks a ton for all your input.
I am facing problem with javascript document.getElementByID function. The HTML file is:
...
<script
id="scriptID"
type="text/javascript"
src="http://external.script.com/file.js">
</script>
...
When the page is loaded, the script is successfully included, but when executing expression from that file (the script is executed automaticaly after loading it):
... = document.getElementById('scriptID').src
The script fails with message saying that "document.getElementById('scriptID') is null".
Can anybody tell me, why it is null if the tag is the script tag itself?
Thx for any response.
EDIT:
I don't know if that is relevant, but the page is built in a bit more complicated way.
There is page of some product. When the customer orders that product, there is a div loaded by AJAX with some "Thanks for order" and that contains the script. Then the script is executed.
May be your DOM is not ready when you are try to get src of script,
<script id="scriptID" type="text/javascript" src="http://external.script.com/file.js">
</script>
window.onload=function()
{
alert( document.getElementById('scriptID').src);
}
Its workinfg fine SEE
I'm using REST to POST (from Firefox's Poster) a url:
http://[ip]/page.jsp?paramater1=whatever¶meter2=whatever
(Content Type: application/x-www-form-urlencoded)
The page.jsp contains:
<body onload="onload()">
<script>
document.forms["myform"].submit(); // just to be redundant
function onload(){
document.forms["myform"].submit(); // just to be redundant
}
</script>
<form action="SessionTestDriver" method="post" id="myform">
[form stuff]
</form>
But it doesn't seem to be submitting that form. If I manually load the page on a browser, everything works perfectly. It's just the REST call that does nothing.
Clearly I'm missing something. Advice?
SOLVED!
Got it! The main jsp page just called a servlet on submit. I tried that servlet directly in the REST url instead of the jsp page and everything worked how I wanted!
It sounds like you're making a request to a page that contains javascript, and you're concerned that the javascript on the requested page isn't running.
This is expected. When you request that page, the response is returned as a string, and that's it. The page isn't parsed, and javascript isn't evaluated. When you make an AJAX call, don't expect javascript in the page you're POSTing to to run.
(Sorry for explaining something so elementary if I've misunderstood your question.)
Not sure how HTML form and REST are being used, but you might want to make sure the document is loaded entirely first:
Try (if using jQuery)
<script>
$(document).ready( function() {
$("#myform").submit();
});
</script>
EDIT: I have discovered that this is a 405 error. So there is something going on with the webserver and handling POST methods.
I am having a strange occurrence. I have identical javascript code on both my test environment and production environment.
The test environment functions, and the production does not. Here is my identical code.
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://cdn.jquerytools.org/1.1.2/jquery.tools.min.js"></script>
<script type="text/javascript" src="./js/jquery.scrollTo-min.js"></script>
</head>
<body>
<div class="content" id="content">
<a id="changeText" href="test.html">Change</a>
</div>
<script>
$(document).ready(function() {
$("#changeText").live('click', function(){
var url = $(this).attr("href");
$("#content").load(url, {var1:Math.random()*99999},function(){
alert(url + " loaded");
});
$.scrollTo("0%", 400);
return false;
});
});
</script>
</body>
</html>
Both environments report that
alert(url + " loaded");
is happening. But only my test environment actually displays the change.
The production webserver has "test.html" available in the correct location.
Are you sure the scrollTo script is being included on the production server ( or am I misinterpreting what you mean by change ) ? Perhaps try a root relative path instead of './js'? I would check Firebug's script tab to ensure it is being included.
405 errors mean that the URL you're sending to isn't expecting you to send the data in that manner. For example, if you're sending a POST request to a URL that's only designed to handle a GET request, you'll get this error.
My guess is whatever server you're running on is set up to not allow POST data to be sent to a page with a .html extension, causing the error you're seeing. Try changing the extension to a .php, .aspx, etc, and see if that helps.