AJAX form submit

PHP programming forum. Ask questions or help people concerning PHP code. Don't understand a function? Need help implementing a class? Don't understand a class? Here is where to ask. Remember to do your homework!

Moderator: General Moderators

Post Reply
gth759k
Forum Commoner
Posts: 76
Joined: Mon Jun 15, 2009 3:04 am

AJAX form submit

Post by gth759k »

I recently built a form that submits data to my database with an ajax function that is called through onClick="function ..." on the submit button. That all works perfectly, however the information shown on the page needs to update to reflect the new data so I made that work by calling another ajax function, which also works. The problem is I also have jQuery in the page. When the page loads the jQuery all works, after the ajax function updates the page (without refreshing the browser) none of the jquery works. Any suggestions?

here's the ajax function for updating the data

Code: Select all

 
// Get the HTTP Object
function getHTTPObject(){
    if (window.ActiveXObject) 
        return new ActiveXObject("Microsoft.XMLHTTP");
    else if (window.XMLHttpRequest) 
        return new XMLHttpRequest();
    else {
        alert("Your browser does not support AJAX.");
        return null;
    }
}
 
var httpObject = null;
 
// Set up the updating routine
function displayRegularFeeds(user_id){
    httpObject = getHTTPObject();
    
    var fast = "http://localhost/capicy/regularfeeds.php?id="+user_id;
    if (httpObject != null) {
        httpObject.open("GET", fast, true);
        httpObject.send(null);
        httpObject.onreadystatechange = recieveRegularFeeds;
    }
}
// Recieve the time and display it
function recieveRegularFeeds(){
    if(httpObject.readyState == 4){
        document.getElementById('regularbox').innerHTML = httpObject.responseText;
    }
}
 
heres the onclick from the submit button

Code: Select all

 
echo '<input type="button" id="share" name="share" value="Share" class="sharebuttonlink" onClick="javascript&#058;var phrase = document.getElementById(\'status\').value; shareStatus(phrase); displayRegularFeeds(\''."$user".'\');">';
 
heres the file displayRegularFeeds executes

Code: Select all

 
    include('mysql.php');
    include('feeds.php');
    
    feeds('regular', 'home');
 
Please help!
nshiell
Forum Newbie
Posts: 12
Joined: Mon Oct 19, 2009 12:20 pm

Re: AJAX form submit

Post by nshiell »

What?
Stuff works, doesn't work I'm confused?
Is any of the page being overwritten?


p.s. why don't you submit the form using jQuery rather that your own functions.
gth759k
Forum Commoner
Posts: 76
Joined: Mon Jun 15, 2009 3:04 am

Re: AJAX form submit

Post by gth759k »

How do you do it with jquery?
User avatar
Mirge
Forum Contributor
Posts: 298
Joined: Thu Sep 03, 2009 11:39 pm

Re: AJAX form submit

Post by Mirge »

gth759k wrote:How do you do it with jquery?
By reading the jQuery docs available at http://jquery.com/.
User avatar
el_gato
Forum Newbie
Posts: 12
Joined: Sun Oct 18, 2009 9:28 pm
Location: Bandung
Contact:

Re: AJAX form submit

Post by el_gato »

Your problem was on browser DOM element update. After ajax request call, you must update the DOM elements so the jquery script works. The problem was not on the jquery but on your script that's call ajax request. you must call any function to update the DOM elements. I never used native ajax request like yours (XMLHTTPRequest). i always use prototye to for ajax operation, in prototype this solved by call Ajax.updater function.

Kind Regards
- Lorensius W. L. T
- http://www.londatiga.net -
gth759k
Forum Commoner
Posts: 76
Joined: Mon Jun 15, 2009 3:04 am

Re: AJAX form submit

Post by gth759k »

Since my problem was just that the jQuery no longer worked after the div was updated, I replaced what the jQuery was doing with regular old javascript and now everything works fine.
Post Reply