I'm fairly new to trying to use AJAX, so please forgive my ignorance.
I know it is possible to update a form with new content with AJAX, and
I've actually been able to do that - but just on one form element. The
problem I have is trying to update another form element on that same
page.
Here is my js code (update.js):
----------------------------------------------
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 ajaxDisplay = document.getElementById('ajaxDiv');
ajaxDisplay.innerHTML = ajaxRequest.responseText;
}
}
var priority = document.getElementById('priority').value;
var id = document.getElementById('id').value;
var express = document.getElementById('express').value;
var queryString = "?priority=" + priority + "&id=" + id + "&express="
+ express;
ajaxRequest.open("GET", "ajax-example.php" + queryString, true);
ajaxRequest.send(null);
}
-----------------------------------
Here is my ajax-example.php code:
<?php
//Database connection
include ('db.php');
// Set Table Variable
$table = purchase_os;
// Retrieve data from Query String
$listitem=array(1 =>
'priority','express','expressdate','location','bibname','fundnum','lowuse', 'received','userid','addcomments','notify','name','idnum','depart','telnum' ,'email','mat','access','lic','neg','fileloc','url','col','numtit','recs',' funds','author','title','pubplace','publisher','edition','price','quantity' ,'series','standorder','isnnum','source','catnum','itemnum','comments','aco rnnum','vendor','verifier','verifydate','status','ccemail');
// Build results query
$query2 = "SELECT * FROM $table WHERE id = '$id'";
// Execute update query
$m = 1;
while ($m <= $numitems) {
if (isset($query[$m]) && !is_null($query[$m])) {
$qry_result = mysql_query($query[$m]) or die(mysql_error());
}
$m++;
}
$qry_result2 = mysql_query($query2) or die(mysql_error());
//Build Result String
$display_string = "<table>";
// Insert a new row in the table for each person returned
while($row = mysql_fetch_array($qry_result2)){
$display_string .= "<tr>";
$display_string .= "<td>This has been updated to<br />$row[priority]</
td>";
$display_string .= "</tr>";
I am not entirely clear on exactly what your asking/needing so if you
can please provide a bit more information that would be great.
Best I can tell what your looking for is you need to separate your
AJAX function in to a more versatile and independent wrapper function
then use another javascript function call on your form to get the
values and create the URL then pass that to your ajax function.
eg. function myajax(queryUrl,resultID){Do Ajax Stuff}
Then this way you can just attach a handler on your form submit
onsubmit="processForm(this);return false;" to grab the data from your
form and create your query string for your ajax function to process.
You can then use that same ajax function to initially create the form
also either on a window.onload=function(){Make AJAX Form....}; or
using an onclick event too after the page loads.
I just love AJAX, there are so many ways to play with it. If you need
I can post some code for a more "independent" ajax wrapper so you can
take your "ajax-example.php" + queryString and ajaxDisplay.innerHTML
out of that function. This will give your ajax apps a lot more
versatility.
Also, http://paste-it.net/ or http://pastebin.com/ works much better
for posting large chunks of code where groups does a lot of
reformatting (and line breaks) making code debugging a problem in
groups.
Cheers!
Vision Jinx
On Apr 24, 11:36 am, Jamen <jmcgrana...@gmail.com> wrote:
> I'm fairly new to trying to use AJAX, so please forgive my ignorance.
> I know it is possible to update a form with new content with AJAX, and
> I've actually been able to do that - but just on one form element. The
> problem I have is trying to update another form element on that same
> page.
> Here is my js code (update.js):
> ----------------------------------------------
> 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 ajaxDisplay = document.getElementById('ajaxDiv');
> ajaxDisplay.innerHTML = ajaxRequest.responseText;
> }
> }
> var priority = document.getElementById('priority').value;
> var id = document.getElementById('id').value;
> var express = document.getElementById('express').value;
> var queryString = "?priority=" + priority + "&id=" + id + "&express="
> + express;
> ajaxRequest.open("GET", "ajax-example.php" + queryString, true);
> ajaxRequest.send(null);
> }
> -----------------------------------
> Here is my ajax-example.php code:
> <?php
> //Database connection
> include ('db.php');
> // Set Table Variable
> $table = purchase_os;
> // Retrieve data from Query String
> $listitem=array(1 =>
> 'priority','express','expressdate','location','bibname','fundnum','lowuse', 'received','userid','addcomments','notify','name','idnum','depart','telnum' ,'email','mat','access','lic','neg','fileloc','url','col','numtit','recs',' funds','author','title','pubplace','publisher','edition','price','quantity' ,'series','standorder','isnnum','source','catnum','itemnum','comments','aco rnnum','vendor','verifier','verifydate','status','ccemail');
> $qry_result2 = mysql_query($query2) or die(mysql_error());
> //Build Result String
> $display_string = "<table>";
> // Insert a new row in the table for each person returned
> while($row = mysql_fetch_array($qry_result2)){
> $display_string .= "<tr>";
> $display_string .= "<td>This has been updated to<br />$row[priority]</
> td>";
> $display_string .= "</tr>";
To answer your first question: What I want to do is bring up the full record
(which contains 46 fields from a MySQL table) with 3 columns:
column 1 = field name
column 2 = current setting
column 3 = forms available for changing the setting
This is one reason why I tried to use arrays in my PHP script. Ideally, what
I want it to do is allow a user to bring up the full record, find the field
they want to update, change the setting and click the Update Field button.
This button should activate a function that updates this field and displays
in the Current Field with "This field has been updated with $v" (where $v is
the new value). Does this make sense?
And thanks for the tip about the how to submit codes to groups like this.
Jamen
On Fri, Apr 24, 2009 at 9:03 PM, Vision Jinx (Guru) <vjn...@gmail.com>wrote:
> I am not entirely clear on exactly what your asking/needing so if you
> can please provide a bit more information that would be great.
> Best I can tell what your looking for is you need to separate your
> AJAX function in to a more versatile and independent wrapper function
> then use another javascript function call on your form to get the
> values and create the URL then pass that to your ajax function.
> eg. function myajax(queryUrl,resultID){Do Ajax Stuff}
> Then this way you can just attach a handler on your form submit
> onsubmit="processForm(this);return false;" to grab the data from your
> form and create your query string for your ajax function to process.
> You can then use that same ajax function to initially create the form
> also either on a window.onload=function(){Make AJAX Form....}; or
> using an onclick event too after the page loads.
> I just love AJAX, there are so many ways to play with it. If you need
> I can post some code for a more "independent" ajax wrapper so you can
> take your "ajax-example.php" + queryString and ajaxDisplay.innerHTML
> out of that function. This will give your ajax apps a lot more
> versatility.
> Also, http://paste-it.net/ or http://pastebin.com/ works much better
> for posting large chunks of code where groups does a lot of
> reformatting (and line breaks) making code debugging a problem in
> groups.
> Cheers!
> Vision Jinx
> On Apr 24, 11:36 am, Jamen <jmcgrana...@gmail.com> wrote:
> > I'm fairly new to trying to use AJAX, so please forgive my ignorance.
> > I know it is possible to update a form with new content with AJAX, and
> > I've actually been able to do that - but just on one form element. The
> > problem I have is trying to update another form element on that same
> > page.
> > Here is my js code (update.js):
> > ----------------------------------------------
> > 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 ajaxDisplay =
> document.getElementById('ajaxDiv');
> > ajaxDisplay.innerHTML = ajaxRequest.responseText;
> > }
> > }
> > var priority = document.getElementById('priority').value;
> > var id = document.getElementById('id').value;
> > var express = document.getElementById('express').value;
> > var queryString = "?priority=" + priority + "&id=" + id +
> "&express="
> > + express;
> > ajaxRequest.open("GET", "ajax-example.php" + queryString, true);
> > ajaxRequest.send(null);
> > }
> > -----------------------------------
> > Here is my ajax-example.php code:
> > $qry_result2 = mysql_query($query2) or die(mysql_error());
> > //Build Result String
> > $display_string = "<table>";
> > // Insert a new row in the table for each person returned
> > while($row = mysql_fetch_array($qry_result2)){
> > $display_string .= "<tr>";
> > $display_string .= "<td>This has been updated to<br
> />$row[priority]</
> > td>";
> > $display_string .= "</tr>";
This should help get you going with what you need. It's the basic AJAX
GET request wrappers and a sample form handler and looking at the code
you provided it should help do what your trying to do in a more
versatile way (meaning your form/query parameters are not hard coded
in your AJAX handler).
I did not go too overboard on it and tried to keep it as simple and
self explanatory as possible. You should be able to add an updated/
custom version of that form handler to suit your needs (the only thing
that really needs editing) and I included a javascript wrapper if you
prefer using document.getElementById over the names for form elements
as I used in my sample (or you can easily use both).
Hope this helps :)
Cheers!
Vision Jinx
On Apr 25, 8:37 pm, Jamen McGranahan <jmcgrana...@gmail.com> wrote:
> To answer your first question: What I want to do is bring up the full record
> (which contains 46 fields from a MySQL table) with 3 columns:
> column 1 = field name
> column 2 = current setting
> column 3 = forms available for changing the setting
> This is one reason why I tried to use arrays in my PHP script. Ideally, what
> I want it to do is allow a user to bring up the full record, find the field
> they want to update, change the setting and click the Update Field button.
> This button should activate a function that updates this field and displays
> in the Current Field with "This field has been updated with $v" (where $v is
> the new value). Does this make sense?
> And thanks for the tip about the how to submit codes to groups like this.
> Jamen
> On Fri, Apr 24, 2009 at 9:03 PM, Vision Jinx (Guru) <vjn...@gmail.com>wrote:
> > Hi,
> > I am not entirely clear on exactly what your asking/needing so if you
> > can please provide a bit more information that would be great.
> > Best I can tell what your looking for is you need to separate your
> > AJAX function in to a more versatile and independent wrapper function
> > then use another javascript function call on your form to get the
> > values and create the URL then pass that to your ajax function.
> > eg. function myajax(queryUrl,resultID){Do Ajax Stuff}
> > Then this way you can just attach a handler on your form submit
> > onsubmit="processForm(this);return false;" to grab the data from your
> > form and create your query string for your ajax function to process.
> > You can then use that same ajax function to initially create the form
> > also either on a window.onload=function(){Make AJAX Form....}; or
> > using an onclick event too after the page loads.
> > I just love AJAX, there are so many ways to play with it. If you need
> > I can post some code for a more "independent" ajax wrapper so you can
> > take your "ajax-example.php" + queryString and ajaxDisplay.innerHTML
> > out of that function. This will give your ajax apps a lot more
> > versatility.
> > Also,http://paste-it.net/orhttp://pastebin.com/works much better
> > for posting large chunks of code where groups does a lot of
> > reformatting (and line breaks) making code debugging a problem in
> > groups.
> > Cheers!
> > Vision Jinx
> > On Apr 24, 11:36 am, Jamen <jmcgrana...@gmail.com> wrote:
> > > I'm fairly new to trying to use AJAX, so please forgive my ignorance.
> > > I know it is possible to update a form with new content with AJAX, and
> > > I've actually been able to do that - but just on one form element. The
> > > problem I have is trying to update another form element on that same
> > > page.
> > > Here is my js code (update.js):
> > > ----------------------------------------------
> > > 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 ajaxDisplay =
> > document.getElementById('ajaxDiv');
> > > ajaxDisplay.innerHTML = ajaxRequest.responseText;
> > > }
> > > }
> > > var priority = document.getElementById('priority').value;
> > > var id = document.getElementById('id').value;
> > > var express = document.getElementById('express').value;
> > > var queryString = "?priority=" + priority + "&id=" + id +
> > "&express="
> > > + express;
> > > ajaxRequest.open("GET", "ajax-example.php" + queryString, true);
> > > ajaxRequest.send(null);
> > > }
> > > -----------------------------------
> > > Here is my ajax-example.php code:
> > > <?php
> > > //Database connection
> > > include ('db.php');
> > > // Insert a new row in the table for each person returned
> > > while($row = mysql_fetch_array($qry_result2)){
> > > $display_string .= "<tr>";
> > > $display_string .= "<td>This has been updated to<br
> > />$row[priority]</
> > > td>";
> > > $display_string .= "</tr>";
> This should help get you going with what you need. It's the basic AJAX
> GET request wrappers and a sample form handler and looking at the code
> you provided it should help do what your trying to do in a more
> versatile way (meaning your form/query parameters are not hard coded
> in your AJAX handler).
> I did not go too overboard on it and tried to keep it as simple and
> self explanatory as possible. You should be able to add an updated/
> custom version of that form handler to suit your needs (the only thing
> that really needs editing) and I included a javascript wrapper if you
> prefer using document.getElementById over the names for form elements
> as I used in my sample (or you can easily use both).
> Hope this helps :)
> Cheers!
> Vision Jinx
> On Apr 25, 8:37 pm, Jamen McGranahan <jmcgrana...@gmail.com> wrote:
> > To answer your first question: What I want to do is bring up the full record
> > (which contains 46 fields from a MySQL table) with 3 columns:
> > column 1 = field name
> > column 2 = current setting
> > column 3 = forms available for changing the setting
> > This is one reason why I tried to use arrays in my PHP script. Ideally, what
> > I want it to do is allow a user to bring up the full record, find the field
> > they want to update, change the setting and click the Update Field button.
> > This button should activate a function that updates this field and displays
> > in the Current Field with "This field has been updated with $v" (where $v is
> > the new value). Does this make sense?
> > And thanks for the tip about the how to submit codes to groups like this.
> > Jamen
> > On Fri, Apr 24, 2009 at 9:03 PM, Vision Jinx (Guru) <vjn...@gmail.com>wrote:
> > > Hi,
> > > I am not entirely clear on exactly what your asking/needing so if you
> > > can please provide a bit more information that would be great.
> > > Best I can tell what your looking for is you need to separate your
> > > AJAX function in to a more versatile and independent wrapper function
> > > then use another javascript function call on your form to get the
> > > values and create the URL then pass that to your ajax function.
> > > eg. function myajax(queryUrl,resultID){Do Ajax Stuff}
> > > Then this way you can just attach a handler on your form submit
> > > onsubmit="processForm(this);return false;" to grab the data from your
> > > form and create your query string for your ajax function to process.
> > > You can then use that same ajax function to initially create the form
> > > also either on a window.onload=function(){Make AJAX Form....}; or
> > > using an onclick event too after the page loads.
> > > I just love AJAX, there are so many ways to play with it. If you need
> > > I can post some code for a more "independent" ajax wrapper so you can
> > > take your "ajax-example.php" + queryString and ajaxDisplay.innerHTML
> > > out of that function. This will give your ajax apps a lot more
> > > versatility.
> > > Also,http://paste-it.net/orhttp://pastebin.com/worksmuch better
> > > for posting large chunks of code where groups does a lot of
> > > reformatting (and line breaks) making code debugging a problem in
> > > groups.
> > > Cheers!
> > > Vision Jinx
> > > On Apr 24, 11:36 am, Jamen <jmcgrana...@gmail.com> wrote:
> > > > I'm fairly new to trying to use AJAX, so please forgive my ignorance.
> > > > I know it is possible to update a form with new content with AJAX, and
> > > > I've actually been able to do that - but just on one form element. The
> > > > problem I have is trying to update another form element on that same
> > > > page.
> > > > Here is my js code (update.js):
> > > > ----------------------------------------------
> > > > function ajaxFunction(){
> > > > var ajaxRequest; // The variable that makes Ajax possible!
|
