:: Forum >> Version 2 >>
HELP!!! CSV tbl.request fails on host
Hi all,
I am stuck with the problem.
I have built a page using html and javascript and it works fine from my local machine. As soon as I copy the file to the server and run it from there it does not work. The line it fails on is tbl.request();
I have been on this problem for too long and I think I need some more eyes. thanks in advance guys.
here's the full code:
<html>
<head>
<script src="../../runtime/lib/aw.js"></script>
<link href="../../runtime/styles/xp/aw.css" rel="stylesheet"></link>
</head>
<body>
<style>
#myGrid { width: 600px; margin: 0px; padding: 0px; background: #404040;}
#myGrid .aw-grid-row {height: 16px; border-bottom: 1px solid #C6C6C6; }
#myGrid .aw-alternate-even .aw-column-0 {background: #E0E0E0;}
#myGrid .aw-alternate-odd .aw-column-0 {background: #E0E0E0;}
#myGrid .aw-alternate-even {background: #E7E7D6;}
#myGrid .aw-alternate-odd {background: #F7F3E7;}
#myGrid .aw-cells-selected {background: default; color: black;}
#myGrid .aw-column-0 {width: 50px; border-right: 1px solid #848484; cursor:default;}
#myGrid .aw-column-1 {width: 110px; border-right: 1px solid #C6C6C6; cursor:hand; }
#myGrid .aw-column-2 {width: 70px; border-right: 1px solid #C6C6C6; cursor:hand; text-align: right; }
#myGrid .aw-column-3 {width: 70px; border-right: 1px solid #C6C6C6; cursor:hand; text-align: right; }
#myGrid .aw-column-4 {width: 70px; border-right: 1px solid #C6C6C6; cursor:hand; text-align: right; }
#myGrid .aw-column-5 {width: 70px; border-right: 1px solid #C6C6C6; cursor:hand; text-align: right; }
#myGrid .aw-column-6 {width: 70px; border-right: 1px solid #C6C6C6; cursor:hand; text-align: right; }
#myGrid .aw-column-7 {width: 70px; border-right: 1px solid #C6C6C6; cursor:hand; text-align: right; }
#myGrid .aw-column-8 {width: 70px; border-right: 1px solid #C6C6C6; cursor:hand; text-align: right; }
#myGrid .aw-column-9 {width: 70px; border-right: 1px solid #C6C6C6; cursor:hand; text-align: right; }
#myGrid .aw-column-10 {width: 70px; border-right: 1px solid #C6C6C6; cursor:hand; text-align: right; }
#myGrid .aw-column-11 {width: 70px; border-right: 1px solid #C6C6C6; cursor:hand; text-align: right; }
#myGrid .aw-grid-headers {font-weight: bold; cursor:pointer;}
#myGrid .aw-grid-footers {background: #E7E7D6; border-top: 1px solid #C6C6C6; border-bottom: 1px solid #C6C6C6; }
#myGrid .aw-grid-footers .aw-column-0 {background: #E0E0E0;}
#myInpt {width:120%; height:100%; margin:-2px; margin-left:-4px;}
</style>
<script>
//
// had to add
// e.select();
// after
// e.setExpression("test", "this.value");
// in
// lib/templates/input.js
//
// for selecting the text in the edit of a cell.
//
new AW.CSV.Table;
AW.CSV.Table.prototype.response = function(text){
this._rows = text.split(/\r*\n/);
this._data = []; // missing in beta3
if (this.$owner) {
var sortCol = this.$owner.getSortColumn(); // required for keeping sort
var sortDir = this.$owner.getSortDirection(sortCol); // required for keeping sort
// this.$owner.clearScrollModel(); // missing in beta3
this.$owner.clearSelectionModel();
this.$owner.clearSortModel();
this.$owner.clearRowModel();
this.$owner.setRowCount(this.getCount());
this.$owner.refresh();
if (sortCol>= 0) this.$owner.sort(sortCol, sortDir); // added a resort to make sure sorting is kept after refresh.
}
};
//
// Declaring objects...
//
var tbl = new AW.CSV.Table;
var obj = new AW.Grid.Extended;
var str = new AW.Formats.String;
var num = new AW.Formats.Number;
var htm = new AW.Formats.HTML;
var edt = new AW.UI.Input;
//
// Declaring some variables...
//
var reloadid
var myCODE = ""
var myCODEc = 0;
var myCODEr = 0;
var myURL = "http://au.finance.yahoo.com/d/quotes.csv?s="; // just remove the (au.) for US time.
var myCODES = "BHP.AX,TLS.AX,CBA.AX,NAB.AX,WBC.AX,AXA.AX,RIO.AX,AGL.AX,ALL.AX,AMP.AX,ANZ.AX,AMC.AX,BIL.AX,BLD.AX,CCL.AX,CML.AX";
var myCOLS = "&f=snc6p2l1b3b2ohgt1d1&e=.csv"; // codes: http://gummy-stuff.org/Yahoo-data.htm
var myColor = 2; // column which colors cell data.
var myHeaders = ["Code", "Name", "+/-", "%", "Last", "Bid", "Ask", "Open", "High", "Low", "Time", "Date"];
var myFormats = [ str, str, num, num, num, num, num, num, num, num, str, str];
var myFooters = [];
//
// Initialising...
//
tbl.setURL(myURL+myCODES+myCOLS);
tbl.request(); // Async retrieval of data
obj.setCellModel(tbl); // row length set dynamically from data
obj.setHeaderText(myHeaders); // set the headers
tbl.setFormats(myFormats); // set the formats
obj.setColumnCount(myHeaders.length); // dynamic column length from data
obj.setId("myGrid"); // necessary for CSS rules
obj.setCellEditable(false); // disable editing on all
obj.setCellEditable(true , 0); // Enable editing on column 0
obj.setHeaderCount(1); // make sure only one header line.
obj.setSelectorVisible(false); // remove row selector.
obj.setVirtualMode(false); // disable virtual mode
obj.setFooterVisible(true); // enable footer
obj.setFooterText(myFooters); // set blank line text
obj.setFooterCount(1); // make sure only one footer line
obj.setFooterHeight(16); // set standard row height
edt.setId("myInpt"); // necessary for CSS rules
obj.defineCellProperty("color", function(col, row){ return colorCell( this.getCellText(myColor, row) ); });
obj.getCellTemplate(0).setStyle("color", function(){ return this.getControlProperty("color"); });
obj.getCellTemplate(2).setStyle("color", function(){ return this.getControlProperty("color"); });
obj.getCellTemplate(3).setStyle("color", function(){ return this.getControlProperty("color"); });
document.write(obj);
//
// Required to capture edited text as it is typed...
//
obj.onCellTextChanged=function(val,col,row){
myCODE = val;
myCODEc = col;
myCODEr = row;
}
//
// Required to commit the change of edited text once editing complete.
//
obj.onCellValueChanged=function(val,col,row){
if (col==myCODEc && row==myCODEr) {
myCODE = addCodeClean(myCODE);
if (myCODES.indexOf(myCODE)>=0) myCODE="";
if (myCODE != val) {
updateCodes(myCODE,col,row);
//clearTimeout(reloadid);
reload(0);
}
}
}
//
// Required for drag and drop of body...
//
obj.onCellMouseDown = function(event, column, row){ if (column>0) dragstart(event) };
obj.onCellMouseUp = function(event, column, row){ dragstop() };
obj.onControlMouseUp = function(event){ dragstop() };
//
// Required for adding code to grid
//
obj.onFooterClicked = function(event,index){
//if (index==0){
obj.setFooterText(edt,0);
obj.getFootersTemplate(0,0).refresh();
var edit = edt.element().getElementsByTagName("input")[0];
edit.focus();
edit.select();
AW.attachEvent(edit, "onblur", addCode);
AW.attachEvent(edit, "onkeydown", addCodeKey);
//}
};
//
// Function that refreshes data in grid based on new myCODES list...
//
function reload(i){
var now = new Date();
//document.getElementById("info2").innerHTML = myCODES;
tbl.setURL(myURL+myCODES+myCOLS);
tbl.request();
for(var i=2;i<obj.getColumnCount();i++) obj.getCellTemplate(i).refresh();
var now1 = new Date();
var load = (now1-now) / 1000;
window.status = "Last Response: " + now1 + " ... Live Response Time: " + load + " secs";
if (i==0) return reloadid;
reloadid=setTimeout('reload()', 5000); // 5 second refresh
}
//
// Function that is fired onblur of input footer box.
//
function addCode(){
var edit = edt.element().getElementsByTagName("input")[0];
myCODE = addCodeClean(edit.value); // get and clean the code entered
AW.detachEvent(edit, "onblur", addCode);
obj.setFooterText("",0); // remove the edit box.
obj.getFootersTemplate(0,0).refresh();
if (myCODES.indexOf(myCODE)<0) { // if code does not already exist in the list
myCODES = myCODES + "," + myCODE; // then add it
//clearTimeout(reloadid);
reload(0); // and refresh data
}
}
//
// Function that captures the return key on footer edit box and fires the onblur event.
//
function addCodeKey(e){
var code = event.keyCode;
if (code == 13) addCode();
}
//
// Function to clean code... (make it upper case and add extension of .AX for Australian Codes.)
//
function addCodeClean(c){
c = c.toUpperCase();
if (c.indexOf(".")<0 && c.length>0) return c+".AX";
else return c;
}
//
// Function that updates the code list with the new value
//
function updateCodes(v,c,r){
str = "";
for (var x=0;x<obj.getRowCount();x++) {
if (c==0 && r==x) str = str + "," + v;
else str = str + "," + obj.getCellText(0,x);
}
myCODES = str.substr(1);
}
//
// Fucntion will be used later to color background of each cell changed.
//
function colorCell(v) {
if (v<0) return "#A00000";
if (v>0) return "#00A000";
return "default";
}
function colorCellbackground(o,n,x,y) {
if (o) { if (n > o[x]) obj.getCellTemplate(x, y).setStyle("background", "#C0F8C0");
if (n < o[x]) obj.getCellTemplate(x, y).setStyle("background", "#F8C0C0"); }
}
//
// Dragging functions...
//
var dragapproved=false
var offsetx, offsety, tmpx, tmpy, maxx, maxy
function dragstart(e){
dragapproved=true;
offsetx=event.clientX;
offsety=event.clientY;
tmpx=obj.getScrollLeft();
tmpy=obj.getScrollTop();
maxx=obj.getScrollWidth() - document.getElementById("myGrid").offsetWidth + 18;
maxy=obj.getScrollHeight() - document.getElementById("myGrid").offsetHeight + 18;
if (document.getElementById("myGrid")) document.getElementById("myGrid").onmousemove=dragdrop
}
function dragdrop(e){
if (dragapproved&&event.button==1){
x=tmpx+offsetx-event.clientX
y=tmpy+offsety-event.clientY
}
if (x<0)x=0;
if (y<0)y=0;
if (x>maxx)x=maxx;
if (y>maxy)y=maxy;
obj.setScrollLeft(x);
obj.setScrollTop(y);
}
function dragstop(){
dragapproved=false;
if (document.getElementById("myGrid")) document.getElementById("myGrid").onmousemove=null;
}
</script>
<p></p>
<input type="button" value="refresh" onclick="reload()"/>
<input type="button" value="stop" onclick="clearTimeout(reloadid);"/><br/>
<p id="info" name="info" style="font-family:arial;font-size:12px">
Double click on a code and change it to change the item. <br>
Double click on a code and delete the text and it will delete the line. <br>
Click on the footer and add a code it will add a line to the list. <br>
Click and drag on the body data to scroll.
</p>
<p id="info2" name="info2" style="font:courier;font-size:10px">
</p>
</body>
</html>
Alex from Sydney
Monday, January 9, 2006
Update on this problem,
I have reinstalled the original beta3 and ran the load csv.htm from the old examples. this worked. I then changed the seturl command to look at some simple text from yahoo...
http://finance.yahoo.com/d/quotes.csv?s=BHP,MSFT&f=snl1b3b2&e=.csv
if you run this in your browser its fine. But off the server it fails.
Any Ideas. Please ...
I am using ie
Alex from Sydney
Tuesday, January 10, 2006
Ive just done some debugging and I get a permission denied on the aw._http.open command. any ideas. ????
Alex from Sydney
Tuesday, January 10, 2006
I may be wrong, but with normal security settings on your browser, I am pretty sure you can't read data from another domain with Javascript, without getting errors. If you lower your security settings it may work. AFAIK you need to use the same domain to load data. Can anyone else confirm that?
Tony
Tuesday, January 10, 2006
yes, this is due to the cross-domain security restrictions - you can only request data from your own domain. You have to make data requests to another domains through a proxy script on your own server.
Alex (ActiveWidgets)
Tuesday, January 10, 2006
Thanks for the info guys, I have done this through asp.net code. I might try and use this to request the page first then return this to the CSV tbl.request
I'll let you know.
Alex from Sydney
Tuesday, January 10, 2006
Excellent! it worked... Thanks. Alex / Tony for your input...
here is the resulting .net code
<%@ Page Language="VB" Debug="true" %>
<%@ Import Namespace="System.Net" %>
<%@ Import Namespace="System.IO" %>
<script language="VB" runat="server">
Sub Page_Load(Src As Object, E As EventArgs)
dim astr
dim URL2
URL2 = request.querystring("u")
URL2 = replace(URL2,"-","&") ' not the best way to pass params (I know)
astr = readHtmlPage(URL2)
myPage.Text = astr
End Sub
Function readHtmlPage(url As String) As String
Dim objResponse As WebResponse
Dim objRequest As WebRequest
Dim result As String
objRequest = System.Net.HttpWebRequest.Create(url)
objResponse = objRequest.GetResponse()
Dim sr As New StreamReader(objResponse.GetResponseStream())
result = sr.ReadToEnd()
sr.Close()
return result
End Function
</script>
<asp:literal id="myPage" runat="server"/>
And here is the modifed section of code from the above post
var myURL = "http://www.mydomain.com.au/aspdotnetcode.aspx?u=http://au.finance.yahoo.com/d/quotes.csv?s=";
var myCODES = "BHP.AX,TLS.AX,CBA.AX,NAB.AX,WBC.AX,AXA.AX,RIO.AX,AGL.AX,ALL.AX,AMP.AX,ANZ.AX,AMC.AX,BIL.AX,BLD.AX,CCL.AX,CML.AX";
var myCOLS = "-f=snc6p2l1b3b2ohgt1d1-e=.csv"; //note the & were changed to - here and are replaced by the .net code
change
www.mydomain.com.au to your own domain and aspdotnetcode.aspx to the filename of the program above... and thats it.
Thanks again Alex(ActiveWidgets). Your grid is working a treat and is an Excellent project, the best ive seen on the net and I have been looking for a grid for a while. Let me know if you need any help.
Alex from Sydney
Tuesday, January 10, 2006
Exactly, that is what Alex was refering to as proxy which I normally call a tunnel to access data outside the domain. I use XMLHttpRequest methods to load the data, but not the built in AW library because I found the code I use to be simpler. But it's probably my lack of experience with AW code.
Tony
Tuesday, January 10, 2006
Thanks Tony, maybe you could post a sample of your code for reference as well.
Alex from Sydney
Tuesday, January 10, 2006
Here is my function. It's not using ASYNC but it works for most of my purposes. Also I also usually use POST that way if I need to POST data then I just pass to the function, otherwise I just pass GET in the URL.
function loadDoc(url,postdata) {
req = false;
if (window.XMLHttpRequest) {
try { req = new XMLHttpRequest(); } catch(e) { req = false; }
} else if (window.ActiveXObject) {
try { req = new ActiveXObject("Msxml2.XMLHTTP"); }
catch(e) {
try { req = new ActiveXObject("Microsoft.XMLHTTP"); }
catch(e) { req = false; }
}
}
if(req) {
req.open("POST", url, false);
req.onreadystatechange = function() {return true;}
req.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
req.send(postdata);
return req.responseText;
}
}
Tony
Tuesday, January 10, 2006
This topic is archived.
Back to support forum
Forum search
