Go Back   nV News Forums > Software Forums > Software Development

Newegg Daily Deals

Reply
 
Thread Tools
Old 07-05-07, 06:17 AM   #1
t3hl33td4rg0n
Dethklok Returns!
 
t3hl33td4rg0n's Avatar
 
Join Date: Dec 2004
Location: Kent, OH
Posts: 2,142
Send a message via AIM to t3hl33td4rg0n Send a message via MSN to t3hl33td4rg0n Send a message via Yahoo to t3hl33td4rg0n
Default Learning AJAX....

Well, I have been curious about how the whole "how to update pages without refreshing"... I googled AJAX (I've seen many jobs wanting AJAX experience) out of curiosity to find that AJAX is responsible for this ability. I went ahead and found a simple tutorial on how it works with an elemtary script. So I fired up my WAMP (my LAMP is unavailable) and gave it a shot.

Here is the script: http://ngz2.ath.cx:88/ajax/form.html

I setup the database and it works as it should... Well, it didn't take long to see the possibilities here, unfortunately, I know next to nothing about JS.

My question is, how can I use this type of script to update regular text? Say like inside a div layer or in a table, stuff like that.
__________________


Intel QX9650 @ 3.83GHzXFX 780ieVGA GTX 560Ti8GB GSkill DDR800Creative Sound Blaster X-Fi Titanium PCI-ESeagate 1.5TB . 4x Samsung 2TB

Quote:
Originally Posted by MowTin View Post
....it's so clear how government makes things worse not better...
t3hl33td4rg0n is offline   Reply With Quote
Old 07-05-07, 10:02 AM   #2
stncttr908
Registered User
 
stncttr908's Avatar
 
Join Date: Aug 2002
Location: NJ, USA
Posts: 4,496
Send a message via AIM to stncttr908
Default Re: Learning AJAX....

Good start!

You can change div or span tags by either name or ID I believe. Keep reading. AJAX is great. Pickup the AJAX Bible or Wrox book on the topic.
__________________
PC - | Core i7-2600K @ stock | Gigabyte GA-P67A-UD3 | 4GB Patriot Sector 5 DDR3 | Galaxy GTX 460 1GB @ stock | Corsair Force 120GB SSD | Seagate 1TB 7200RPM | 320GB Seagate 7200.10 | 2x Seagate 500GB USB 2.0 | Lite-On 20x SATA DVD+RW | Silverstone TJ-09 | Corsair 620W PSU | Logitech Z-5500s | Sennheiser HD-570 headphones | Samsung 2494LW |

Laptop - | Dell Inspiron 1420 | C2D T7300 (2.0GHz, 4MB cache) | 2GB DDR2-667 | 160GB 7200RPM HDD | DVD +/- RW | 14.1" WXGA+ (1440x900) | Broadcom 802.11g | NVIDIA 8400M GS 128MB |
stncttr908 is offline   Reply With Quote
Old 07-05-07, 03:19 PM   #3
t3hl33td4rg0n
Dethklok Returns!
 
t3hl33td4rg0n's Avatar
 
Join Date: Dec 2004
Location: Kent, OH
Posts: 2,142
Send a message via AIM to t3hl33td4rg0n Send a message via MSN to t3hl33td4rg0n Send a message via Yahoo to t3hl33td4rg0n
Default Re: Learning AJAX....

Good idea. This 'primitive' example is usually how I learn, study it and understanding the code processes involved. Thats how I learned OOP in PHP. I'll check out some books. Thanks
__________________


Intel QX9650 @ 3.83GHzXFX 780ieVGA GTX 560Ti8GB GSkill DDR800Creative Sound Blaster X-Fi Titanium PCI-ESeagate 1.5TB . 4x Samsung 2TB

Quote:
Originally Posted by MowTin View Post
....it's so clear how government makes things worse not better...
t3hl33td4rg0n is offline   Reply With Quote
Old 07-05-07, 05:49 PM   #4
fivefeet8
Ngemu Mod
 
Join Date: Jul 2003
Location: Fresno, CA
Posts: 1,886
Default Re: Learning AJAX....

Ajax is a nice tool to use if you want to make your pages application like. There are several ways to update content on a page. Most of which require linking to HTML DOM elements by using ID attributes or passing the object itself into a javascript function call. You can use the innerHTML attribute to actually edit the entire content within almost any dom element. Likewise, you can use several DOM methods to create and edit Dom elements on the fly and can retain references to the newly created elements.

A simple example:
Code:
// item is passed in as a DOM object reference
function something(item){

  item.innerHTML = "<div>html between this element was changed including adding a div</div>";

}

// this method adds a DOM child element to the element passed in
// usually the element passed into the function is with the keyword "this"
// ie:  onClick="domMethod(this);"
function domMethod(item){
  
  // create div element
  var div = document.createElement("div");
  // makes the id attribute of the new element "newDiv"
  div.id = 'newDiv';
  // changes all the html between the new div element
  div.innerHTML = "html between this element was changed";
  // append element to item
  item.appendChild(div);
  
}

// sometimes you want to pass into the function an ID of a DOM element instead of a reference
function domMethod(itemID){
  
  // using the element ID, a reference to the element is made
  var item = document.getElementById(itemID);
  item.innerHTML = "html between this element was changed";
}
Once you link to an object using the DOM, you can manipulate it in various ways using javascript and other client side languages. Combined with CSS and PHP, it opens up many possibilities. A lot of it can be overwhelming when you first start out, but luckily, several javascript libararies are available to use. I'm looking at Dojo for a future web application I'm doing. Not only does it have built in AJAX functionality, but it's packed with nice javascript elements that can speed up development. Check out some of the demos.

http://dojotoolkit.org/

There are others which are easy enough to find. You'll also find that creating a fully AJAX enabled website means you're going to come across issues with using the back, refresh, and bookmarking those pages. You're going to have to find alternative ways to use those old style web page functions.
__________________
[i7 2600k @4.4ghertz][2x4 GB DDR3 1600][EVGA GTX570 1.280GB SC][EVGA GTX460 physx][Asrock Extreme7 Gen3 Z68][2xSeagate 160 Gb SATA HD raid0][Seagate 250 GB SATA2 HD][Sony Bravia 40' 1080p LCD HDTV][NEC 3520a DVD+-DLw][Windows 7 Ultimate x64][Rosewill 1000w]
fivefeet8 is offline   Reply With Quote
Old 07-06-07, 03:15 AM   #5
t3hl33td4rg0n
Dethklok Returns!
 
t3hl33td4rg0n's Avatar
 
Join Date: Dec 2004
Location: Kent, OH
Posts: 2,142
Send a message via AIM to t3hl33td4rg0n Send a message via MSN to t3hl33td4rg0n Send a message via Yahoo to t3hl33td4rg0n
Default Re: Learning AJAX....

Awesome, I'll have to mess with this tomorrow since I got the day off. Gives me plenty to play with.thanks for the advice
__________________


Intel QX9650 @ 3.83GHzXFX 780ieVGA GTX 560Ti8GB GSkill DDR800Creative Sound Blaster X-Fi Titanium PCI-ESeagate 1.5TB . 4x Samsung 2TB

Quote:
Originally Posted by MowTin View Post
....it's so clear how government makes things worse not better...
t3hl33td4rg0n is offline   Reply With Quote
Reply


Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump


Similar Threads
Thread Thread Starter Forum Replies Last Post
Overclocking Core i7-3770K: Learning To Live With Compromise News Archived News Items 0 05-24-12 03:50 AM
nvidia: Interested in learning more about Dynamic Parallelism in CUDA, read our white News Archived News Items 0 05-16-12 10:00 PM

All times are GMT -5. The time now is 07:27 PM.


Powered by vBulletin® Version 3.7.1
Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.
Copyright 1998 - 2014, nV News.