My REST call doesn't run the page's javascript - javascript

I'm using REST to POST (from Firefox's Poster) a url:
http://[ip]/page.jsp?paramater1=whatever&parameter2=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>

Related

Redirect webpage in javascript

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>

GET in HTML and Not PHP

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>

javascript executes before browser has finished rendering the page

This question is not a duplicate of some of the other PHP & Javascript questions that have been asked here before, at least not one I have been able to find.
I have a .php file that contains some HTML elements that get rendered by the PHP for the sake of argument here we will say the file is located at http://url.php. It is looking for certain GET tags, and including a div if those get tags exist.
<?php if(isset($_GET['VAR']))
{
echo '<div id="VARDIV"></div>';
}?>
Of course I realize that this all happens on the server, and gets sent back to the clients web browser where the javascript takes over.
But in the javascript (on the same PHP page) I have the following code that executes on page load looking for that div tag and doing something with it:
if(document.getElementById("VARDIV")!==null)
{
alert('div exists!');
}
While the page loads this should logically pop up the div if the URL is http://url.php?VAR correct?
However it does not. If I run the javascript code a second time in the console it works fine, so its not a misspelling (such as getElementsById or something silly like that).
How can this possibly render out of order like this? Should the PHP engine not render the HTML then pass it back to the browser before one line of JS is executed?
EDITED FOR CLARITY BASED ON COMMENTS BELOW:
<script type="text/javascript">
function doDIVStuff()
{
if(document.getElementById("VARDIV")!==null)
{
alert('div exists!');
}
}
doDIVStuff();
</script>
<html>
<body>
<?php if(isset($_GET['VAR']))
{
echo '<div id="VARDIV"></div>';
}?>
</body>
</html>
use either window.onload() or document.onload(), see differences here
you could also place your script just before the end of your tag in the html although there could be unintended consequences in certain things in IE, seen here
Try to use jquery and document ready event:
$(document).ready(function(){
if(document.getElementById("VARDIV")!==null)
{
alert('div exists!');
}
})
If you do not want to include jquery js lib, you can use the solution here:
pure JavaScript equivalent to jQuery's $.ready() how to call a function when the page/dom is ready for it
Actually if you place the javascript code at the end of file after all php and html code it must work.I have tested it.
<?php if(isset($_GET['VAR']))
{
echo '<div id="VARDIV">Dilip</div>';
}?>
<script type="text/javascript">
if(document.getElementById("VARDIV")!==null)
{
alert('div exists!');
}
</script>
but i think it is better to use onload event
window.onload=function(){if(document.getElementById("VARDIV")!==null)
{
alert('div exists!');
}};
Or if you are ok to use jquery then its awesome..
$(document).ready(function(){
if(document.getElementById("VARDIV")!==null)
{
alert('div exists!');
}
})
Any JavaScript that is not inside a function is executed sequentially as the page is interpreted. Your doDIVStuff(); call is executing before any HTML is interpreted on the page, therefore your "VARDIV" is not yet available in the DOM for the JS to read.
As others have suggested, the best approach is to listen for when the page is done loading and then trigger the call to your function.
Wrap in doc rdy() or just do something like this:
<html>
<head>
</head>
<body>
<?php if(isset($_GET['VAR']))
{
echo '<div id="VARDIV"></div>';
}?>
<script type="text/javascript">
function doDIVStuff()
{
if(document.getElementById("VARDIV")!==null)
{
console.log('div exists!');
}
}
doDIVStuff();
</script>
</body>
</html>
I'd say you should create a javascript file and put your code there so you can debug it.

Javascript can't find the script tag's id

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

Is there a Javascript "Evoke" function available for <object> - if so, what is it?

I have inherited a large codebase, mostly in C++; this C++ is creating an HTML page that is being displayed in an Internet Explorer web browser.
The HTML does not included any Javascript (.js) files. There is, in addition, an <object> within the HTML; this object seems to be an entirely application-specific, custom object. Here is the skeleton code for the HTML:
<html>
<head>
(Nothing relevant here - no .js files are included)
</head>
<body>
<object
id=objAppIT
GUID_START=1 classid="CLSID:D19BF5B4-74E8-437D-8EB0-FCF709C36C77" GUID_END=1
VER_START=1 codebase="AppIT-Deployer-2,3,1,2.cab#version=2,3,1,2" VER_END=1
>
<param name="CFG"
value="ACTION=LAUNCH
SID=77cded6b-ddaf-441f-ae4a-d2764d519ab6
AID='0000000010000000-00000000000010AC-0005-11-17~05|34|32.149'
UID=N/A"
/>
</object>
<form id=formSubmit method=post action="valid_url_here">
(various <input> fields here)
</form>
<script type="text/javascript">
window.onload = function()
{
var objAppIT = document.getElementById("objAppIT");
objAppIT.Evoke("LAUNCH", "formSubmit");
}
</script>
</body>
</html>
The code above successfully submits the form - apparently, just as though the form was submitted in the usual fashion (not using the <object id=objAppIT>.
I have googled to see if Evoke() is a Javascript function that can be called on any <object> - because no .js file is included that could otherwise define that function. I can't find any documentation for Evoke().
Therefore, I do not understand how the above form is submitted.
Hence, my question: Is there a Javascript function Evoke()? If so, what does it do? If not, I would further appreciate if someone could explain how the above HTML/Javascript snippet is submitting this form.
I also have never heard of an evoke function, but it sounds like dispatchEvent.
It looks like the Evoke function is some user-defined function. We can't tell exactly what it does and what is done with each parameter that is passed into it, but I assume that it takes the second parameter (the ID of the <form> element) and submits that using something like this:
document.getElementById('formSubmit').submit();

Categories

Resources