CODEWITHSUNDEEP
javascriptphphtmlajax
Laurin Stahl
Laurin Stahl

Reputation: 13

Call Javascript function after AJAX load

I know that these kind of questions pop up a lot on here. I usually am not the type to ask questions but this time I could not find a solution through searching.

I have boiled down my problem to a very small and simple environment:

I have 3 files:

Index.php:

<html>
<html xmlns="http://www.w3.org/1999/xhtml">
<script src="javascript.js"></script>
<head>
    <title>Test</title>
</head>
<body>
<div>
    <input type="button" value="Show" onclick="show('content','content.php');">
    <script type="javascript/text">
        show('content','content.php');
    </script>
    <br>
    <div id="content"></div>
</div>

content.php

<div>CONTENT</div>
<input type="checkbox" id="checkbox" onclick="checkbox();">
<input type="text" id="textfield">

And javascript.js

function show(divcontainer,file){
var xmlhttp;
if (window.XMLHttpRequest) {
        xmlhttp = new XMLHttpRequest();                     
    } 
    else {                                                  
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
        xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
                    document.getElementById(divcontainer).innerHTML=xmlhttp.responseText;
                }
            }
            xmlhttp.open("GET", file);                  
            xmlhttp.send();         
}
function checkbox(){
    if(document.getElementById('checkbox').checked){
        document.getElementById('textfield').value = "checked";
    }
    else{
        document.getElementById('textfield').value = "unchecked";
    }
}

When I press the button in index.php it loads the file content.php into the div container "content" via an ajax call. The file content.php has a checkbox and a textfield. When the checkbox is checked and unchecked it executes a javascript function that puts checked/unchecked in the textfield. Simple enough and everything works fine. Now what I want to do is to call the function checkbox() the moment that content.php is loaded. In this example it would mean that the textbox would already have the value "unchecked" and not only after the checkbox has been checked and unchecked again.

Putting the javascript code into the file content.php didn't do anything.

Somehow I feel that there must be a simple solution to this. I'm still pretty new to javascript though so I don't know the in and outs yet.

Any help would be greatly appreciated

Many thanks!

Upvotes: 1

Views: 5211

Answers (2)

invad0r
invad0r

Reputation: 926

if you´re new to JS you should definitely have a look at jQuery. Makes AJAX alot simpler.

$.ajax({
    url: youURL, 
    success: function (){
        //or whatever function you want to be called after success :)
    }
});

Upvotes: 0

Nauphal
Nauphal

Reputation: 6192

Try this

   if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
        document.getElementById(divcontainer).innerHTML=xmlhttp.responseText;
        checkbox();
   }

Upvotes: 2

Related Questions