HTML Data Sets on Website
Hi,
I recently started using dreamweaver to create a website for school. I uploaded the home page here:https://netfiles.uiuc.edu/rbasava2/www/home.htm
Don't worry about the messed up video.
I put up the texts for the links up on the side. What I'm trying to do is when the link is clicked on the side, I only want to reload the box in the middle which will contain all the content. I looked into this a little and I think I have to use an html data set, but I wasn't able to figure out how to set this up or how to link it up to the links so it makes it so only the box reloads?
Here are a couple of links for HTML data sets:
http://www.adobe.com/devnet/dreamweaver/articles/spry_creating_html_data_set.html
http://www.adobe.com/designcenter/dreamweaver/articles/lrvid4047_dw.html
Another technique you might want to look into is Spry Tabbed Panels:
(this first reference is a little technical, but a pretty good overview) http://livedocs.adobe.com/en_US/Spry/SDG/help.html?content=WS6FED301A-59A1-45ce-BC1F-11074 3A27FE9.html
http://help.adobe.com/en_US/Dreamweaver/10.0_Using/WSC21A9606-FECA-431c-A617-AE65C4BDB8C5. html
A nice reference for Spry in general is here: http://labs.adobe.com/technologies/spry/samples/
Have fun...
Beth
Similar Messages
-
Involve more than one HTML data set.
Hello,
I am building a website and using spry data sets for it. I need to have opportunity to involve more than one data set. In this sample found exactly what I need - http://livedocs.adobe.com/en_US/Spry/SDG/help.html?content=WSFC985AA5-C5E9-4266-ACE0-62299 A0E0B70.html but in my case I am using HTML data set not the XML. In all browsers except IE all seems to work fine, but I get an Spry debugger error - Spry.Data.HTMLDataSet: 'garden2' is not a valid element ID. 'garden2' is a id for table that I am using as HTML data source. It seems that dreamweaver ain't too supporting this thing with HTML as in that sample, because when i try to open this Data set in bindings panel I get an error - Invalid URL schema. My idea is that , one HTML data set contains the name list of the products categories and unique url for each product name , and this unique url shows path for other HTML data set for each product, which contains product list for each category. Link to the part of my website where I am trying to do this stuff http://www.varpa.eu/garden.html?row=0 .
So how can I get rid of the Spry debugger error and make it work in IE ?
Thank you,
Richard.I found why page wasn't working on IE,I had not just closed one <tr> tag in HTML data set file. But spry debugger error still occurs in Opera , Safari , Chrome and Dreamweaver live view and I can't still open the second second data set in bindings panel.To hide this <div> with spry debugger error, I just attached style to ir visibility : hidden; . But it's still very weird though that adobe isn't supporting this option for HTML data set, but supports only for XML , isn't it ?
Richard. -
Using URL Parameters to Control Data Regions - HTML Data set.
Hello folks,
I creating a website for company and I am using HTML data set for siderbar navigation and content. It works beautifully and content updates as it have to without page refreshing. But I need to have an unique url for each sidebar element, so I i found this nice sample http://labs.adobe.com/technologies/spry/samples/data_region/DataWithURLParams.html?row=20. I did analogy with that sample on my website and indeed all sidebar elements now have unique url - but here comes new problem. Now when I click on the each sidebar element - page starts to refresh . Here is my website http://www.varpa.eu . What have i done wrong ? How can I get it to load new content without refreshing the page and to have each sidebar element unique url ? Please mention that I am talking only about the sidebar , not the topbar. Please help me .
Sorry for my bad english , it aint my native language.
Thank you,
Richard.Thank you for your response Ben.
That code which you provided is the top bar code. The top bar buttons should refresh the page, because I haven't done a spry magic with them yet.
I was talking about the sidebar where Company , History etc. elements are standing. Sidebar code is:
<div id="sidebarbuttonwrapper" spry:region="about_us" >
<div spry:repeatchildren="about_us" spry:choose="choose" >
<div id="sidebarbutton"
onclick="location.href='about.html?row={ds_RowID}';"
spry:when="{ds_CurrentRowID} == {ds_RowID}" spry:setrow="about_us" spry:selected="sidebarbuttonselected" spry:select="sidebarbuttonselected" spry:hover="sidebarbuttonhover">{button_name}</div>
<div id="sidebarbutton"
onclick="location.href='about.html?row={ds_RowID}';" spry:default="spry:default" spry:setrow="about_us" spry:hover="sidebarbuttonhover" spry:select="sidebarbuttonselected">
{button_name}
</div>
</div>
</div>
As you can see here http://www.varpa.eu/test/about.html?row=0 when I click on the sidebar elements page doesn't refresh , but the each sidebar element doesn't have unique URL.
When I included the URL params as in that sample above, now in this case http://www.varpa.eu/about.html?row=0 each element have unique URL, but this URL change makes page to refresh.
Any suggestion how to achieve that each sidebar element would have unique URL, and clicking on it would not cause page to refresh ?
Richard. -
STATIC "HTML Data Set Photo Gallery" with CAPTIONS
Because of search engines and validation I would really like to use the STATIC "HTML Data Set Photo Gallery" http://labs.adobe.com/technologies/spry/demos/gallery_pe/static/china.html.
But I definitely need captions for the Photos. I found possibilities to add them via XML, but not for the HTML-Version.
As far as I got I think I have to edit this function from "gallery_hds.js" and add some RegEx, to extract caption text.
function PhotosFilter(ds, row, rowIndex)
var tnStr = row.thumbimg;
if (tnStr)
row.path = tnStr.replace(/.*<a[^>]*href="?([^"]*)"?.*/i, "$1");
row.thumbpath = tnStr.replace(/.*<img[^>]*src="?([^"]*)"?.*/i, "$1");
return row;
In the following rows within the html-document
<span class="thumbnail"><a href="../../gallery/galleries/paris/images/paris_02.jpg"><img src="../../gallery/galleries/paris/thumbnails/paris_02.jpg" alt="paris_02.jpg" /></a></span>
I would insert text before the closing span-tag (or before the closing a-tag?) - like so
<span class="thumbnail"><a href="../../gallery/galleries/paris/images/paris_02.jpg"><img src="../../gallery/galleries/paris/thumbnails/paris_02.jpg" alt="paris_02.jpg" /></a>Here is some HTML Text</span>
This text must be extracted via RegEx - similar to the rows within the if-Statement of the upper mentioned function "PhotosFilter". But here my RegEx-knowledge is definitely to short!
Thank you very much in advance for any help or suggestion.
Angela FenglerBecause of search engines and validation I would really like to use the STATIC "HTML Data Set Photo Gallery" http://labs.adobe.com/technologies/spry/demos/gallery_pe/static/china.html.
But I definitely need captions for the Photos. I found possibilities to add them via XML, but not for the HTML-Version.
As far as I got I think I have to edit this function from "gallery_hds.js" and add some RegEx, to extract caption text.
function PhotosFilter(ds, row, rowIndex)
var tnStr = row.thumbimg;
if (tnStr)
row.path = tnStr.replace(/.*<a[^>]*href="?([^"]*)"?.*/i, "$1");
row.thumbpath = tnStr.replace(/.*<img[^>]*src="?([^"]*)"?.*/i, "$1");
return row;
In the following rows within the html-document
<span class="thumbnail"><a href="../../gallery/galleries/paris/images/paris_02.jpg"><img src="../../gallery/galleries/paris/thumbnails/paris_02.jpg" alt="paris_02.jpg" /></a></span>
I would insert text before the closing span-tag (or before the closing a-tag?) - like so
<span class="thumbnail"><a href="../../gallery/galleries/paris/images/paris_02.jpg"><img src="../../gallery/galleries/paris/thumbnails/paris_02.jpg" alt="paris_02.jpg" /></a>Here is some HTML Text</span>
This text must be extracted via RegEx - similar to the rows within the if-Statement of the upper mentioned function "PhotosFilter". But here my RegEx-knowledge is definitely to short!
Thank you very much in advance for any help or suggestion.
Angela Fengler -
Spry Photo Gallery Html Data Set InLine Content
To whom that may know.
I, the confused have wasted several long hours trying to
understand how adobe did this.
http://labs.adobe.com/technologies/spry/demos/gallery_pe/static_hd/china.html
Ok, before that you think I am a total idiot. Please look at
the code. I have made this page several time using program like
photoshop, fireworks and dreamweaver....all using xml. This page
uses html data set that is on the page. Which after looking and
many example...all the example consist of a data table. I have
looked at the javascript for many files in the code. I even
downloaded their actual js files to see if they change something. I
am assuming that they are using css to place the data to read...I
just don't see where the "ds1" statement comes into play when you
look at this code. I thank you all in advance for your time and
expert opinions.
P.S. My sample page does show all the thumbnails and links
and after I downloaded their css it does show the background to be
black. But nothing else shows.To whom that may know.
I, the confused have wasted several long hours trying to
understand how adobe did this.
http://labs.adobe.com/technologies/spry/demos/gallery_pe/static_hd/china.html
Ok, before that you think I am a total idiot. Please look at
the code. I have made this page several time using program like
photoshop, fireworks and dreamweaver....all using xml. This page
uses html data set that is on the page. Which after looking and
many example...all the example consist of a data table. I have
looked at the javascript for many files in the code. I even
downloaded their actual js files to see if they change something. I
am assuming that they are using css to place the data to read...I
just don't see where the "ds1" statement comes into play when you
look at this code. I thank you all in advance for your time and
expert opinions.
P.S. My sample page does show all the thumbnails and links
and after I downloaded their css it does show the background to be
black. But nothing else shows. -
Help! HTML Data set not working in IE (but in all other browsers)
Hi there,
I am totally desperate - I built a master/detail region page using a HTML data set.
http://www.atcongress.com/programme/continuousLearningByName.html
It works fine in Firefox/Safari/Chrome/Opera.
Only IE7 and IE8 give me grief - displaying javascript errors; apparrently it is not able to bind the HTML data table to the data set:
The IE Javascript Error Console displays "
'Spry.Data.HTMLDataSet' ist Null oder kein Objekt
This is in German but you'll get the idea I presume?! Translation would be something like
'Spry.Data.HTMLDataSet' is Null or not an object"
Anyway, the source HTML data table uses spry as well. This works fine on all browsers. Maybe because the HTML is on the same page?
http://www.atcongress.com/programme/continuousLearningTable.html
Any ideas? Do you need more info?
Please help - the system needs to go out to test users any day now!
Andreas
This is the entire message from the IE8 javascript error console:
Meldung: 'Spry.Data.HTMLDataSet' ist Null oder kein Objekt Zeile: 30 Zeichen: 1 Code: 0 URI: http://www.atcongress.com/programme/continuousLearningByName.html Meldung: 'Spry.Debug' ist Null oder kein Objekt Zeile: 961 Zeichen: 41 Code: 0 URI: http://www.atcongress.com/_spryAssets/SpryData.js Meldung: 'Spry.Data.initRegionsOnLoad' ist Null oder kein Objekt Zeile: 4855 Zeichen: 65 Code: 0 URI: http://www.atcongress.com/_spryAssets/SpryData.jsMore info on my trial & error process - error still in this case...
I cleaned up the code in both the problematic file and the source file that they validate fine now wit the W3C validator:
http://validator.w3.org/check?uri=http://www.atcongress.com/programme/continuousLearningBy Name.html&charset=(detect+automatically)&doctype=Inline&ss=1&outline=1&group=0&No200=1&ver bose=1&st=1&user-agent=W3C_Validator/1.1
Data source file:
http://validator.w3.org/check?uri=http%3A%2F%2Fwww.atcongress.com%2Fprogramme%2Fcontinuous LearningTable.html&charset=%28detect+automatically%29&doctype=Inline&ss=1&outline=1&group= 0&No200=1&verbose=1&st=1&user-agent=W3C_Validator%2F1.1
I'd also like to mention again that the source html file also contains an HTML data set and spry code. No problems there.
In order to make sure that is not a problem of referencing external data I also tried copying and pasting the source data table into the problematic file so that it can be used as a local data source. Still the same.
Apparently the probem is the master/detail region part. The working HTML spry file uses a standard HTML table whereas my problematic one uses a master/detail region
ANY help would be greatly appreciated! -
Displaying an HTML Data Set on button click
I'm using the code from the
HTML
DATA Set Example
I have the code in a function and I want to have it display
in a div on the page when a user clicks a specific button.
I get this error message: "spry:region or spry:detailregion
attribute has no data set!"
This is my javascript:
function evalNames( )
var myArrayOfData = [
{ lastname: "Davis", firstname: "Kirk" },
{ lastname: "Miller", firstname: "James" },
{ lastname: "Wilson", firstname: "Alex" },
{ lastname: "Moore", firstname: "Albert" },
{ lastname: "Taylor", firstname: "Eric" },
{ lastname: "Anderson", firstname: "Vincent" },
{ lastname: "Thomas", firstname: "Anthony" },
{ lastname: "Lee", firstname: "John" },
{ lastname: "Smith", firstname: "Edward" },
{ lastname: "Johnson", firstname: "Neil" },
{ lastname: "Williams", firstname: "Steve" },
{ lastname: "Jones", firstname: "John" },
{ lastname: "Brown", firstname: "Joe" }
var hashTable = [];
for (var i = 0; i < myArrayOfData.length; i++)
myArrayOfData
.ds_RowID = i;
hashTable = myArrayOfData
var dsPeople = new Spry.Data.DataSet();
dsPeople.data = myArrayOfData;
dsPeople.dataHash = hashTable;
dsPeople.loadData();
var Output2 = "<input type="button" value="Sort By Last
Name" onclick="dsPeople.sort(['lastname', 'firstname'], 'toggle');"
/>";
Output2 +="<input type="button" value="Sort By First Name"
onclick="dsPeople.sort(['firstname', 'lastname'], 'toggle');"
/>";
Output2 +="<div spry:region="dsPeople">";
Output2 +="<table border="1">";
Output2
+="<tr><th>ds_RowID</th><th>Last
Name</th><th>First Name</th></tr>";
Output2 +="<tr
spry:repeat="dsPeople"><td>{ds_RowID}</td><td>{lastname}</td><td>{firstname}</td></tr>";
Output2 +="</table>";
Output2 +="</div>";
document.getElementById("nameResults").innerHTML = Output2;
I have a button on my page with the function evalNames() and
I have a div called "nameResults"
Is there an easier way to accomplish the same thing with the
Spry Framework? In theory should I be able to get this html data to
display in a div on the user's click of a button? Any suggestions
on making this work(it could just be a syntax error in the way my
var Output2 is written)?Hello,
Based on the code above I discovered a number of problems:
1. The dsPeople DataSet has sense inside the function only so
the regions will not be able to use it. Instead you should move the
dsPeople DataSet declaration outside the function in global scope.
2. The code you try to inject into the innerHTML is not
valid. Inside double quotes all the double quotes should be escaped
or single quotes should be used.
3. The regions are instantiated only a single time on page
load so if you need to inject a new region into the page you'll
have to reinitialize the regions or the new region will not be
considered.
Based on your code above I change it a little bit to solve
the issues:
<script type="text/javascript">
var dsPeople = new Spry.Data.DataSet();
function evalNames( )
var myArrayOfData = [
{ lastname: "Davis", firstname: "Kirk" },
{ lastname: "Miller", firstname: "James" },
{ lastname: "Wilson", firstname: "Alex" },
{ lastname: "Moore", firstname: "Albert" },
{ lastname: "Taylor", firstname: "Eric" },
{ lastname: "Anderson", firstname: "Vincent" },
{ lastname: "Thomas", firstname: "Anthony" },
{ lastname: "Lee", firstname: "John" },
{ lastname: "Smith", firstname: "Edward" },
{ lastname: "Johnson", firstname: "Neil" },
{ lastname: "Williams", firstname: "Steve" },
{ lastname: "Jones", firstname: "John" },
{ lastname: "Brown", firstname: "Joe" }
var hashTable = [];
for (var i = 0; i < myArrayOfData.length; i++)
myArrayOfData.ds_RowID = i;
hashTable = myArrayOfData;
dsPeople.data = myArrayOfData;
dsPeople.dataHash = hashTable;
dsPeople.loadData();
var Output2 = "<input type='button' value='Sort By Last
Name' onclick='dsPeople.sort([\'lastname\', \'firstname\'],
\'toggle\');' />";
Output2 +="<input type='button' value='Sort By First
Name' onclick='dsPeople.sort([\'firstname\', \'lastname\'],
\'toggle\');' />";
Output2 +="<div spry:region='dsPeople'>";
Output2 +="<table border='1'>";
Output2
+="<tr><th>ds_RowID</th><th>Last
Name</th><th>First Name</th></tr>";
Output2 +="<tr
spry:repeat='dsPeople'><td>{ds_RowID}</td><td>{lastname}</td><td>{firstname}</td></tr>";
Output2 +="</table>";
Output2 +="</div>";
var el = document.getElementById("nameResults");
el.innerHTML = Output2;
Spry.Data.initRegions();
</script>
</head>
<body>
<div id="nameResults" style="border: 1px solid
red"></div>
<a href="#" onclick="evalNames(); return false;">Eval
Names</a>
</body>
A more easy way to achieve your goal is that the region to
already exists in page having either the visibility hidden or the
display: none CSS attributes set and the button only to change the
CSS property to display the region. The solution in this situation
will work better from point of view of performance as the
initRegions manual call will initialize again all the regions in
page.
Regards,
Cristian MARIN -
Google index external HTML data sets?
I know one of the workarounds to have Google properly index
dynamic content is to use HTML data sets, but I'm unclear about one
thing. Does this only work if you have the HTML data set table on
the same page you use it with, or does it also work with external
HTML data sets?
For instance, will Google have a problem indexing if I use a
external HTML data set like:
<script type="text/javascript">
<!--
var educationLinks = new
Spry.Data.HTMLDataSet("links/educationLinks.htm",
"educationLinks");
//-->
</script>
<div spry:region="educationLinks" id="linksContainer"
class="SpryHiddenRegion">
<ul spry:repeatchildren="educationLinks"
class="unorderedLinkList">
<li><a href="{url}"
target="_blank">{name}</a> - {description}</li>
</ul>
<!-- end #linksContainer -->
</div>I'm doing the same exact thing using external HTML data sets
instead of XML. It is true that spiders will not index the external
page based on the Spry data you noted. My solution will be to
create a sitemap.xml page and submit it to the search engines. That
sitemap.xml file will contain all the pages in your site and the
spiders will use it as a central point to crawl all of those pages
specified within. So, I will just include my externally referenced
files in the sitemap.xml file.
Checkout
http://www.sitemap.org for more
information on that. -
In the Applications/Bindings tab I see where I can bind an
xml file to my html page - how do I do the same with an HTML data
set. I have the set working, but have to manually code the
variables into the site. I would love to use the Bindings tab.
Thanks - DonHere are a couple of links for HTML data sets:
http://www.adobe.com/devnet/dreamweaver/articles/spry_creating_html_data_set.html
http://www.adobe.com/designcenter/dreamweaver/articles/lrvid4047_dw.html
Another technique you might want to look into is Spry Tabbed Panels:
(this first reference is a little technical, but a pretty good overview) http://livedocs.adobe.com/en_US/Spry/SDG/help.html?content=WS6FED301A-59A1-45ce-BC1F-11074 3A27FE9.html
http://help.adobe.com/en_US/Dreamweaver/10.0_Using/WSC21A9606-FECA-431c-A617-AE65C4BDB8C5. html
A nice reference for Spry in general is here: http://labs.adobe.com/technologies/spry/samples/
Have fun...
Beth -
HTML Data Set not created?
I have created a very basic page to test (and learn) about dynamic spry regions, but the data set constructor does not seem to be instantiating the data set. At this point I'm keeping it very simple just to see how things work.
Per the Spry Framework documentation, I moved the framework include files into my site and I created a table in a separate .html file containing only the table, fotm_db_frag.html, as a fragment. The table is simple; opening it in DW CS3 shows it's well formed with a header row and data rows. It's id tag is set to "dsFotm"
Here's the entire page file so far:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:spry="http://ns.adobe.com/spry/">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<!--Link the Spry libraries-->
<script type="text/javascript" src="includes/SpryData.js"></script>
<script type="text/javascript" src="includes/SpryHTMLDataSet.js"></script>
<!--Create a data set object-->
<script type="text/javascript">
var dsFotmdb = new Spry.Data.HTMLDataSet("fotm_db_frag.html", "dsFotm");</script>
dsFotmdb.setColumnType("Date", "date")
</head>
<body>
<div id="container">Content for id "container" Goes Here</div>
</body>
</html>
At this point, I select the content of the container div and attempt to use visual aids to insert a spry region, but the dialog that pops up says that no data sets have been defined. I tried saving the file, I looked at Testing server options (left this set at None), I looked in the help to see if there was anything I needed to do in order for the script to run ... but I couldn't find anything that would make the new constructor instantiate data set dsFotmdb.
Help please !!!
BTW: before starting all this, I downloaded Spry 1.6.1 Framework and updated my copy of DW CS3 with the spry updater (that all seemed to work).Try making a simple XML file and Dataset to see if that works
Call this Test.xml
<?xml version="1.0" encoding="ISO-8859-1" ?>
- <!-- Just a Text -->
- <CATALOG>
- <CD>
<TITLE>Empire Burlesque</TITLE>
<ARTIST>Bob Dylan</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>Columbia</COMPANY>
<PRICE>10.90</PRICE>
<YEAR>1985</YEAR>
</CD>
- <CD>
<TITLE>Hide your heart</TITLE>
<ARTIST>Bonnie Tyler</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>CBS Records</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1988</YEAR>
</CD>
- <CD>
<TITLE>Greatest Hits</TITLE>
<ARTIST>Dolly Parton</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>RCA</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1982</YEAR>
</CD>
- <CD>
<TITLE>Still got the blues</TITLE>
<ARTIST>Gary Moore</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Virgin records</COMPANY>
<PRICE>10.20</PRICE>
<YEAR>1990</YEAR>
</CD>
- <CD>
<TITLE>Eros</TITLE>
<ARTIST>Eros Ramazzotti</ARTIST>
<COUNTRY>EU</COUNTRY>
<COMPANY>BMG</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1997</YEAR>
</CD>
- <CD>
<TITLE>One night only</TITLE>
<ARTIST>Bee Gees</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Polydor</COMPANY>
<PRICE>10.90</PRICE>
<YEAR>1998</YEAR>
</CD>
- <CD>
<TITLE>Sylvias Mother</TITLE>
<ARTIST>Dr.Hook</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>CBS</COMPANY>
<PRICE>8.10</PRICE>
<YEAR>1973</YEAR>
</CD>
- <CD>
<TITLE>Maggie May</TITLE>
<ARTIST>Rod Stewart</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Pickwick</COMPANY>
<PRICE>8.50</PRICE>
<YEAR>1990</YEAR>
</CD>
- <CD>
<TITLE>Romanza</TITLE>
<ARTIST>Andrea Bocelli</ARTIST>
<COUNTRY>EU</COUNTRY>
<COMPANY>Polydor</COMPANY>
<PRICE>10.80</PRICE>
<YEAR>1996</YEAR>
</CD>
- <CD>
<TITLE>When a man loves a woman</TITLE>
<ARTIST>Percy Sledge</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>Atlantic</COMPANY>
<PRICE>8.70</PRICE>
<YEAR>1987</YEAR>
</CD>
- <CD>
<TITLE>Black angel</TITLE>
<ARTIST>Savage Rose</ARTIST>
<COUNTRY>EU</COUNTRY>
<COMPANY>Mega</COMPANY>
<PRICE>10.90</PRICE>
<YEAR>1995</YEAR>
</CD>
- <CD>
<TITLE>1999 Grammy Nominees</TITLE>
<ARTIST>Many</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>Grammy</COMPANY>
<PRICE>10.20</PRICE>
<YEAR>1999</YEAR>
</CD>
- <CD>
<TITLE>For the good times</TITLE>
<ARTIST>Kenny Rogers</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Mucik Master</COMPANY>
<PRICE>8.70</PRICE>
<YEAR>1995</YEAR>
</CD>
- <CD>
<TITLE>Big Willie style</TITLE>
<ARTIST>Will Smith</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>Columbia</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1997</YEAR>
</CD>
- <CD>
<TITLE>Tupelo Honey</TITLE>
<ARTIST>Van Morrison</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Polydor</COMPANY>
<PRICE>8.20</PRICE>
<YEAR>1971</YEAR>
</CD>
- <CD>
<TITLE>Soulsville</TITLE>
<ARTIST>Jorn Hoel</ARTIST>
<COUNTRY>Norway</COUNTRY>
<COMPANY>WEA</COMPANY>
<PRICE>7.90</PRICE>
<YEAR>1996</YEAR>
</CD>
- <CD>
<TITLE>The very best of</TITLE>
<ARTIST>Cat Stevens</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Island</COMPANY>
<PRICE>8.90</PRICE>
<YEAR>1990</YEAR>
</CD>
- <CD>
<TITLE>Stop</TITLE>
<ARTIST>Sam Brown</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>A and M</COMPANY>
<PRICE>8.90</PRICE>
<YEAR>1988</YEAR>
</CD>
- <CD>
<TITLE>Bridge of Spies</TITLE>
<ARTIST>T'Pau</ARTIST>
< -
Limiting the number of returned rows in an HTML data set
I have a data set that is displayed and sorted by a hidden 'hits' field that is updated based on popularity. My table has about 40 entries, but I want only the first 10 results to show.
How would I go about doing this?
<script src="SpryAssets/SpryData.js" type="text/javascript"></script>
<script type="text/javascript">
Spry.Utils.setInnerHTML = function(ele, str, preventScripts){Spry.$(ele).innerHTML = str;};
</script>
<script src="SpryAssets/SpryHTMLDataSet.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMasterDetail.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
<!--
var PrankDialerLibrary = new Spry.Data.HTMLDataSet("SpryAssets/library.html", "pdLibrary", {sortOnLoad: "hits", sortOrderOnLoad: "descending"});
PrankDialerLibrary.setColumnType("preview", "html");
PrankDialerLibrary.setColumnType("info", "html");
PrankDialerLibrary.setColumnType("filename", "html");
//-->
</script> --- <div class="MasterDetail">
<div spry:region="PrankDialerLibrary" class="MasterContainer">
<div class="MasterColumn" spry:repeat="PrankDialerLibrary" spry:setrow="PrankDialerLibrary" spry:hover="MasterColumnHover" spry:select="MasterColumnSelected" align="left">{preview} {name}</div>
</div>
<div spry:detailregion="PrankDialerLibrary" class="DetailContainer">
<div class="DetailColumn">{info}</div>
<div class="DetailColumn">{filename}</div>
</div>
<br style="clear:both" /> </div></div>
Thanks!Ansered my own question. Simply adding
spry:test="{ds_RowNumber} < 10"
to the MasterColumn div did the trick! -
Anybody know of a tutorial on how to develop this?
http://labs.adobe.com/technologies/spry/demos/gallery_pe/static_hd/china.html
ThanksHi Arnout,
I really hope you can help with this one. This gallery works fine in a stand alone html doc. But as soon as that document is saved as a template the js doesnt work. I had big plans for the home page with one div holding this two div gallery. I then applied spry effects to the loading images and it looked awesome during the design phase and preview. Now that I save as a template it doesnt work. Since my main concern was to have it on the home page and not all pages I decided to create the main template and insert the gallery into an editable region. This also doesnt work.
The code below is from the tuorial. All i did was save as a template and it no longer works. The files are all available at the link you provided.
Is this fixable or can you recommend another option please. Thanks heaps.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved.-->
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:spry="http://ns.adobe.com/spry">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- TemplateBeginEditable name="doctitle" -->
<title>Ajax Album Demo</title>
<!-- TemplateEndEditable -->
<script type="text/javascript" src="../includes/xpath.js"></script>
<script type="text/javascript" src="../includes/SpryData.js"></script>
<script type="text/javascript">
var dsGallery = new Spry.Data.XMLDataSet("../photos.xml", "/gallery/photos/photo");
var dsData = new Spry.Data.XMLDataSet("../photos.xml", "/gallery");
</script>
<style type="text/css">
<!--
img.thumbs {
float:left;
height:60px;
width:60px;
margin-right: 2px;
margin-bottom: 2px;
border: solid black 1px;
#main {
position:absolute;
left:476px;
top:128px;
width:491px;
height:315px;
z-index:2;
#thumbContainer {
left:23px;
top:127px;
width:437px;
height:430px;
z-index:1;
position:absolute;
#header {
position:absolute;
left:313px;
top:14px;
width:295px;
height:95px;
z-index:3;
-->
</style>
<!-- TemplateBeginEditable name="head" -->
<!-- TemplateEndEditable -->
</head>
<body>
<div id="header" spry:region="dsData">
<p>Site Name: {sitename}<br />
Photographer: {photographer}<br />
Website: <a href="{contactinfo}">{contactinfo}</a><br />
Email: <a href="mailto:{email}">{email}</a><br />
Date: {@date} </p>
</div>
<div id="thumbContainer" spry:region="dsGallery dsData"> <img src="{dsData::thumbnail/@base}{@thumbpath}" spry:repeat="dsGallery" class="thumbs" onclick="dsGallery.setCurrentRow('{ds_RowID}');" /> </div>
<div id="main" spry:detailregion="dsGallery dsData"><img src="{dsData::large/@base}{@path}"/><br />
Name: {@path}
</div>
</body>
</html> -
Javascript not parsing through in an HTML data set (table)
I have a spry dataset (html table) working perfectly on my site. I have an 'info' column with some HTML, an image, and youtube embed. All of these parse correctly and show on the page, but for some reason my google adsense (javascript code) is not parsing through at all. I'm using Spry 1.6.1.
Here is my code:
<script type="text/javascript">
<!--
var PrankDialerLibrary = new Spry.Data.HTMLDataSet("SpryAssets/library.html", "pdLibrary", {sortOnLoad: "hits", sortOrderOnLoad: "descending"});
pdLibrary.setColumnType("preview", "html");
pdLibrary.setColumnType("info", "html");
pdLibrary.setColumnType("filename", "html");
//-->
</script> ... <div class="MasterDetail">
<div spry:region="PrankDialerLibrary" class="MasterContainer">
<div class="MasterColumn" spry:repeat="pdLibrary" spry:setrow="pdLibrary" spry:hover="MasterColumnHover" spry:select="MasterColumnSelected" align="left">{preview} {name}</div>
</div>
<div spry:detailregion="pdLibrary" class="DetailContainer">
<div class="DetailColumn">{info}</div>
<div class="DetailColumn">{filename}</div>
</div>
<br style="clear:both" />
</div>
Thanks!Treytor72 wrote:
Thanks again for your expertise, as I can see you've helped quite a bit around here!
I've tried adding that quick and dirty workaround to the page ( http://www.prankdialer.com/beta/popular.php ), but it seems to have no affect. I may not be fully understanding it, but I don't believe your other options will work in this particular situation because the google adsense code (what is being omitted in my case)
is placed exactly where the ad should appear. I want it to show up right underneath the youtube embed for each item in the data table. Thus, it doesn't belong in the <head> of the page.
Thank you again for your time, and let me know if by any chance you would have any use for my site, PrankDialer.com. I'd be more than happy to give you credits for your help!
Hello,
If I inspect the generated DOM of the page, I do see that the script have been correctly injected in to your page. So we have succeeded so far. You have placed it at a correct position. We could still try the modified setInnerHTML function. I searched the forum and found a improved version of it. (Less work for me )
Spry.Utils.setInnerHTML = function(ele, str, preventScripts)
if (!ele)
return;
ele = Spry.$(ele);
var scriptExpr = "<script[^>]*>(.|\s|\n|\r)*?</script>";
ele.innerHTML = str.replace(new RegExp(scriptExpr, "img"), "");
if (preventScripts)
return;
//bodyMatches is used to store the script tags that have body. For example, <script type='text/javascript'> some JS </script>
var bodyMatches = str.match(new RegExp(scriptExpr, "img"));
if (bodyMatches)
var numMatches = bodyMatches.length;
for (var i = 0; i < numMatches; i++)
var s = bodyMatches[ i ].replace(/<script[^>]*>[\s\r\n]*(<\!--)?|(-->)?[\s\r\n]*<\/script>/img, "");
//make sure that we are not create a script tag if there is no body to it.
if(s.length > 0)
//alert(s);
var scriptEle= document.createElement("script");
scriptEle.text = s;
ele.appendChild(scriptEle);
//now we begin taking care of the script includes (those that have a src attribute defined)
var srcScript = "<script[^>].*src.*>(.|\s|\n|\r)*?</script>";
var srcMatches = str.match(new RegExp(srcScript, "img"));
if(srcMatches)
var numMatches2 = srcMatches.length;
var srcAttrib = "[\s]*src=[\'\"](.*\.js)[\'\"]";
for(var j=0; j<numMatches2; j++)
// when the below statement executes, m should have the src attrib and value:
// src='sompath.js' as a string.
var m = srcMatches[j].match(new RegExp(srcAttrib, "img")).toString();
//now we strip out the src= part. this will leave us with just the path along with the double quotes.
var n = m.replace(/^[(?=src=)]*/img, "");
if(n.length > 0)
var scriptEle2 = document.createElement("script");
//get rid of the quotes as well.
//This is done to take care of single quotes too so that it will work if they defined either:
// <script src='somefile.js' type="text/javascript></script>
// <script src="somefile.js" type="text/javascript></script>
scriptEle2.src=n.replace(/[\"\']/img, "");
scriptEle2.type="text/javascript";
ele.appendChild(scriptEle2);
But!
There's always a but, even if it would work. You might face a even bigger issue. The Google script uses document.write. This method should only be used once the main page is still loading. If you execute this function while the page is done with loading. It will replace the whole content of your page with what is beeing writen.
For example if it does:
document.write('Hello');
Your whole place would be replaced and only showing the word "Hello".
A solution to this would be to use a iframe to display the ads. -
Spry HTML Data Set Gives Empty Table (no data), Spry XML Data Set is Fine
I am working in Dreamweaver CS5 and in lesson 14 of the "Dreamweaver CS5 Classroom in a Book" and the lesson implements Spry HTML Datasets and XML Datasets. The XML is fine but the HTML dataset produces an empty table. This happens in live view or even when previewing the HTML file in any of the browsers Firefox, Google or IE. I should add that the lesson (as in all the lessons) has a "finished copy file" prepared by the authors to show what things will look like in the end (so it is a file NOT produced by me but included on the CD with the book), and that file also produces the problem. I have uninstalled and reinstalled Dreamweaver, the lessons CD and spent all day trying to figure out why and no clues at all yet. All my browser settings look fine as for allowing content.
ANY CLUES would be appreciated. Thanks.Hello,
First, thank you very much for your quick response and help.
I am not sure what you mean by upload the site to a server so you can look. I am working locally in Dreamweaver on the book's exercise. So I figured you may mean CS Live. What a clumsy operation that is. In any case, they said the links below will work for ANYBODY that clicks them! What is especially baffling here is that it seems so straighforward. The file "events_finished.html" (the 1st link below) is everything but the data, produced by the author of "Adobe Dreamweaver CS5 Classroom In A Book" in lesson 14. All paths should be correct. The file referenced by "Spry.Data.HTMLDataSet", "html-data_finished.html" (the data and the 2nd link below) is in the same directory as the first file, all JavaScript files referenced exist and are in their denoted "SpryAssets" folder. As seen in the "screenShot", the HTML dataset table is empty with placeholders; the XMLDataSet is fine and all data nicely represented.
I hope this helps and thanks for all help and any clues you can provide.
events_finished.html: https://acrobat.com/#d=J2Aez*f-uXeEICwt2ctjDg
html-data_finished.html: https://acrobat.com/#d=NugqeOzL6sBtjZw81PNNAg
screenShot of viewed page in browser: https://acrobat.com/#d=nS5FBcWC-AvXXEGHiWAo6A -
Change an existing spry html data set
Is it possible to go back into the wizard to change a dataset once its been made? Or do i need to delete all references to the dataset and make it again?
Happily, you do not have to redo your dataset, once you have made it, when you want to change it in some way.
Go to the page containing your SpryDataset markup (presentation of your data, not the page with the datatable, if it is on a separate page), and open the Bindings Panel. You should see your datasets listed there.
Double-click on the name of the dataset you want to change, and the wizard will re-open. Make your changes and click Done.
Your dataset presentation will immediately reflect your changes.
Beth
Maybe you are looking for
-
How to remove credit card !!?
i have a problem with the debit card i put on my apple ID i just put it to buy an app, now i want to remove it but apple dont let me. and i cant to buy even a free apps HELP!!!!
-
Cannot view placed art in a PDF in an email
When I get a PDF as an attachment--be it in Entourage 2004 or Mail--I can't view what I assume to be placed art in a PDF. It doesn't show up in either program's preview pane, or if I download it to the hard drive and try to view it in Preview or Adob
-
How do i Arrange windows side by side on the desktop to compare 2 documents side by side?
''''''how do i Arrange windows side by side on the desktop to compare / read 2 documents side by side?''''''
-
Issues with migrating lookups from 9.0.3 to 9.2
Below is a text from a TAR we've submitted with Oracle. Has anyone else run into this issue when upgrading from 9.0.3 to 9.2? Lookups conditions not being properly migrated is a known issue when upgrading from OWB 9.0.3 to 9.2, documented in Bug 3989
-
Wrong value is passing from one form to a other form's parameter
I am passing value from one form to another form using following code DECLARE pl_id ParamList; pl_name VARCHAR2(10) := 'task_id'; BEGIN pl_id := Get_Parameter_List(pl_name); --destroy_parameter_list(pl_id); IF Id_Null(pl_id) THEN null; ELSE