CodingForums.com - Manipulating ajax data after load

CodingForums.com (http://www.codingforums.com/index.php)

- Ajax and Design (http://www.codingforums.com/forumdisplay.php?f=55)

- - Manipulating ajax data after load (http://www.codingforums.com/showthread.php?t=273383)

Manipulating ajax data after load

I currently have a script that it uses ajax to search, the results turn up and I have buttons to each result.

Code:

document.getElementById('buttonone').innerHTML = "Search Sent";

Works for the button that loaded with the original page

Code:

document.getElementById('buttontwo').innerHTML = "Added Ty";

Does not work for the button loaded with ajax

Is there a way to register the new elements on ajax load?

You need to put that into the callback of the AJAX function.

Nm I found it, I had to reinitialize the whole thing after the first return of the ajax so the doc would find it.

Hi Acheron,

Are you open to using jQuery, it would make things a bit simpler.

I'll try to show you what VIPStephan means using a jQuery example:

Code:

<h1>Search</h1>



<div id="searchResults">



</div>



<script type="text/javascript">

$(function(){

        

        function getSearchResults(){

                $.post(

                        'url-to-my-search.html',

                        {'searchQuery':'search-string'},

                        function(html){

                                //we're now inside the callback                                

                                //perform actions with data returned from search form

                                $('#searchResults').html(html);

                                

                                //this is where you can put your event for your button

                                $('#button').bind('click', function(e){

                                        getSearchResults();

                                });

                        });

        }

        

        getSearchResults();

        

});

</script>

Your button will have to be on the page: "url-to-my-search.html"

I just ran into this issue myself the other day, and this is how I resolved it.