I'm attempting to use AJAX to insert data into a database, but am unable to connect to the .php file on the server end. I'm thinking this is due to the fact that this is all run on Wordpress, so my normal url path to the .php file might not be correct.
Here is my setup:
Template file:
$('#newsletter-register').submit(function(){
var ajaxRequest; // The variable that makes Ajax possible!
try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
} catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
// Something went wrong
alert("Your browser broke!");
return false;
}
}
}
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
alert(ajaxRequest.responseText);
}
}
ajaxRequest.open("GET", "register_newsletter.php", true);
ajaxRequest.send(null);
});
'#newsletter-register' is form that the user will use to submit his/her information. The alert when the ajaxRequest is at readyState 4 is thrown correctly, but will an empty value.
My php is a simple echo returning a string to signal that the connection is correct (presently I'm just trying to see if the files are correctly calling eachother).
I'm thinking it must be the url path to register_newsletter.php as I've tried placing the code within the template file, outside, etc.
My javascript file is located in /theme/assets/js/code.js where as my template files (including the register_newsletter.php file) in /theme.
Any ideas?
I had this type of issue yesterday. In my situation the page would only be accessed from
www.site.com/aFolder/
The script was stored in my
'/wp-content/themes/themeName/processForm.php'
folder.
and the URL I used was:
../wp-content/themes/themeName/processForm.php
My JS was simply in the head of the main header.php file, but note that the URL I had to use was relative to the URL the page the script was accessed from.
Does that shed any light on things?
EDIT:
As troubleshooting steps, try ensuring you can access your php file from it's absolute URL, and have a look in firebug to see what link is being called when you fire the ajax request to see if it matches up with what you expect.
Related
Well the problem is simple I need the javascript to get content of remote webpage, because there is no way to do it directly I am doing it from local php file and ajax in the java script just like this
The php file:
"getpage.php?url=http://stackoverflow.com" '
The php code :
<?php
$htm = file_get_contents($_GET['url']);
echo $htm; ?>
This code get content of the html page I direct him too.
The AJAX code :
function makeAJAXObject() {
var ajaxRequest;
try {
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
} catch (e) {
// Internet Explorer Browsers
try {
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {
// Something went wrong
return false;
}
}
}
return ajaxRequest;
}
'
And I call him latter in my script like this :
window.ajax = makeAJAXObject();
window.ajax.open("GET","getpage.php"+ queryString, true);
The problem is than I do
alert(window.ajax.responseText);
instead giving me the content of the url I asked him too Its give me the actual php script that I wrote above.
This script works on localhost just fine, but I need it to work form local computer without reuploading to any server, there is away to do it ?
Edit :
The php file is on the pc, I am building a win 8 app , it's not like I have a url or something.
You need to check your remote server configuration to make sure that PHP file are processed by the server. Make sure mod_php is installed in apache and you have the proper AddType to process php files.
See this question: why are my php files showing as plain text?
Also, this is a HUGE security issue, you need to check what is requested and/or whitelist it.
What if I call
getpage.php?url=/etc/passwd
getpage.php?url=/your/secret/file
Because you don't do any checks, you would simply return the results to me ...
I have a long markdown file. I also have a javascript file that runs a parser over markdown. In my javascript file I have set:
var text = "md/markdown.md"
This does not seem to pull in the content of the markdown file as I would like it to. However, if I copy and paste the contents of the markdown file into the variable, then everything works as it should. Is there a way I can set this javascript variable to pick up the contents of this external markdown file?
In the context of a web browser, if you want JavaScript to fetch data from a URI then you will generally use the XMLHttpRequest object. MDN has a decent tutorial about using XMLHttpRequest.
Most of the general purpose JavaScript libraries include wrappers for XHR that include compatibility fixes (especially for old-IE). I'm fond of YUI. Another option is the relatively ubiquitous jQuery.
It isn't a problem for the case given in the question, but beware of the same origin policy.
Run an AJAX request:
var ajaxRequest, text;
try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
} catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
// Something went wrong
alert("Your browser broke!");
return false;
}
}
}
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
text = ajaxRequest.responseText;
}
}
Javascript cannot directly read local files for security reason. As an alternative way, you can take use of XMLHttpRequest to achieve it. Please check the link on the stackoverflow: read external file with Javascript. In addition, HTML5 provides a standard way to interact with local files, via the File API specification. You may refer to the tutorial: http://www.html5rocks.com/en/tutorials/file/filesystem/
I am using ajax in my web page.I want to access a variable used in java script function (in head section of html) by a jsp page.Jsp page is retrieving data from database using that variable.
How can i do that?
Please help me.
if you need the call data you will set & or have a var that's empty before hand. what I realized is that ajax localizes even declared new var's the best way i've found is to append to a existing. Now with the new string and or literal array / object
<script>
function s(e){
alert(e);
}
var a = '';
//Jquery Version
$.get('test.php',function(data){
a += data;
s(a);
});
// Javascript Version
function ajaxFunction(){
var ajaxRequest; // The variable that makes Ajax possible!
try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
} catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
// Something went wrong
alert("Your browser broke!");
return false;
}
}
}
// Create a function that will receive data sent from the server
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
a += ajaxRequest.responseText;
s(a);
}
}
ajaxRequest.open("GET", "test.php" , true);
ajaxRequest.send(null);
}
$(function(){
ajaxFunction();
});
//-->
</script>
You can do it by adding new jsp file, flow will be like this :
Create new jsp file like databaseOperation.jsp which will contain your code for retrieving database record.
Through javascript function, call databaseOperation.jsp file and pass your javascript varible.
Access this variable in your jsp file and retrieve the required code from DB.
You can simply do this by making a ajax call and passing that variable with ajax request
<script>
var id=1;
$.get("yourpage?id="+id,function(){
//get this id serverside using `get`
})
</script>
You have to change your approach to get this done. We cannot set javascript variable value to the the database code which is written in the jsp file. This is because, the database code will be rendered from the serverside and only the html will be sent to the client.
You can achieve this by having a Controller(Servlet) with this database code with asynchronous support and in your jsp file, call this controller through javascript ajax and manipulate the HTML DOM for your requirement.
My goal is to create an personal application out of my ActionScript3 video player. I want to be able to hold keep the single .swf file in my browser and through AJAX, pass the .swf the url to my videos. I've chosen to use JSON as my data.
I'm new to JSON and I've hit a wall. It seems completely easy, but at first I wasn't even able to even get my locally hosted .json file into my webapp. It was working when I tried to do this with XML. After a bunch of trouble shooting, it is now in fact getting my XMLHttpRequest.
I'm trying to keep with backwards compatibility as much as possible, and thus I'm using the json2.js library to secure that notion.
My current issue is not being able to parse my XMLHTTPRequest. To be honest, I'm not even sure if what I'm doing is right as everywhere I look for examples, they're almost all pointing to a solution that writes the JSON into the actual webpage.
My external JSON file: test.json.
{ "video":"test.f4v", "thumb":"test.jpg", "title":"The test", "caption":"TEST TEST TEST TEST TEST", "minutes":01, "seconds":43 }
I'm positive the JSON file is valid.
Here is my html/javascript:
<script type="text/javascript" src="js/json2.js"></script>
<script type="text/javascript">
window.onload = initAll();
function initAll(){
var jsonData = {};
var xhr = false;
if(window.XMLHttpRequest){ //Chrome, Firefox, Opera, Safari, IE7+
xhr = new XMLHttpRequest();
} else if(window.ActiveXObject){ //IE5 + IE6
try{
xhr = new ActiveXObject("Msxml2.XMLHTTP");
} catch(e){
try{
xhr = new ActiveXObject("Microsoft.XMLHTTP");
} catch(e) {
alert("Could not make XMLHttpRequest");
}
}
}
if(xhr){
xhr.open("GET", "js/ajax/test.json", true);
xhr.onreadystatechange = function () {
if (xhr.readyState == 4 && xhr.status == 200){
try{
jsonData = JSON.parse(xhr.responseText);
alert(jsonData.title);
document.getElementById("vidtitle").innerHTML = xhr.responseText.title;
document.getElementById("vidcaption").innerHTML = jsonData.caption;
} catch(e){
alert("Unable to parse jsonData.");
}
}
};
xhr.send(null);
}
}
</script>
</head>
<body><div class="vidcontent">
<h2 id="vidtitle"></h2>
<p id="vidcaption"></p>
I'm doing this locally on my server, but I have uploaded the files to my web host and still get the same issues.
Firebug tells me it has the data and I can even read it through the console. Now, The code works in Firefox, but not Chrome or IE8 (IE8 Works occasionally when I put it into compatibility mode, but not always <.< ) I can't test on Safari or Opera right now.
Is there any way I can get this working in these browsers? I have attempted $.parseJSON in the JQuery library, but I was having issues with that as well. I am interested in JQuery as well if anyone can explain the solution with it.
Your JSON is invalid: http://www.jsonlint.com/
Leading 0's are not allowed in numbers apparently.
i am having a bit of a problem here and i don't even know if it is possible at all, here's my dilema:
I have this script code:
<script id='script1' src='http://link.to.js'></script>
While using firebug, i can clearly see that the script has bee loaded between those tags, like this
<script id='script1' src='http://link.to.js'>
function something(){
alert('hi');}
</script>
What i want to do is, by means of another script, get the content between those tags, something like
var x = document.getElementById('script1').innerHtml;
document.getElementById('somedividhere').innerHtml = x;
That works perfectly WHEN the code is already part of the html, not when its loaded from src.
I have been looking for this for hours and i have not found any hint, hope someone can help me on this.
I think Firebug only shows you that for convenience sake. If you want to get the code from the script, you'll have to use AJAX.
You could do something like this:
function ajaxFunction(){
var ajaxRequest; // The variable that makes Ajax possible!
try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
} catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
// Something went wrong
alert("Your browser broke!");
return false;
}
}
}
// Create a function that will receive data sent from the server
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
var scriptcontent = ajaxRequest.responseText;
//Do something with the content
}
}
ajaxRequest.open("GET", document.getElementById('script1').src, true);
ajaxRequest.send(null);
}
Just a few notes:
This will only work for scripts
located on your site due to the
same origin
policy.
I took the ajax code from this
site
and modified it.
This would be a lot
easier with
jQuery