我通過構建一個非常基本的基於Web的聊天應用程序教我自己的JavaScript。道場網格不滾動到最後一個項目
聊天消息發佈到Web服務器。 HTML聊天客戶端定期輪詢Web服務器以下載任何新消息。
聊天消息使用dojo網格顯示。
我的問題是我無法將網格滾動到最後一條消息。我曾嘗試使用scrollToRow,但它不起作用。
JavaScript代碼是此處=>
<html>
<head>
<style type="text/css">
@import "./dojoroot/dojo/resources/dojo.css";
@import "./dojoroot/dijit/themes/tundra/tundra.css";
@import "./dojoroot/dojox/grid/resources/Grid.css";
@import "./dojoroot/dojox/grid/resources/tundraGrid.css";
.input {
width: 100%;
padding: 0;
text-align: justify;
}
.dojoxGridHeader {
display: none;
}
</style>
<script language="JavaScript" src="./dojoroot/dojo/dojo.js" djConfig="isDebug: false, parseOnLoad: true">
</script>
<script type="text/Javascript">
dojo.require("dojo.parser");
dojo.require("dojo.dom-style");
dojo.require("dojox.grid.DataGrid");
dojo.require("dojo.data.ItemFileWriteStore");
dojo.require("dijit.layout.ContentPane");
var chatData={items:[]};
var chatStore=new dojo.data.ItemFileWriteStore({data:chatData});
var chatLayout=[[{'name':'Sender','field':'sender','width':'10%'},
{'name':'Message','field':'message','width':'90%'}]];
var chatRow=0;
</script>
</head>
<body>
<div align="center">
<div dojoType="dijit.layout.ContentPane" sizeMin="10" sizeShare="10">
<div id="gridDiv" style="text-align:left; border: 1px solid #aaa; width:98%; height:80%; overflow:auto;">
</div>
</div>
<script type="text/javascript">
var grid=new dojox.grid.DataGrid({id:'grid',
store:chatStore,
structure:chatLayout,
rowSelector:'0px'});
grid.placeAt("gridDiv");
grid.startup();
setInterval(listenToServer,250);
function listenToServer() {
dojo.xhrGet({
url: "http://localhost:8080/ChatProject/ListenToServer",
handleAs: "json",
load: function(data) {
if (data!=null) {
if (data.message!="") {
var myNewItem = {sender: data.sender, message: data.message};
chatRow++;
// Insert the new item into the store:
// (we use store3 from the example above in this example)
chatStore.newItem(myNewItem);
chatStore.save();
var lastRow=grid.store._arrayOfAllItems.length-1;
grid.scrollToRow(lastRow);
}
}
}
});
}
</script>
</body>
</html>
的網格不向下滾動到最後一條消息。
任何幫助將不勝感激。
謝謝。
James。
嘗試在添加行後調用調整大小。 – tik27
非常感謝您的建議,但恐怕它不起作用。我在chatStore.save()之後立即添加了grid.resize(),但網格停止顯示任何內容。 – user1936427