kbios
asked on
How do I use jQuery to SEND data to the server?
I'm trying to learn a little jquery. Completely NEW to it. It looks pretty powerful but everything I've seen thus far uses jQuery to GET/LOAD/RETREIVE data FROM the server to poulate/manipulate the HTML page.
I want to use jQuery to PUT data to the server.
Within my HTML code I want to launch jQuery to execute a php script along with a value. The php script will $_POST or $_GET the value and INSERT it INTO the mysql db.
Please provide snipet of code to show jQuery in PUTting data TO a server. Thanks in advance to all who provide comments.
I want to use jQuery to PUT data to the server.
Within my HTML code I want to launch jQuery to execute a php script along with a value. The php script will $_POST or $_GET the value and INSERT it INTO the mysql db.
Please provide snipet of code to show jQuery in PUTting data TO a server. Thanks in advance to all who provide comments.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Thanks for the links. Being new to this I find them slightly obscure and hard to follow. Does the data being sent HAVE to originate in a form? The data that I want to send will ultimately be retreived from localStorage.
To test I've put together an HTML that has the jQuery and the php script that is trying to receive the data element and update mysql. Please review the snipets and kindly provide additional comments.
HTML code:
<script type="text/javascript">
$document.ready(function() {
$.post("testqitem.php", {item:"3772"});
});
</script>
php script:
$item = $_POST['item'];
<?php
$conn = mysql_connect("localhost", "X", "Y") or die(mysql_error());
mysql_select_db("test");
mysql_query("INSERT INTO itemdtl (ukey, item)
VALUES ("XXXX10000", '$item')");
mysql_close($conn);
?>
To test I've put together an HTML that has the jQuery and the php script that is trying to receive the data element and update mysql. Please review the snipets and kindly provide additional comments.
HTML code:
<script type="text/javascript">
$document.ready(function()
$.post("testqitem.php", {item:"3772"});
});
</script>
php script:
$item = $_POST['item'];
<?php
$conn = mysql_connect("localhost",
mysql_select_db("test");
mysql_query("INSERT INTO itemdtl (ukey, item)
VALUES ("XXXX10000", '$item')");
mysql_close($conn);
?>
ASKER
**** UPDATED CODE ****
After reviewing and lifting the code from the ryancoughlin link I have the following code that I am testing. To test I'm using the form but I will change later to either use a hidden item or localStorage.
In the meantime please review the code: The mysql table is NOT getting updated. I think it may be related to the success portion of the ajax logic. Please review and comment.
<FORM id=submit method=post>
<FIELDSET>
<INPUT id=item class=text size=20 type=text name=item>
<BUTTON class="button positive" type=submit> Add Item </BUTTON>
</FIELDSET>
</FORM>
<script type="text/javascript">
$(document).ready(function (){
$("form#submit").submit(fu nction() {
var item = $('#item').attr('value');
$.ajax({
type: "POST",
url: "testjqitem.php",
data: "item="+item;
success: function(){
}
});
return false;
});
});
</script>
Here is the php script:
$item = htmlspecialchars(trim($_PO ST['item'] ));
<?php
$conn = mysql_connect("localhost", "X", "Y") or die(mysql_error());
mysql_select_db("test");
mysql_query("INSERT INTO itemdtl (ukey, item)
VALUES ("XXXX10000", '$item')");
mysql_close($conn);
?>
After reviewing and lifting the code from the ryancoughlin link I have the following code that I am testing. To test I'm using the form but I will change later to either use a hidden item or localStorage.
In the meantime please review the code: The mysql table is NOT getting updated. I think it may be related to the success portion of the ajax logic. Please review and comment.
<FORM id=submit method=post>
<FIELDSET>
<INPUT id=item class=text size=20 type=text name=item>
<BUTTON class="button positive" type=submit> Add Item </BUTTON>
</FIELDSET>
</FORM>
<script type="text/javascript">
$(document).ready(function
$("form#submit").submit(fu
var item = $('#item').attr('value');
$.ajax({
type: "POST",
url: "testjqitem.php",
data: "item="+item;
success: function(){
}
});
return false;
});
});
</script>
Here is the php script:
$item = htmlspecialchars(trim($_PO
<?php
$conn = mysql_connect("localhost",
mysql_select_db("test");
mysql_query("INSERT INTO itemdtl (ukey, item)
VALUES ("XXXX10000", '$item')");
mysql_close($conn);
?>
ASKER
Thanks. The link was most helpful. The problem is not resolved but this helped to point me in the right direction.
http://api.jquery.com/jQuery.post/
http://www.phpeveryday.com/articles/jQuery-AJAX,-Passing-Data-to-Server-P972.html
http://www.roseindia.net/ajax/jquery/jqueryPostData.shtml