html - How to Call the one php page content and display it another php page using ajax

565

I have index page, in that i have 2 button "Staff Details" and "Student Detalis" When i click "Staff Details" , the content of "staffDetails.php" should display in index.php

Similarly, "STudent details" also

Ajax Function:

function search1()
    {       $.ajax({
                    Type:'GET',
                    url:'StaffDetails.php',
                    success:function(html)
                    {
                        document.getElementById("StaffDetails").innerHTML=html;
                    },
                })
    }

925

Answer

Solution:

here is a complete ajax function use like this and help full for you in future

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="http://code.jquery.com/jquery-1.7.min.js" type="text/javascript"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
function search1(){
$.ajax({  

  type: "POST",  
  url:"StaffDetails.php",  

  beforeSend: function()
  {
  },
  success: function(resp)
  {  

    $("#StaffDetails").html(resp);

  }, 

  complete: function()
  {
  },

  error: function(e)
  {  
  alert('Error: ' + e);  
  }  
  }); 
}

function search2(){
 $.ajax({  

  type: "POST",  
  url:"StudentDetails.php",  

  beforeSend: function()
  {
  },
  success: function(resp)
  {  

    $("#StudentDetails").html(resp);

  }, 

  complete: function()
  {
  },

  error: function(e)
  {  
    alert('Error: ' + e);  
  }  
}); 
}
</script>
</head>

<body>
<input type="button" value="Staff Details" onclick="search1()" />
<input type="button" value="Student Details" onclick="search2()" />
<div id="StaffDetails">
</div>
<div id="StudentDetails">
</div>
</body>

here is full ajax working and tested example hope no question left now. Thanks!

People are also looking for solutions to the problem: php - Use post_type in admin_menu action callback with wordpress

Source

Didn't find the answer?

Our community is visited by hundreds of web development professionals every day. Ask your question and get a quick answer for free.

Ask a Question

Write quick answer

Do you know the answer to this question? Write a quick response to it. With your help, we will make our community stronger.