我是这个主题的新手。我有 div 里面有一些 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);
}
});
});
});
这是因为从服务器返回的 HTML 片段中的小部件需要先解析,然后才能显示在页面中。在您的主页中,您可能有如下代码:
<script type="text/javascript" src="../javascripts/dojo1.6/dojo/dojo.js"
djConfig="parseOnLoad: true"></script>
配置parseOnLoad: true
意味着dojo在页面加载后自动解析整个页面。当您使用 XHR 从服务器获取另一个 HTML 片段时,情况并非如此。在这种情况下,您需要手动解析小部件。
Use 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();
});
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)