如何延迟显示直到数据解析完毕？
我在将数据解析到面板时遇到一个小问题，这是我的代码：
Ext.onReady(function(){
var stockings = [],i=0;
Ext.regModel('Carding', {fields: ['price'] });
var Detailsstore = new Ext.data.Store({
model: 'Carding',
proxy: {
type: 'ajax',
url: 'http://192.168.1.92/testapp/websample%20backup/sample/assets/www/XMLS/xmlformatses.xml',
reader: {
type: 'xml',
record: 'root'
}
},
listeners: {
single: true,
datachanged: function(){
Detailsstore.each(function(r){
stockings[i++]=r.get('price');
});
alert(stockings[3]);//This alert works fine
}
}
});
Detailsstore.read();
alert(stockings[3]);//this alert even being placed after the Detailsstore it shows undefined . . . . .
var showdetails = new Ext.Panel({
scroll :'vertical',
flex:7,
renderTo: 'bubbleCt',
baseCls: 'kiran',
stretchX: true,
html: '<span style="color:#fff; font-size:20px;"><span style="font-size:25px; font-weight: bold;">' + stockings[2] + '</span><br/><br/><span style="font-weight:bold;">Trading Action Plan :</span><br/>• Buy Price: 1 <br/>• Sell Price:2<br/>• Stop Price 80 cents<br/>• Rule: Sell 50% on double <br/>• 6% Trailing Stop Loss on stock<br/><br/><span style="font-weight:bold;">Volatility Analysis:</span><br/>• <br/>• <br/>• <br/><br/><span style="font-weight:bold;">Techincal Analysis:</span><br/>• <br/>• <br/>• <br/><br/><span style="font-weight:bold;">Fundamental Analysis:</span><br/>• <br/>• <br/>• <br/></span>',
});
var detailspanel = new Ext.Panel({
fullscreen: true,
padding:1,
layout: {
type: 'vbox',
pack: 'center',
align: 'stretch'
},
items: [showdetails]
});
});
上面的问题是当我尝试先运行代码时，第二个警报正在发生并显示未定义....... ..
我的目标是解析数据并将其显示到面板中。
但我认为问题在于该面板甚至在商店完成其运营之前就已显示 第一个警报工作正常并显示其中的值，但该操作是在面板显示后发生的，
请帮助，
谢谢。 。 。 ..
i'm facing a small problem in parsing the data to the panel, here is my code:
Ext.onReady(function(){
var stockings = [],i=0;
Ext.regModel('Carding', {fields: ['price'] });
var Detailsstore = new Ext.data.Store({
model: 'Carding',
proxy: {
type: 'ajax',
url: 'http://192.168.1.92/testapp/websample%20backup/sample/assets/www/XMLS/xmlformatses.xml',
reader: {
type: 'xml',
record: 'root'
}
},
listeners: {
single: true,
datachanged: function(){
Detailsstore.each(function(r){
stockings[i++]=r.get('price');
});
alert(stockings[3]);//This alert works fine
}
}
});
Detailsstore.read();
alert(stockings[3]);//this alert even being placed after the Detailsstore it shows undefined . . . . .
var showdetails = new Ext.Panel({
scroll :'vertical',
flex:7,
renderTo: 'bubbleCt',
baseCls: 'kiran',
stretchX: true,
html: '<span style="color:#fff; font-size:20px;"><span style="font-size:25px; font-weight: bold;">' + stockings[2] + '</span><br/><br/><span style="font-weight:bold;">Trading Action Plan :</span><br/>• Buy Price: 1 <br/>• Sell Price:2<br/>• Stop Price 80 cents<br/>• Rule: Sell 50% on double <br/>• 6% Trailing Stop Loss on stock<br/><br/><span style="font-weight:bold;">Volatility Analysis:</span><br/>• <br/>• <br/>• <br/><br/><span style="font-weight:bold;">Techincal Analysis:</span><br/>• <br/>• <br/>• <br/><br/><span style="font-weight:bold;">Fundamental Analysis:</span><br/>• <br/>• <br/>• <br/></span>',
});
var detailspanel = new Ext.Panel({
fullscreen: true,
padding:1,
layout: {
type: 'vbox',
pack: 'center',
align: 'stretch'
},
items: [showdetails]
});
});
The problem above is that wen i try to run the code first the second alert is taking place and showing the undefined.........
my goal is to parse the data and show it into the panel .
But i think the problem is that the panel is being displayed even before the the store completes it's operation
the first alert is working fine and displaying the value in it but that operation is happening after the panel is displayed already
please help
Thank you . . . ..
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
您的 Ext.data.Store 正在通过对服务器的异步请求加载。它不会阻止 JavaScript 的执行，因此它会发出请求，但不会等待数据返回，然后继续执行脚本的其余部分（即警报、面板等）。
当商店加载时，它将触发事件“load”。当您收到此事件时，那就是您想要制作面板等的时候。
Your Ext.data.Store is being loaded up by an asynchronous request to your server. It doesn't block the execution of JavaScript, so it makes the request, but doesn't wait for the data to get back before continuing on to the rest of your script (i.e. the alert, your panel, etc).
When the store loads, it will fire the event 'load'. When you get this event, THAT's when you want to make your panels, etc.
ext 存储在加载数据时会触发“加载”事件。
向您的商店添加一个加载侦听器，并在加载事件触发后显示您的数据。
http://dev.sencha.com/deploy/dev/ docs/?class=Ext.data.Store
an ext store fires a 'load' event when its data has loaded.
add a load listener to your store and display your data once the load event fires.
http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store
如果您想将数据存储或模型实例绑定到面板，您应该使用模板进行检查 - 这样您就不必检测数据更改，只需在组件上使用 .update() 即可。
另外：商店有一个 autoLoad 标志，可以避免您必须显式执行 read() 。
You should check out using templates if you want to bind a data store or a model instance to a panel - that way you don't have to detect the datachanged and just use .update() on the component.
Also: stores have an autoLoad flag that will avoid you having to do the read() explicitly.