加载从另一个PHP页面div的内容,并显示使用AJAX [英] Loading the content of div from another php page and showing using ajax

查看:145
本文介绍了加载从另一个PHP页面div的内容,并显示使用AJAX的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想显示div的cotent在ajax_form网页,其中显示了谷歌图表中的股利。 什么都内容,我把ajax_form.php页面的主体部分可以通过AJAX待观察,但不是唯一的图

I am trying to show the cotent of div in ajax_form page which shows google chart in its div. What ever content I put in body part of ajax_form.php page could be seen through ajax but not the chart only.

<html>
<head>
    <meta content="text/html;charset=utf-8" http-equiv="Content-Type" />
    <meta content="utf-8" http-equiv="encoding" />
    <script type="text/javascript">
        function viewChart(form, e){
        e.preventDefault();
            e.returnValue=false;    
            var xmlhttp;

        if (window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
            }
        else{// code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
            }
    xmlhttp.onreadystatechange=function(){
        if (xmlhttp.readyState==4 && xmlhttp.status==200){
            document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
            }
    }

    alert("hi");
    xmlhttp.open(form.method, form.action, true);
        xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); 
        xmlhttp.send();
}

       //------------------Chart function end
</script>
</head>
<body>
    <form action="ajax_form_temp.php" method="post" onsubmit="viewChart(this, event)" />
    <h4>CLICK TO VIEW CHART</h4>
    <input type="submit" class="submit" value="submit" name="view"/>
   </form>

    <br />
    <div id="txtHint">
        <b>Person info will be listed here.</b>
    </div>
</body>
</html>

和ajax_form_temp.php是:

and ajax_form_temp.php is:

<html>
  <head>
    <!--Load the Ajax API-->
    <meta content="text/html;charset=utf-8" http-equiv="Content-Type" />
    <meta content="utf-8" http-equiv="encoding" />
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script type="text/javascript">

    // Load the Visualization API and the piechart package.
    google.load('visualization', '1', {'packages':['corechart']});

    // Set a callback to run when the Google Visualization API is loaded.
    google.setOnLoadCallback(drawChart);

    function drawChart() {

    var jsonData = $.ajax({
          url: "ajax_graph_temp.php",
          dataType:"json",
          async: false
          }).responseText;


      // Create our data table out of JSON data loaded from server.
      var data = new google.visualization.DataTable(jsonData);
      var options = {
           title: 'Index analysis',
          is3D: 'true',
          width: 800,
          height: 600
        };
      // Instantiate and draw our chart, passing in some options.
      // Do not forget to check your div ID
      var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
      chart.draw(data, options);
    }
    </script>
  </head>

  <body>

    <!--this is the div that will hold the pie chart-->
    <div id="chart_div"></div>

  </body>
</html>

它显示图形重定向到该页面wihout用ajax但不会显示在ajax_form.php阿贾克斯时使用!

It shows graph by redirecting to the page wihout using ajax but does not shows in ajax_form.php when ajax is used!

推荐答案

财产以后像 $('#PutInToThisDiv)的负载('FromThisPage.php #FromThisDiv');

这篇关于加载从另一个PHP页面div的内容,并显示使用AJAX的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆