Spry Rating in an HTML Panel

I have a working rating widget but when I use it in an HTML panel (part of the HTML file) it does not show up. I tried including all of the rating widget functions in both files but to avail. DO I need to use an observer since the rating widget is in another HTML being populated by the HTML panles widget?
Thanx!

Jus to clarify for me:
I should include the <script src="path/to/rating.js"></script> in my main file. The page that displays all of my galleries.(for me it is galleries.html)
I will change it all around and see what happens
EDIT*****************************************************
It still looks as it did before, not sure what I did. heres the link again wioth all updated info
http://directory-sexy.com/categories/gallery/galleries.html
I may just consider using jquery for the rating as I am under a bit of a time crunch - I have school starting in two weeks and really need to get this up and running soon. I will also be adding comments to each image but that may require a bit more research.
Thanx again.

Similar Messages

Images not loading in Spry HTML Panel

Hallo everyone
I am using links to load html fragments in a Spry HTML Panel, just like in the example page
http://labs.adobe.com/technologies/spry/widgets/htmlpanel/SpryHTMLPanel.html
The whole structure is inside a Spry Tabbed Panel.
All works ok if the target html pages are in the same directory as the mother page.
Images are standard in the "images" folder
The problem starts when I try to organise all the html fragments in a separate directory.
Updating links in all the html files is of course done correctly, images included.
Then the problem starts.
The html fragments load but with no images.
When I open the html fragments directly by the browser all is ok.
Any ideas would be appreciated
Thanks!

Can you upload your pages to a server and give us a link?
If your images are in your site folder (no matter which directory), but they are not showing up in your fragments, it is likely that the paths are wrong. The images (it seems to me) should exist on the fragment and be linked from there.
I won't have a chance to fiddle around with this right now, but if your images are linked to the fragment locations and that does NOT work, try linking them as if they were on the page that is showing the fragments. I'm not familiar (yet) with this widget.
Beth

Spry Data in HTML Panel

I'd like to load a page w/ dynamic data content through an
HTML Panel. Can it be done?

Hi,
There is some problem in Spry where in if the loaded content
has any spry:regions or dataset objects, those are not executed as
expected. You need to replace the Spry.Utils.setInnerHTML function
with the following code
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;
var matches = str.match(new RegExp(scriptExpr, "img"));
if (matches)
var numMatches = matches.length;
for (var i = 0; i < numMatches; i++)
var s = matches
.replace(/<script[^>]*>[\s\r\n]*(<\!--)?|(-->)?[\s\r\n]*<\/script>/img,
var oScript = document.createElement("script");
oScript.text = s;
ele.appendChild(oScript);
Spry.Data.initRegions(Spry.$(ele));
It should work fine.
-JV

Spry HTML Panel Widget breaks ICE

I'm using the spry html panel widget to load a side bar
across my site. It has Ice tags as do the main pages its loaded
into. When editing a main page, it will not save saying. "the html
sent to save was not in the page". (referring to my spry sidebar).
Taking ICE out of the side bar page allows it to work.
Is there a work around to use this adobe spry widget with in
context editing? It would be a shame is the sidebar can't be
edited, or has to be done for every page it loads into not using
the spry widget.

Hello Addis,
I'm not entirely clear on your workflow, but InContext
Editing does not support editable or repeating region groups inside
Spry Dynamic Regions.
You can create editable regions on the html page that loads
into the spry html panel widget, but you cannot have editable
regions on the
dynamic widget region itself.
Essentially, you can apply InContext Editing editable regions
to the content in the external HTML page (e.g.,
panelWidget.loadContent('
widget_contents.html'). Then, when you want to edit the
content that loads into the widget on the main pages, you would
edit the
widget_contents.html page with InContext Editing. You can
also apply InContext Editing editable regions to any
static content regions on your main pages.
Please let me know if this needs clarification.
Best regards,
Corey

No Script are working in SPRY HTML panel

I'm getting trouble with this website :
http://dubezy-faure.com.linkfirst-preprod.linkeo.org/
I've have 2 HTML fragments with lightbox and a spry contact
form in them but no one is working. When I bypassed the HTML panel,
my scripts work fine.
I've use the evalScripts:true but still nothing.
Below is the code :
<div id="menuhaut">
<ul>
<li><a href="index1.htm"
onclick="hpanel.loadContent(this.href); return
false;">Accueil</a></li>
<li><a href="real1.htm"
onclick="hpanel.loadContent(this.href); return
false;">Réalisations</a></li>
<li><a href="contact1.htm"
onclick="hpanel.loadContent(this.href); return
false;">Contact</a></li>
</ul>
</div>
<script language="JavaScript" type="text/javascript">
var hpanel = new
Spry.Widget.HTMLPanel("main",{evalScripts:true});
</script>
I've added the scripts in the HTML fragments as followed :
FOR LIGHTBOX
<link href="css/lx.css" rel="stylesheet" type="text/css"
/>
<script type="text/JavaScript"
src="script/lx.js"></script>
FOR the SPRY VALIDATION SCRIPT
<link href="css/validate.css" rel="stylesheet"
type="text/css" />
<script type="text/JavaScript"
src="script/validate.js"></script>
Could someone help me...

Thanks Diana !
My contact form is now working fine, but what about the
lightbox for the page Realisation? It has a lightbox effect on
clicking an image inside the HTML fragment. This lightbox do not
work. No error message is reported in firebug. I find this odd.
The lightbox effect works fine for the button plan, because
it's found outside the HTML fragment. Anything in the HTML panel
fails.
Thanks in advance for the support

Spry HTML Panel and Google Indexing

I've started working with Google analytics and am now realizing that my use of the Spry HTML Panel as cool and efficient as it is, is not being index by Google. I am using the links with php pages that query a FileMaker database for it's content and need to have Google be able to open and index the pages. What changes can I make to the standard HTML Panel Code to allow this to happen. I'm getting ready to take on a large project and this will be very necessary.
Thanks in Advance
Joe

Ajax requests / all javascript are not seen by spiders / bots. Its a
common issue with Ajax applications.
There a few ways to get them indexed. Point to it with a general site
map. So it get indexed through a other way.
Place links on the page that does the ajax calls to the urls. And
replace the urls with your HTML panel content.
So Spiders will follow the normal links and users will get the content.
Other way it to completely ditch html panel and just show it on the
page it self :P
Arnout Kazemier | Adobe Spry Community Expert
Internet: http://www.3rd-eden.com
Twitter: http://www.twitter.com/3rdEden | http://www.twitter.com/AdobeSpry

Controlling a Spry HTML panel with a Jump Menu

Hi, I wonder if anyone can help.
I've implemented a HTML panel within a page to display different page elements and have it working no problem with a simple href and an onClick event but I would like to control what is displayed by using a jump menu (drop down list) - any idea how I can control that to populate the necessary DIV?
eg: <select name="site" size=1 onChange="hpanel.loadContent(this.href); return false;"> (obviously this doesn't work!)
Thanks in advance
Neil

It works fine, but your pages arent found;
http://www.thedesignforge.co.uk/clients/elsevier/laure/v2/dollar_rates.html
See its missing.
But
http://www.thedesignforge.co.uk/clients/elsevier/laure/v2/dollar_rate.html
Exists. So it seems to me you are linking to a incorrect file.

Help with Spry Rating Widget within a Spry Repeating Region

My link http://www.youthinkyougotitbad.com
This is a long question, but it seems to me if answered somewhere it could help alot of people in the spry community creating comment boards as it uses three important spry widgets: rating, repeating, and tabbed panels. I am trying to use spry rating widget within a spry repeating region within a spry tabbed panel with xml. I was trying to go with the pulse light script (http://forums.adobe.com/message/3831721#3831721) but Gramps told me about the spry rating widget. But I have ran into a couple more problems. First, I couldnt find that much information on the forums or online about how to do the php page with the spry rating widget. None of these have any information on how to do it:
http://labs.adobe.com/technologies/spry/articles/rating_overview/index .html
http://labs.adobe.com/technologies/spry/articles/data_api/apis/rating. html
http://labs.adobe.com/technologies/spry/samples/rating/RatingSample.ht ml
And it seems that the official examples are so poor (or I am just ignorant, which def could be a possiblity) it shows
to set the initial rating value from the server, but uses a static value of 4
http://labs.adobe.com/technologies/spry/samples/rating/RatingSample.html
<span id="initialValue_dynamic" class="ratingContainer">
         <span class="ratingButton"></span>
         <span class="ratingButton"></span>
         <span class="ratingButton"></span>
         <span class="ratingButton"></span>
         <span class="ratingButton"></span>
         <input id="spryrating1_val" type="text" name="spryrating1" value="4" readonly="readonly" />
         <span class="ratingRatedMsg sample">Thanks for your rating!</span>
</span>
<script>
var initialValue_dynamic = new Spry.Widget.Rating("initialValue_dynamic", {ratingValueElement:'spryrating1_val'});
</script>
I finally found a site that has the php and mysql setup.
http://www.pixelplant.ro/en/articles/article-detail/article/adobe-widgets-for-download.htm l
But its not perfect. It has the same problem that I ran into with Pulse light, that you had to use php echo within the spry repeating region to set the initial value from the server:
<span id="spryrating1" class="ratingContainer">
         <span class="ratingButton"></span>
            <input type="text" id="ratingValue" name="dynamic_rate" value="<?php echo $row['average']?>"/>
        </span>
        <script type="text/javascript"
            var rating1 = new Spry.Widget.Rating("spryrating1", {ratingValueElement:'ratingValue', afterRating:'serverValue', saveUrl: 'save.php?id=spryrating1&val=@@ratingValue@@'});
        </script>
So instead, I tried with three of my panels (www.youthinkyougotitbad.com) to get the average rating from xml by using the following queries:
Recent
Returns the blurts in most recent order along with average rating
SELECT Blurt.Id_blurt, Blurt.Name, Blurt.Location, Blurt.Blurt,Blurt.`Date`,DATE_FORMAT(Blurt.`Date`, '%l:%i %p on %M %D, %Y') as Date, ratings.rating_id, Avg(ratings.rating_value) as average_r FROM ratings Left Join Blurt On ratings.rating_id = Blurt.Id_blurt Group By Id_blurt ORDER BY Blurt.`Date` DESC
Wet Eyed
Returns the blurts in highest ratings order along with the average rating
SELECT Blurt.Id_blurt, Blurt.Name, Blurt.Location, Blurt.Blurt, DATE_FORMAT(Blurt.`Date`, '%l:%i %p on %M %D, %Y') as Date, ratings.rating_id, Avg(ratings.rating_value) as average_r FROM ratings Left Join Blurt On ratings.rating_id = Blurt.Id_blurt AND ratings.rating_value > 0.1 Group By Id_blurt ORDER BY average_r Desc
Dry Eyed
Returns the blurts in lowest rating order along with the average rating
SELECT Blurt.Id_blurt, Blurt.Name, Blurt.Location, Blurt.Blurt, DATE_FORMAT(Blurt.`Date`, '%l:%i %p on %M %D, %Y') as Date, ratings.rating_id, Avg(ratings.rating_value) as average_r FROM ratings Left Join Blurt On ratings.rating_id = Blurt.Id_blurt AND ratings.rating_value > 0.1 Group By Id_blurt ORDER BY average_r
These all return the correct xml in the correct order.And they return the average rating of each blurt which I can send to my page with xml.
My first question is that I dont know how to configure the query on my fourth panel Empathized & Advised the same way because it already has a Group By for the Comment Id.
SELECT `Comment`.id_Blurt, COUNT(*) as frequency, Blurt.Id_blurt, Blurt.Name, Blurt.Location, Blurt.Blurt, DATE_FORMAT(Blurt.`Date`, '%l:%i %p on %M %D, %Y') as Date FROM Blurt, `Comment` WHERE Blurt.Id_blurt = `Comment`.id_Blurt GROUP BY `Comment`.id_Blurt ORDER BY COUNT(*) DESC";
Not sure if you guys need more information to understand that all, if so just ask.
So after I get my average value through xml to the first three panels, I set my spry repeating region up like this:
(Blurt panel)
<div spry:region="pv1" spry:repeatchildren="pv1">
           <div class="blurtbox">
            
            <h3> "{pv1::Blurt}"</h3>
            <p> Blurted from {pv1::Location} at {pv1::Date}</p>
            <p>Empathize or Advise about {pv1::Name}'s Blurt #<a href="detailblurt.php?blurtid={pv1::Id_blurt}"> {pv1::Id_blurt}</a></a></p>
           <span id="{pv1::Id_blurt}" class="ratingContainer">
            <span class="ratingButton"></span>
            <span class="ratingButton"></span>
            <span class="ratingButton"></span>
            <span class="ratingButton"></span>
            <span class="ratingButton"></span>
            <span class="ratingRatedMsg">Thank You! Your tears have been tallied.</span>
            <input type="text" id="ratingValue" name="dynamic_rate" value="{pv1::average_r}"/>
        </span>
        <script type="text/javascript">
            // overview of available options and their values:
            // http://labs.adobe.com/technologies/spry/articles/rating_overview/index.html
            var rating1 = new Spry.Widget.Rating("{pv1::Id_blurt}", {ratingValueElement:'ratingValue', afterRating:'serverValue', saveUrl: 'save.php?id={pv1::Id_blurt}&val=@@ratingValue@@'});
        </script>
             <br/>
           </div>
          </div>
Ok, it registers the right vote in the database with the right blurt id each time. But I am having two problems so far:
One, even though {pv1::average_r} returns the correct average through xml, it doesn't show the initial rating value for each of the repeating blurts. It seems to show the first one correct, and then just repeat that same value to the other ones that follow. I just dont understand since it can get the correct server value right after you vote (afterRating:'serverValue), that I can't manipulate spryrating.js in some way that I could just replace 'ratingValue' in ratingValueElement:'ratingValue' with something to give me the initial server value.
Two: Is even more mysterious to me, if you play around with voting on the site, sometimes you are unable to vote on different blurts. Its weird. It seems like that the javascript is completely off just on those blurts. And sometimes its a whole row, sometimes none. But so far its never a problem on the first tabbed panel (Recent), only on the other three. As far as I know, the coding is exactly the same in each tab's repeating region except for the different xml input.
And, now on the live server, sometimes the pics of tears used to voting dont show up until you click.
Any help on those three questions (how to query the fourth panel, how to show the initial server value, and the glitches with voting) would be greatly appreciated!! I looked pretty hard on adobe forums and other sites, and didnt see much on how to really use the spry rating widget with php and xml.
Thanks!!

Update:
Ok, the first query on the Recent tab doesnt work for me because it wont show unless its already voted, and since these are supposed to be new blurts, that kind of breaks the whole site:
"SELECT Blurt.Id_blurt, Blurt.Name, Blurt.Location, Blurt.Blurt,Blurt.`Date`,DATE_FORMAT(Blurt.`Date`, '%l:%i %p on %M %D, %Y') as Date, ratings.rating_id, Avg(ratings.rating_value) as average_r FROM ratings Left Join Blurt On ratings.rating_id = Blurt.Id_blurt Group By Id_blurt ORDER BY Blurt.`Date` DESC";
So I replaced it with what I originally had.
"SELECT Blurt.Id_blurt, Blurt.Name, Blurt.Location, Blurt.Blurt,Blurt.`Date`,DATE_FORMAT(Blurt.`Date`, '%l:%i %p on %M %D, %Y') as Date FROM Blurt ORDER BY Blurt.`Date` DESC";
But this doesn't provide me with the initial average rating:(

Some assistance with Spry Rating Widget

Hello, everyone.
I have downloaded the Spry library from the repository, and am playing with it, trying to learn it. So far, so good.
I have written a page that is using both the Spry Accordion Panel (I have 8, so far) and the Spry Rating Widget (one in each panel.)
I am displaying (below the stars) a tally of ratings for each panel (I'm keeping track in an XML file.) The 1-5 Star title, the number of times each is clicked, and a green bar (img) indicating percentage.
When a star is clicked, the XML is updated, but you have to refresh the page to see the new values. How can I dynamically, and in real time, update the value display when a star is clicked? (Once I have that, I can figure out how to dynamically change the img size/percentage.)
Thank you,
^_^

WolfShade wrote:
And I'm just starting to learn it, just because. It's something different. I'll probably never use any of it in any paid projects, but it's still nice to get a feel for it.
I have never used the rating widget, but I do have the Spry example files from when they were originally released. I assume that you have managed to download the same files from GitHub.
Open widgets.html in the widgets folder. Scroll down to the bottom, and click the Ratings > Overview link. Close to the bottom is a section titled "Update the Ratings Value Dynamically". The example code looks like this:
<body>
<span id="spryrating1" class="ratingContainer">
<span class="ratingButton"></span>
<span class="ratingButton"></span>
<span class="ratingButton"></span>
<span class="ratingButton"></span>
<span class="ratingButton"></span>
<input type="text" id="ratingValue" name="dynamic_rate" value="2"/>
</span>
<script type="text/javascript">
var rate = new Spry.Widget.Rating("spryrating1", {ratingValueElement:"ratingValue", afterRating:'serverValue', saveURL:'SpryRating.php?id=spryrating5&val=@@rw_Rating@@'});
</script>
</body>
Notice that the options object contains this: afterRating: 'serverValue'. Unfortunately, the sample files (at least the ones I've got) don't include a copy of SpryRating.php. However, I assume that it probably saves the selected value, calculates the average of all saved values, and then uses echo to output "serverValue=4.5" (or whatever the average is).

HTML Panel into HTML Panel

Hello,
I know this topic has been seen a lot, but I still can't find
the answer for me...
Well, it's easy, I use html panels to load content into my
website (I have a SPRYMenu wich loads content into the
"main" div)
But, when I load content including another HTML Panel, it
doesn't work...
I've set the evalscripts to true, but it doesn't work...
here is a small portion of code coming from the exaples, wich
looks like what i want to do, even if in this code, it loads a
slidingPanel, not a HTLMPanel, but I think if I can make it work,
I'll be able to do what I want then !
here is the main file
<!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">
<head>
<style type="text/css">
hr, .clearAll {
clear: both;
.SlidingPanels {
width: 300px;
height: 300px;
.SlidingPanelsContent {
width: 300px;
height: 300px;
.p1 {
background-color: #CCCC66;
.p2 {
background-color: #FFFFCC;
.p3 {
background-color: #6699FF;
.p4 {
background-color: #99CCCC;
.p5 {
background-color: #FF99CC;
.p6 {
background-color: #339933;
.p7 {
background-color: #9933FF;
.p8 {
background-color: #669966;
.p9 {
background-color: #00FFCC;
#example2.SlidingPanels {
float: left;
#example2 .SlidingPanelsContentGroup {
float: left;
width: 10000px;
#example2 .SlidingPanelsContent {
float: left;
</style>
<script src="inc/SpryHTMLPanel.js"
language="javascript"
type="text/javascript">
Spry.Widget.HTMLPanel.evalScripts =
true;</script>
<link href="inc/SpryHTMLPanel.css"
rel="stylesheet"
type="text/css" />
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1" />
<title>Document sans nom</title>
</head>
<body>
<div id="panelSpry"
style="">text de base</div>
<div><a
href="essai1.html"
onclick="panelWidget.loadContent(this.href);return
false;">changement</a></div>
<script>
var panelWidget = new
Spry.Widget.HTMLPanel("panelSpry", { evalScripts:
true });
</script>
</body>
</html>
and here is the loaded file (essai1.html) :
<link
href="inc/SprySlidingPanels.css"
rel="stylesheet"
type="text/css" />
<script type="text/javascript"
src="inc/SprySlidingPanels.js"></script>
<p>
Navigate by index:
<a href="#"
onclick="sp2.showPanel(0); return
false;">1</a> |
<a href="#"
onclick="sp2.showPanel(1); return
false;">2</a> |
<a href="#"
onclick="sp2.showPanel(2); return
false;">3</a> |
<a href="#"
onclick="sp2.showPanel(3); return
false;">4</a> |
<a href="#"
onclick="sp2.showPanel(4); return
false;">5</a> |
<a href="#"
onclick="sp2.showPanel(5); return
false;">6</a> |
<a href="#"
onclick="sp2.showPanel(6); return
false;">7</a> |
<a href="#"
onclick="sp2.showPanel(7); return
false;">8</a> |
<a href="#"
onclick="sp2.showPanel(8); return
false;">9</a>
</p>
<p>
Navigate by id:
<a href="#"
onclick="sp2.showPanel('ex2_p1'); return
false;">p1</a> |
<a href="#"
onclick="sp2.showPanel('ex2_p2'); return
false;">p2</a> |
<a href="#"
onclick="sp2.showPanel('ex2_p3'); return
false;">p3</a> |
<a href="#"
onclick="sp2.showPanel('ex2_p4'); return
false;">p4</a> |
<a href="#"
onclick="sp2.showPanel('ex2_p5'); return
false;">p5</a> |
<a href="#"
onclick="sp2.showPanel('ex2_p6'); return
false;">p6</a> |
<a href="#"
onclick="sp2.showPanel('ex2_p7'); return
false;">p7</a> |
<a href="#"
onclick="sp2.showPanel('ex2_p8'); return
false;">p8</a> |
<a href="#"
onclick="sp2.showPanel('ex2_p9'); return
false;">p9</a>
</p>
<p>
Other navigation methods:
<a href="#"
onclick="sp2.showFirstPanel(); return
false;">First</a> |
<a href="#"
onclick="sp2.showPreviousPanel(); return
false;">Previous</a> |
<a href="#"
onclick="sp2.showNextPanel(); return
false;">Next</a> |
<a href="#"
onclick="sp2.showLastPanel(); return
false;">Last</a>
</p>
<p>&nbsp;</p>
<div id="example2"
class="SlidingPanels"
tabindex="0">
<div
class="SlidingPanelsContentGroup">
<div id="ex2_p1"
class="SlidingPanelsContent p1">Panel
1</div>
<div id="ex2_p2"
class="SlidingPanelsContent p2">Panel
2</div>
<div id="ex2_p3"
class="SlidingPanelsContent p3">Panel
3</div>
<div id="ex2_p4"
class="SlidingPanelsContent p4">Panel
4</div>
<div id="ex2_p5"
class="SlidingPanelsContent p5">Panel
5</div>
<div id="ex2_p6"
class="SlidingPanelsContent p6">Panel
6</div>
<div id="ex2_p7"
class="SlidingPanelsContent p7">Panel
7</div>
<div id="ex2_p8"
class="SlidingPanelsContent p8">Panel
8</div>
<div id="ex2_p9"
class="SlidingPanelsContent p9">Panel
9</div>
</div>
</div>
<script
type="text/javascript">
var sp2 = new Spry.Widget.SlidingPanels('example2');
</script>
I hope somebody can help....
Thanks !

Thank you for your quick reply.
I still have a problem here.
Would you please see my 3 files for my problems.
Thank you very much for your time.
1. index.php
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Test for Spry HTML Panel</title>
<script src="../spry/SpryHTMLPanel.js" language="javascript" type="text/javascript"></script>
<link href="../spry/SpryHTMLPanel.css" rel="stylesheet" type="text/css">
</head>
<body>
<input type="button" value="Click Here to Load Document Level 2" onclick="body_content_area.loadContent('doc_level_2.php');" />
    <div id="body_content_area" style="clear:both; width:100%;">
        
        <div class="HTMLPanelLoadingContent">Loading ...</div>
    </div>
<script type="text/javascript" language="javascript1.2">

</script>
</body>
</html>
2. doc_level_2.php
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<script src="../spry/SpryHTMLPanel.js" language="javascript" type="text/javascript"></script>
<link href="../spry/SpryHTMLPanel.css" rel="stylesheet" type="text/css">
</head>
<body>
<H1>Here is a content of document level 2</h1>
<br /><br />
<input type="button" value="Click Here to Load Document Level 3" onclick="body_content_area_2.loadContent('doc_level_3.php');" />
    <div id="body_content_area_2" style="float:left; width:100%;">
        
        <div class="HTMLPanelLoadingContent">Loading ...</div>
    </div>
<script type="text/javascript" language="javascript1.2">

</script>
</body>
</html>
3. doc_level_3.php
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
</head>
<body>
<div style="float:left;">
<h2>Here is the content of document level 3</h2>
</div>
</body>
</html>

Fade effect applied to HTML panel plus onobtrusive JS

At first, I'm not a programmer, so sorry if I'm not clear as
desirable, and sorry for my English. I'm trying to make fade an
HTMLpanel one a user clicks any of the links I have on my page, I
have 2 sets of links, one one the top called
#tab
and another set
#links_one. My panel works
perfectly, also it has Spry regions, and everything loads
perfectly, I used unobtrusibe JS and it works, but i cant make the
same applying effects. This is some of my code: mainContent is the
div where the panel loads:
quote:
var mainPanel = null;
var Abrir = null;
function InitProductPage()
mainPanel = new Spry.Widget.HTMLPanel("mainContent");
var Abrir = new Spry.Effect.Fade('mainContent',
{toggle:true});
function Apear(){
var obs = {onPostUpdate: function(){Abrir.start();}};
mainPanel.addObserver(obs);
Spry.$$("#tab a").addEventListener("click", function(e)
mainPanel.loadContent(this.href, { id: "mainContent" });
return false;
}, false);
Spry.$$("#links_one a").addEventListener("click",
function(e)
mainPanel.loadContent(this.href);
runIt();
return false;
}, false);
Spry.$$("#links_one a").addEventListener("click",
function(e)
mainPanel.Apear();
return false
},false;
Spry.Utils.addLoadListener(InitProductPage);
Ending I used this samples to make my panel:
http://labs.adobe.com/technologies/spry/articles/best_practices/separating_behavior.html
L=http://labs.adobe.com/technologies/spry/samples/htmlpanel/html_panel_two.html
]http://labs.adobe.com/technologies/spry/samples/htmlpanel/html_panel_two.html
http://labs.adobe.com/technologies/spry/samples/htmlpanel/html_panel_two.html
[/L][
(the beahviour I try to get os when you click this
link--->
http://labs.adobe.com/technologies/spry/samples/htmlpanel/frag-0.htmlThanks
to all.
Florencia

Anthony,
As Arnout stated, this can help you smooth the fading action
You can change the sliding duration and the frames per second for your
sliding panel:
http://labs.adobe.com/technologies/spry/articles/data_api/apis/sliding_panels.ht ml#options
And as bonus, you can actually specify a transition (by adding the
option: "transition: " in the constructor as well, so you can use the
SpryEffect transitions:
http://labs.adobe.com/technologies/spry/samples/effects/transition_sample.html
Unless I am reading you incorrectly, which happens frequently at my age, the above should help.
Ben

Evaluate Script in HTML panel in Tooltip

I have tried this question in another thread and got some help from Ben but still can't quite get it to work.
I am trying to embed an HTML panel, which comtains spry xml data, into a tooltip but cannot get the scripts in the panel to run once they are in the tool tip. The example is the middle of the three line on this page: http://www.edwardshephard.net/caravanclub/tooltiptest.html which should call data in from this page: http://www.edwardshephard.net/caravanclub/clubtooltippanel.html.
I have added a {evalScripts:true} line as suggested by Ben, which looks like a good solution, but still no joy. Having looked at other threads I wonder if it needs some sort of post-loading observer thing to run the scripts, but I'm not sure and not experienced enought to work out the syntax. Would welcome any further help please. thanks, Edward

Because you are also importing a spry:region and not only Spry Data, you need to manally call:
Spry.Data.initRegions();
Once the tooltip has loaded its HTML panel contents.

Getting a sliding panel loaded into an html panel to work.

Hi. This is my first post on the forum.
I've been using Spry a little here and there. Today I ran
into a situation where I want to load an external page, that has a
sliding panel in it, into an html panel. So far I have not had luck
and I suppose it has to do with loading the js file. At the moment
I have a right column that already has a sliding panel (working).
But it would appear that the loaded external html file (in the left
"main" column) is not picking that up. Any suggestions for a noob
as to what to do next? Viewing the external page by itself allows
the sliding panel to work (that is when I add the js file import to
the head of the external html file... but that head section does no
good when loaded into an html panel)
Anyway, any help at all is greatly appreciated.
Thanks,
Eric

Thank you very much! I found the topic
here.
It will require a bit of a small learning curve for me as html
panel and sliding panels are my first interaction with js... even
my rollovers are css driven. Thanks!

Serverside response for spry rating

first off, where is the best place to post spry questions?
I am building a spry rating widget using the dynamic sample from the spry documentation: http://labs.adobe.com/technologies/spry/articles/rating_overview/index.html
I understand how to send the information to a script.php on the server and processes the data, but I do not know how to retrieve the data from the script. Do i need to generate an xml page?

Hi,
the Spry forums are here:
http://www.adobe.com/cfusion/webforums/forum/categories.cfm?forumid=72&catid=602
Cheers,
Günter Schenk
Adobe Community Expert, Dreamweaver

Html panel - inside html panel?

hi everyone
i have a page with a main content div which is an html panel theat will load different content
one of the (fragment) pages it loads has xml data etc on it.
i now need on this dynamic page a little html in a div too, but that means an html panel within an html panel!
i declared var infolpanel; on the main page, and the maincontent htmlpanel div has evalscripts set true
on the dynamic fragment page, the xml datasets are working etc, but i need another html panel
infopanel = new Spry.Widget.HTMLPanel("info");
infopanel.loadContent('products/'+ product + '/info.html');}};
now when i load the page, none of the xml data populates either, instead showing {dataset::variable} instead :-s
removing the above javascript again fixes it.
so, is there any (other?) way for this fragmented page to load a smaller fragment into the div?
thanks
delboy

How do I open another collapsible panel, on a different page
through a link? I have tried many different ways, including trying
to use SpryURLUtils.js and am not having any luck? I really wanted
to jump to a different pages' collapsible panel, open it, and then
populate the SpryHTMLPanel, located inside that targeted
collapsible panel. My collapsible panels and HTML panels all work
fine on the target page, when just interacting on the page itself,
with mouseclicks. Inside the collapsible panels I have unordered
list of links, that populate HTMLpanels, with the appropriate HTML
fragments. My problems lies in crosslinking from other webpages to
the exact collapsible panel, and then populating the exact HTML
fragment, just as if I had clicked on the link in the list, if I
had been on the target page in the first place.
<a href="../OA_qi_docreq.html?panel=0#cp1">
<a href="../OA_qi_docreq.html#cp1">
<a href="../OA_qi_docreq.html#cp1.open();">

Spry Rating in an HTML Panel

Similar Messages

Maybe you are looking for