Question

我是这个话题的新手。我在里面有一些dojo小部件。我使用ajax重新加载这个div，但在此之后我的dojo小部件没有显示。如何让我的浏览器在ajax请求后重新加载小部件。我不想重新加载整个页面。

我的ajax视图部分：

<div dojoType="dijit.layout.BorderContainer" gutters="true" id="borderContainerTwo">
<?php foreach($wynik as $row): ?>
    <div dojoType="dijit.layout.ContentPane" region="center" splitter="false">
       <p id="category"><img src="/photo/category/<?php echo $row->idPropozycji;?>.jpg" width="100" height="130" style="float: left;"></p>
       <?php echo $row->opis; ?>
    </div>

    <div dojoType="dijit.layout.AccordionContainer" id="leftAccordion" region="leading" splitter="true">
        <div dojoType="dijit.layout.AccordionPane" title="Title">
          <h3><?php echo $row->nazwa2; ?></h3>
        </div>

        <div dojoType="dijit.layout.AccordionPane" title="Place">
           <?php echo  $row->place;?>   
        </div>

   </div>           
 <?php endforeach;?>
 </div>

重新加载JQuery脚本：

// Functon to Show out Busy Div
function showBusy(){
$('#ajax-content').block({
    message: '<h1>Wczytuje dane</h1>',
    css: {border:'3px solid #FFF'}
});
}

function updatePage(html){

window.setTimeout( function(){
    $('#ajax-content').html(html);
}, 2000)


 } 


 $(document).ready(function() {

// $.AJAX Example Request
$('.ajax-pag > li a').live('click', function(eve){
    eve.preventDefault();

    var link = $(this).attr('href');
    console.log(link);
    $.ajax({
        url: link,
        type: "GET",
        dataType: "html",
        beforeSend: function(){
            showBusy();
        },  
        success: function(html) {
            updatePage(html);
        }
        });


 });    


 });

Answer 1

这是因为从服务器返回的HTML片段中的小部件需要首先被解析，然后才能在页面中显示。在您的主页面中，您可能拥有如下代码：

<script type="text/javascript" src="../javascripts/dojo1.6/dojo/dojo.js"
djConfig="parseOnLoad: true"></script>

配置parseOnLoad: true表示在加载页面后，dojo会自动解析整个页面。当您使用XHR从服务器获取另一个HTML片段时，情况并非如此。在这种情况下，您需要手动解析小部件。

使用dojo.parse.parse函数解析DOM节点树。因此，您需要做的是在将HTML片段添加到页面后调用此函数。例如，

$('#ajax-content').html(html);    
dojo.parser.parse(dojo.byId('ajax-content'));

您需要注意的一件事是确保在再次更新页面之前销毁小部件以避免内存泄漏。 dojo.parser.parse函数返回所有已解析的小部件对象的数组。因此，在再次更新页面之前，您可以迭代此数组并销毁这些小部件。

//Save the last parsed result
var widgets = dojo.parse.parse();

//Before update
if (widgets) {
    widgets.forEach(function(widget) {
        widget.destroyRecursive();
    });
}

在ajax请求后重新加载dojo小部件

1 个答案: