?
Solved

Ajax to spice up a PHP script

Posted on 2007-03-26
9
Medium Priority
?
223 Views
Last Modified: 2013-12-13
I have a php script that displays a table of data pulled from a mySQL database.  I've never used Ajax before and have been wanting to give it a try.  I googled around for something similar to what I want to do but haven't found it.
I'd like to click on a "cell" and have it change to a textfield to edit the entry and then post that data either when you click away from the cell or hit enter or even a submit button.

Any ideas or links to similar progects would be helpful.  

This is basically the output from the table:
*************************************
 echo"<tr bgcolor=\"#66FFCC\">
            ";   echo" </td>
            <td>";  echo"{$row11['podate']}</td>
            <td>";  echo"{$row11['ponumber']}</td>
            <td>";  echo"{$row11['custponumber']}</td>
            <td>";  echo"{$row11['pocompany']}</td>
            <td>";  echo"{$row11['season']}</td>
            <td>";  echo"{$row11['startdate']}</td>
            <td>";  echo"{$row11['completedate']}</td>
            <td>";  echo"{$row11['styles']}</td>
            <td>";  echo"{$row11['totalunits']}</td>
            <td>";  echo"{$row11['totalsale']}</td>
                  
                  </tr>";
**************************************************
0
Comment
Question by:livegirllove
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 5
  • 3
9 Comments
 
LVL 21

Expert Comment

by:K V
ID: 18797754
this will teach you from he scratch:
http://www.webpasties.com/xmlHttpRequest/
0
 
LVL 5

Accepted Solution

by:
Gitcho earned 2000 total points
ID: 18797765
Hi  livegirllove ... the code you're asking for can't be posted in full here, because it's too much !

There are two very good ajax frameworks that have inline editing extensions.

One is put out by dojo and is based on the protoype framework : http://dojotoolkit.com/ ... click the "see it in action" button at the top, then "general widgets" button on the left, then "InlineEditBox" about halfway down.

The other one is put out by yahoo and uses the yahoo user interface libraries (yui) which are very well documented. The example & code are here : http://developer.yahoo.com/yui/examples/datatable/inlineediting.html

If you haven't ever used ajax before, i recommend yui, only because there is far more documentation and code examples to get you started.
0
 
LVL 1

Author Comment

by:livegirllove
ID: 18797783
@gitcho
The Yahoo one was exactly what I was looking for.  
@theGhost
I did that tuorial and it was fine but I was looking for something specific.

Hmm now should I close the question or leave it open till I get the result I need...
0
Don't Cry: How Liquid Web is Ensuring Security

WannaCry is just the start. Read how Liquid Web is protecting itself and its customers against new threats.

 
LVL 5

Expert Comment

by:Gitcho
ID: 18797788
another ready-made solution you might like (based on prototype) is by script.aculo.us ... they have some awesome web 2.0 ajax extensions.

http://wiki.script.aculo.us/scriptaculous/show/Ajax.InPlaceEditor
0
 
LVL 5

Expert Comment

by:Gitcho
ID: 18797796
If you can read spanish, i really like the implentation found here :

http://soleup.eup.uva.es/InlineEditor/

the code is good and i like his use of the icons, but it's in spanish ... sorry - heh heh ... maybe you can use http://translate.google.com to make more sense of it ..
0
 
LVL 1

Author Comment

by:livegirllove
ID: 18797945
that spanish one is nice!!  I may try to fight through a translator but it looks like the code snips are all there.  Ill see what I can cut and paste together.  Im going to try YUI first (since I'm uploading it)
0
 
LVL 1

Author Comment

by:livegirllove
ID: 18803272
Ok, I'm feeling extremely dense here.  
I'm using YUI.  I donwloaded the library and examples.
Their example for inline editing  is pulling it's data from a flat file.  I spent about 4 hours reading and trying things but I can't figure out how the query to get the full table data and then post back single fields works.
I think if I could see a code sample using YUI and php and a table in MySQL I could go from there.  I think I'm understanding the principle but I haven't seen the actually queries and how they are called.

for instance how could I duplicate http://developer.yahoo.com/yui/examples/datatable/inlineediting.html

assuming the data came from "tablea"
with coloms:sku,quantity,items,description


0
 
LVL 1

Author Comment

by:livegirllove
ID: 18803339
assuming the query to get the table data is
"SELECT sku,quantity,item,description FROM tablea WHERE blah=blah"

and the update db code snip is

$fieldname = $_GET(THEFIELDBEINGUPDATED)
$content = $_GET(THEDATATOUPDATE)
$sku = $GET_(THEPRIMARYKEYOFTABLE)
UPDATE tablea SET $fieldname = $content WHERE sku = $sku

And I'm only guessing at it being a $_GET.  Is that correct?  




0

Featured Post

Enroll in August's Course of the Month

August's CompTIA IT Fundamentals course includes 19 hours of basic computer principle modules and prepares you for the certification exam. It's free for Premium Members, Team Accounts, and Qualified Experts!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
In this blog, we’ll look at how improvements to Percona XtraDB Cluster improved IST performance.
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses

770 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question