How to use `GET` parameters in a HTML document? - javascript

I have a HTML document and I want to send a parameter.
Let's name the document Categoty, and all it do it sends a request to the server (via Ajax) to get something on this categoty.
Suppose I'm using PHP, I would simply send the parameter:
localhost/Categoty.php?cat=somecat,
and read it in the PHP document: $_GET['cat'].
My question is if there's something similar in HTML (or Javascript)?
I though about hashtag (.i.e. categoty.html#somecat) , but I'm using jQuery mobile in my Android Hybrid application so it makes some issues.
Thanks in advance.

use the jQuery URL Parser in this link and then try:
jQuery.url().param('cat');
you can also access all other info we usually need in terms of dealing with GET parameters, like:
jQuery.url().attr('protocol');
returns the URL protocol like: http or https
jQuery.url().attr('host')
returns the host like stackoverflow.com
you can also get the segments of your URL like this:
jQuery.url().segment(1);//for instance in this very page's url it returns "posts"
at the end:
jQuery.url().param('cat') in javascript does the same as $_GET['cat'] does in PHP

jQuery ajax can do it , use $.ajax();
$.ajax({
type: 'GET',
url: 'http://localhost/Categoty.php?cat=somecat',
success: function(responseTxt,statusTxt,xhr){
}
});

Related

how to get http request without using XHR object in javascript

Is it possible to get information from URL without using the XmlHttpRequest .
I am trying to get document from my noSqlDatabase from URL
by the XHR object and It did not work . but If I type the URL in the browser I get the data.
If by 'get information' you mean load data from a 3rd party url without using XHR requests, the answer is yes, but with caveats.
One commonly used method to load json data cross-domain is called jsonp. Essentially, you define a function on your page:
var x = function(data){ //do something with data }
Then you create a script tag and append it to you page where the src attribute points to some other url that returns a js file like this:
x({ param: 'some data' });
The x function then executes on your page and has access to the 'param' data in the object. You can also pass a string or number using this method.
There is another method involving iframes and the window.name property of the iframe. This technique is a bit older but still works, but I won't go into a lot of detail about it here. You can read more about it here, http://skysanders.net/subtext/archive/2010/10/11/leveraging-window.name-transport-for-secure-and-efficient-cross-domain-communications.aspx, and other places.

how to send a single element from browser to server without reload

How can I send just one element from browser to server fast and without reloading browser page?
Is there an AJAX way to do this, that is a NON-FILE method? The opposite of ".load"?
.load works great sending a single element from server to browser without page reload.
How to do the opposite direction?
Browser is JavaScript.
Server is vxworks with windmarks.
PRESENT METHOD THAT WORKS BUT RELOADS PAGE:
Presently, the browser element is and I use submit to send it to the server, but this takes too long and reloads the browser page.
The element's innerHTML contains data formatted as a vxworks WINDMARK.
(When the vxworks server receives this submission, it reads the windmark and copies it to a 'C' string for backend software to process.)
If you're using jQuery and PHP then something like this should work:
JS:
$.ajax('doServerSuff.php?action1=saveLog', function() {
// do stuff after server received the data
});
PHP (doServerStuff.php):
<?php
if ($_GET['action1'] == 'saveLog') {
//do stuff
}
?>
You can get and send data using jQuery. using something like this:
$.post('urlfromserver',browserdata,function(datafromserver){
//do stuff
})
if you let me put a little bit more, it's a good idea to use JSON to send/receive data to/from server. Having that in mind, you can do something like:
$.post('urlfromserver',{browserdata: JSON.stringify(browserdata)},function(datafromserver){
javascriptObject = jQuery.parseJSON(datafromserver)
//do stuff
})
And in your PHP code, it would be as simple as using json_encode to send data to javascript and json_decode to receive data from javascript
UPDATE
Obtaining the data in the server should be as simple as requesting the object via post or get depending on your send method, and parsing the JSON.
In PHP, this is an example of obtaining data using the above code:
$dataFromBrowser = json_decode($_POST['browserdata'])
Use $.post in jQuery to send the data.
The load intruction can also be used to transmit data to the server:
$().load("url", {limit: 25}, function(){
//transmission finished
});
In this example the parameter limit with the value 25 wil be transmitted to the server.
Taken from:http://api.jquery.com/load/
You can simply do with the ajax call like this
$.ajax({
type: "POST",
url: "yourpage.php?id=someValue",
success:function(data){
//do some stuff here
});
I got it working. Here is the corrected JavaScript, from the above answer.
Here is how to change a single element at the server.
This is also an example of how to write to a vxworks windmark string at a vxworks web server, without reloading the page.
NOTE: no URL is specified, so that the same page is used.
$.ajax({
type: "POST",
url: "?general_page_to_MM_data_1_windmark=CCCCCCCCCCCCCC",
success:function(data_from_server){
}});

Search XML file using javascript

I'm trying to make a page where a user may enter a url into an input box, click submit, and the script will return the WebCite page. (WebCite is a url caching service. For example, if I "archive" www.google.com, the archive page is www.webcitation.org/65YgIgei6.) So WebCite has a query syntax that when given a url to cache, an email, and the parameter &returnxml=true, it will return an xml file. (For example, http://www.webcitation.org/archive?url=http://www.google.com&email=testtt#test.com&returnxml=true leads to an xml file where the text between the <webcite_url> tags is the archive page.)
So I would like some Javscript (or jquery) that will search the xml file for "<webcite_url>" and "</webcite_url>" and return the url within those tags. http://jsfiddle.net/gxHWk/ is the basic idea.
btw, I read stackoverflow.com/questions/6648454/search-and-output-data-from-an-xml-file-using-javascript, but I can't figure out how to adapt the code there to my circumstances.
(*removed "http://" from some links because of spam filter)
Thanks!
That's what jQuery is built to do! jsFiddle
$(XMLstring).find('webcite_url').text();
a solution without jQuery:
load xml with iframe
go through dom
var iframe = document.createElement("iframe");
iframe.src = "http://www.webcitation.org/archive?url=http://www.google.com&email=testtt#test.com&returnxml=true";
document.body.appendChild(iframe);
iframe.onload = function() {
var url = this.contentDocument.getElementsByTagName("webcite_url")[0].firstChild.nodeValue;
// do whatever you want with the url over here
}
But be aware: This is just a general pointer. There might be Browser incompatibilities here.
jQuery is built to parse xml files. The problem for you is how to parse data from another domain. JSONP is the answer for you.
You append ?callback=?" to the end of your request and put jsonp for your data options.
$.ajax({
url: "http://www.webcitation.org/archive?url=http://www.google.com&email=testtt#test.com&returnxml=true?callback=?",
dataType:'jsonp',
success: function (XMLstring) {
$(XMLstring).find('webcite_url').text();
}
});

Jquery Ajax doesnt work

I have the following div in my html
<div class="result">loading</div>
And my javascript is as follows.
$(document).ready(function() {
$.ajax({
accept: 'application/rss+xml',
url: 'http://www.madhyamam.com/taxonomy/term/19/rss.xml',
success: function(data) {
$('.result').html(data);
}
});
});
But for some reasons.. it doesnt seems to work.
In jsfiddle
XML returned(firebug):
XML Parsing Error: no element found Location:
moz-nullprincipal:{9ec69805-af82-4f95-979a-f8e68d415124} Line Number
1, Column 1:
^
Solution
*I bye-passed the problem using yahoo pipe. And it worked fine.*
You can't make Ajax requests to URLs that have not the same domain, port and protocol as the current page. The Same Origin Policy forbids it.
The most common workaround is having a server-side script that pulls the content, and serves it through Ajax.
As Pekka mentioned, we guess your problem is that Ajax cannot make request on other domain URLs. You have to use server-side script for that.
Example of small php server-side script for testing (from Jquery Minime Feed library):
<?php
header('Content-type: text/xml; charset=utf-8');
$url = htmlspecialchars($_GET['url']);
echo file_get_contents('http://'.$url,0);
?>
Then you can call something like
$.ajax({
accept: 'application/rss+xml',
url: 'http://youserver/getfeed.php?url=http://www.madhyamam.com/taxonomy/term/19/rss.xml',
});
However, it seems you want to show rss feed in your page. I went to same issue and ended using Jquery Minime Feed library, which help you doing the job:
$('#test1').minimeFeed('http://index.hu/24ora/rss/');
Automatically use server-side script if needed, and produce quite nice output. See demo here

.load() with data

I want to load data into a checkout page using .load() to load the pages in a modal window. The data that needs to be loaded is a shipping price value, that needs to be usable on the loaded page.
JS
function totalCalc() {
var shipping = ($('#shippingform input[name="shipping"]').val());
$('#cartdialog').load("/ash/shop/checkout.php",[$('#shippingform input[name="shipping"]')]);
alert(shipping);
}
CHECKOUT.PHP
$myTotal = ($subtotal + $_POST['shipping']);
I need the value which is shown through the "alert(shipping);" to be a usable value on checkout.php. You'll see I try to $_POST[] it in a php variable, but it wont work. I must be sending the data wrong...
Per the jQuery API, data sent as a query-string format string through .load() is treated as GET. Data sent as a JSON object is treated as POST. Basically, send it like this:
.load("/ash/show/checkout.php", {shipping: shipping});
As it seems you're using jQuery: http://api.jquery.com/jQuery.post/
or if you want proper control over it, use the ajax method: http://api.jquery.com/jQuery.ajax/
Alternatively, you could add the shipping cost to the URL and use $_GET

Categories

Resources