Question

我有两个div，我想在那里加载模板。我正试图像这样加载，它不起作用。这是我的代码。

main.htm中

Details

 <div id="placeholder1" />
 <div id="placeholder2" />

Template1.htm

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      <script type="text/javascript" charset="utf-8">


            $(document).ready(function () {
                $('#example').dataTable({
                    "bProcessing": true,
                    "bPaginate": false,
                    "sAjaxSource": '/Home/GetReport1',


                });
            });
        </script>

 </head>

TESTING.........

    <div id="dynamic">
    <table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
        <thead>
            <tr>
                <th width="20%">Date</th>
                <th width="25%">Time</th>

            </tr>
        </thead>
        <tbody>
       </tbody>

    </table>
    </div>
    </html>

Template2.htm

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      <script type="text/javascript" charset="utf-8">


            $(document).ready(function () {
                $('#example').dataTable({
                    "bProcessing": true,
                    "bPaginate": false,
                    "sAjaxSource": '/Home/GetReport1',


                });
            });
        </script>

 </head>

TESTING.........

    <div id="dynamic">
    <table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
        <thead>
            <tr>
                <th width="20%">Place</th>
                <th width="25%">Food</th>

            </tr>
        </thead>
        <tbody>
       </tbody>

    </table>
    </div>
    </html>

这里我是如何加载JS文件的模板

myjs.js

 var placeholder = $("#tab");
            placeholder.setTemplateURL("/Templates/Home/main.htm");

            placeholder.load("/Templates/Home/pricinghistory.htm");

            var firstDiv = $("placeholder1");

            firstDiv.setTemplate("/Templates/Home/Template1.htm");

            firstDiv.load("/Templates/Home/Template1.htm");

Answer 1

在您的模板中，您似乎正在使用从未包含其相应脚本文件的dataTable插件。你似乎也在使用jQuery，但我也看不到它的任何引用。因此，请确保已包含要在模板中使用的脚本：

<script type="text/javascript" src="/scripts/jquery.min.js"></script>
<script type="text/javascript" src="/scripts/jquery.dataTables.min.js"></script>

另外，为了调试这些问题，我强烈建议您开始使用诸如FireBug之类的javascript调试工具。它会显示您可能存在的潜在JavaScript错误，您将能够看到来自您的AJAX调用的确切请求/响应，并立即看到它们失败的潜在原因等等。

Answer 2

检查从ajax源返回的数据的Json格式，它应该包含'aaData'。也尝试解决模板页面的麻烦，无论模板页面是否使用数据表获取数据，以后尝试加载到主目录中的div html的

在DIV中加载模板

2 个答案: