Grid Compatibility with SimpleDialog

[bgriffith]

Please feel free to point out something I'm doing wrong. Below is the code I am using along with the XML grid example.

While I'm posting, I'd also like to mention that I cannot get the XML grid to display its initial result set (from the local XML file) when I am openning the page locally. I have to upload it to a web server to get it to work. Locally, I see the headings, but there are no rows in the grid.

As for the SimpleDialog compatibility, I get weird scroll bars, and the grid is moved down below the visible portion of the screen. Here is my code. Please give it a try and let me know if this is a compatibility bug or possibly something I'm doing wrong. I simply added a button with onclick="showdlg()":

function showdlg()
{
dlg = new YAHOO.widget.SimpleDialog("dlg", { modal:true, visible:false, width:"350px", fixedcenter:true, constraintoviewport:true, draggable:true });
dlg.render(document.body);
dlg.show();
}

Is there a work-around for this?

[jack.slocum]

Can you also show me your grid code and how it is being added to the dialog?

Thanks,
Jack

[bgriffith]

I had trouble pasting the HTML code into this post. Check out the code here:
http://www.bradgriffith.com/tools/grid/grid_xml.html

This same page, copied with its directory structure straight from my computer, does not show any content on my local HD.

Clicking the "Show Dialog" button will demonstrate the compatibility problem. Is there something I can do to my CSS as a work-around?

[jack.slocum]

The grid uses XMLHttpRequest to load files. XMLHttpRequest can only talk to servers on the same domain and can't access the local hard drive. This is a standard limitation and there is no workaround for accessing the local hard-drive that I know of.

It wouldn't matter what you had on the page, it would be pushed down. The problem appears to be that that required CSS files for the SimpleDialog to work are missing. So when you call dlg.render(document.body) it calls insertBefore() internally and inserts it before the grid. Since it has no CSS defined (like position:absolute), the overlay is just pushing the grid right off the screen.

Grab the dialog css file from the asset directory in your Yahoo! UI download and it should fix your problem.

Jack

[jack.slocum]

By the way, thanks for putting up a page. It makes it so much easier!

[bgriffith]

Thanks so much for your help. I am truly sorry for making you spend your valuable time troubleshooting--I definitely wouldn't have posted with that intent! I will spend some more time looking at my code and troubleshooting it myself before jumping to a a conclusion next time.

Thank you also for the fantastic YUI extensions. I am very impressed with your work, and I am looking forward to the next release with the editable grid and anything else you toss in!

[jack.slocum]

It's ok, that's what the forum is for. There's alot of code to the grid and it's only logical to think that it could possibly be the cause.

Good luck with your project and if you have any more problems feel free to post.

Jack