HTML form w/ method = "get" VS. JQuery $.get
I have an embedded application running httpd for a web server. On the main page I have two buttons. One uses JQuery to add a click event with the following code:
$.get("example.cgi");
The other button is the submit button for a blank form (i.e. other than the form tags and the input with type = "submit" the form contains no fields). The method for the form is set to "get" and the action set to "example.cgi". When I press button one, the script fails. When I press button two, the embedded device responds accordingly.
I would really like to use JQuery for this entire project (for example, specifically so I dont HAVE to have blank forms all over my pages...), but I cannot figure out what the difference would be between a blank form with a method "get" and a JQuery $.get();. Does anyone know what might be happening?
UPDATE:
the html and js code in its entirety --
<!doctype html>
<html>
<head>
<title>LCRFLC on the WEB</title>
<script type="text/javascript" src="jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
// add click events
$("#off").click(function(event)
{
$.get("rflcc.cgi", { cmd: "RAMP", lvl: "0" } );
});
$("#fon").click(function(event)
{
$.get("rflcc.cgi");
});
});
</script>
</head>
<body>
<h1>TEST PAGE FOR RFLC CONTROL AND STATUS</h1>
<input type="button" value="Off" id="off">
<input type="button" value="Full On" id="fon">
<form method="get" action="rflcc.cgi" id="alt" name="alt">
alternate method
<input type="submit" value="Another try" name="altsubmit">
</form>
<br>
<textarea cols="80" rows="50"></textarea>
</body>
</html>
this may require a little more explanation now, so i will take a short attempt at that. the only reason the two click events are different is so i could try two different things with one load (bc i have to flash the emb开发者_运维问答edded device with this static code every time...). neither of those get methods in the click event work though. the blank form however DOES work, and my original question was what is the difference between that blank form and the jquery get in the click event for the 'fon' button? i was thinking they should behave the same...
Are you sure you are using $.get
correctly. It fetches the page asynchronously and executes the callback function you specify. On the other hand, when the empty form is submitted the page is changed.
This would work for you.
HTML
<button id="get">Get</button>
<div id="target"></div>
Javascript
$('#get').click(function() {
$.get('example.cgi', function(data) {
$('#target').html(data);
});
});
As @Nithesh commented, $.post() is really the right tool for the job when you're not getting information back. As a bonus, POST requests should never be cached by the browser, but GET requests can be, and that theoretically could be your problem.
Also, your blank form isn't truly blank - the submit button has a name and value which get submitted as parameters. Is it possible that your cgi script is where the problem lies instead? It seems unlikely, but I have to ask...
For diagnostic purposes, you might want to do something like this:
$("#fon").click(function(event) {
$.post("rflcc.cgi", function() { alert "Done!"; });
});
That will tell you if the request is happening at all. If you're not already, look into the FireBug addon for Firefox as a tool to help diagnose Ajax stuff.
精彩评论