外部ページjQueryロードイベントを使用してグラフページを読み込んでいるときにモリスチャートが読み込まれない

Question

別のページから現在のページにDONUT CHARTをロードしたい。 は - 私はホーム・ページのボタンをクリックしていくつかのより多くの罪滅ぼしiは、グラフ-page.phpのチャートをdispalyしたい

注：私は手動でそれがうまく

Home.phpを働いてGraph_page.phpを実行すると

<input class="button" type="button" /> 
    <div class="home"></div> 

     <script> 
     $(document).ready(function(){ 
     $(".button").click(function(){ 
     $(".home").load("Graph_page.php", function(responseTxt, statusTxt, xhr){ 
      if(statusTxt == "success") 
      //success alert 

      if(statusTxt == "error") 
     //error alert 
    }); 

    }); 

    }); 
    </script> 

Graph_page.php

 <div class="box-body chart-responsive"> 
    <div class="chart" id="sales-chart" position: relative;"></div> 
      </div> 

//script DONUT CHART 
<script type="text/javascript"> 
    $(function() { 
    "use strict";  
    var donut = new Morris.Donut({ 
     element: 'sales-chart', 
     resize: true, 
     colors: ["#f56954","#00a65a","#3c8dbc"], 
     data: [ 
     {label: "Absent Days", value: 5}, 
     {label: "Present Days", value: 10}, 
     {label: "Working Days", value: 15} 
     ], 
     hideHover: 'auto' 
    }); 

    }); 
</script> 

Answer 1

モリスビルダーは最近ロードされたDOMを認識しませんので、このビルドは後にページをロードし、この

$(".home").load("Graph_page.php", function(responseTxt, statusTxt, xhr){  
var donut = new Morris.Donut({ 
    element: 'sales-chart', 
    resize: true, 
    colors: ["#f56954","#00a65a","#3c8dbc"], 
    data: [ 
    {label: "Absent Days", value: 5}, 
    {label: "Present Days", value: 10}, 
    {label: "Working Days", value: 15} 
    ], 
    hideHover: 'auto' 
}); 

ための最良の方法。