Showing posts with label extender. Show all posts
Showing posts with label extender. Show all posts

Wednesday, March 28, 2012

Dynamic Ajax SlideShow Extender with ContextKey...help

Does anyone have an example of how to use the slideshow extender dynamically?

I've tried copying the process used by the AutoCompletewithContextKey but when I try to set the contextkey I get the following error when the page loads ;

"Object does not support this property or method"

Where can I get a list of the properties/methods supported on the java side of things...I've tried the object browser?

Here's my default.aspx :

<%@dotnet.itags.org.PageLanguage="VB"AutoEventWireup="true"CodeFile="Default.aspx.vb"Inherits="_Default" %>

<!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.1//EN""http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<htmlxmlns="http://www.w3.org/1999/xhtml">

<headrunat="server">

<linkhref="Basic.css"rel="stylesheet"type="text/css"/>

<title>Niamh Ella Land</title>

</head>

<body>

<formid="form1"runat="server">

<asp:ButtonID="prevButton"runat="Server"

Style="z-index: 100; left: 468px; position: absolute; top: 335px;"Width="60px"Font-Size="Larger"Text="Prev"Font-Underline="True"/>

<asp:ButtonID="playButton"runat="Server"

Style="z-index: 101; left: 528px; position: absolute; top: 335px;"Width="60px"Font-Size="Larger"Text="Play"Font-Underline="True"/>

<asp:ButtonID="nextButton"runat="Server"

Style="z-index: 102; left: 588px; position: absolute; top: 335px;"Width="60px"Font-Size="Larger"Text="Next"Font-Underline="True"/>

<asp:LabelID="imageLabel1"runat="Server"

Style="z-index: 103; left: 519px; position: absolute; top: 308px;"Font-Underline="True"/>

<asp:LabelID="Label1"runat="server"Font-Names="Times New Roman"Font-Size="Larger"

Style="z-index: 104; left: 484px; position: absolute; top: 35px"Text="Niamh Ella Land"

Width="136px"Font-Underline="True"></asp:Label>

<asp:ImageID="Image1"runat="server"

Height="220px"

Style="border: 1px solid black;width:auto; z-index: 105; left: 404px; position: absolute; top: 73px;"

ImageUrl="~/images/Album5/HPIM1604.JPG"

AlternateText="Sharky : In the big bed ocean"Width="261px"BorderStyle="Groove"/>

<ajaxToolkit:SlideShowExtenderrunat="server"ID="slideshowextend1"

ImageDescriptionLabelID="imageLabel1"

BehaviorID="grazzer"

UseContextKey="true"

ContextKey="images\Album3"

Loop="True"

NextButtonID="nextButton"

PlayButtonID="playButton"

PlayButtonText="Play"

PreviousButtonID="prevButton"

SlideShowServiceMethod="GetSlides"

SlideShowServicePath="SlidesService.asmx"

StopButtonText="Stop"

TargetControlID="Image1"AutoPlay="True"/>

<asp:ScriptManagerID="ScriptManager1"runat="server">

</asp:ScriptManager>

<asp:DropDownListID="DropDownList1"runat="server"DataSourceID="XmlDataSource1"

DataTextField="text"DataValueField="path"Style="z-index: 107; left: 77px;

position: absolute; top: 151px"Width="199px">

</asp:DropDownList>

<asp:XmlDataSourceID="XmlDataSource1"runat="server"DataFile="~/AlbumList.xml"></asp:XmlDataSource>

<scripttype="text/javascript">

// Hook up to the AutoComplete populating/populated events

function pageLoad() {

var SlideShow = $find('grazzer');

if (!SlideShow)return;

//var userContext = $get('DropDownList1');

//if (!userContext) return;

//alert(userContext.DataValueField.text);

// Dynamically assign the context and change the color when processing

SlideShow.add_populating(function()

{

SlideShow.set_contextKey("images\Album1");

});

}

</script>

</form>

</body>

</html>

Here's my webservice which works :

Imports System.Web

Imports System.Web.Services

Imports System.Web.Services.Protocols<WebService(Namespace:="http://tempuri.org/")> _

<WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)> _

<Global.Microsoft.VisualBasic.CompilerServices.DesignerGenerated()> _

<System.Web.Script.Services.ScriptService()> _

PublicClass SlidesServiceInherits System.Web.Services.WebService

<WebMethod()> _

PublicFunction GetSlides()As AjaxControlToolkit.Slide()

Dim targetDirectoryAsString ="images/Album5"

Dim dAs IO.DirectoryInfo =New IO.DirectoryInfo(Server.MapPath(targetDirectory))

Dim fileEntries()As IO.FileInfo = d.GetFiles("*.jpg")

Dim filecount = 0

Dim fileNameAs IO.FileInfo

Dim MySlides(fileEntries.Length - 1)As AjaxControlToolkit.Slide

ForEach fileNameIn fileEntries

MySlides(filecount) =New AjaxControlToolkit.Slide(targetDirectory &"/" & fileName.Name.ToString, fileName.Name.ToString, fileName.Name.ToString)

filecount = filecount + 1

Next fileName

Return MySlides

EndFunction

<WebMethod()> _

PublicFunction GetSlidesWithContext(ByVal ContextKeyAsString)As AjaxControlToolkit.Slide()

Dim targetDirectoryAsString ="images/Album5"

If ContextKey =""Then

ContextKey = targetDirectory

EndIf

Dim dAs IO.DirectoryInfo =New IO.DirectoryInfo(Server.MapPath(ContextKey))

Dim fileEntries()As IO.FileInfo = d.GetFiles("*.jpg")

Dim filecount = 0

Dim fileNameAs IO.FileInfo

Dim MySlides(fileEntries.Length - 1)As AjaxControlToolkit.Slide

ForEach fileNameIn fileEntries

MySlides(filecount) =New AjaxControlToolkit.Slide(ContextKey &"/" & fileName.Name.ToString, fileName.Name.ToString, fileName.Name.ToString)

filecount = filecount + 1

Next fileName

Return MySlides

EndFunction

End Class

Frustrated Newbie,

Graham.

Could you escape the backslash and retry?

"images\Album1" => "images\\Album1"


Thanks for the suggestion, yes I've already tried this to no avail.

the webpage complains about the method I'm trying to use...

How can I see what methods I should be able to use?


Hi,

I've also verified that I'm running the latest toolkit version 10920.

Does anyone have a working example of using and setting the contextkey in the AJAX SlideShow Extension?

Am I wasting time on something that isn't actually possible? Any documemtation?

Thank you,

Graham.


Take a look athttp://www.codeplex.com/AtlasControlToolkit/SourceControl/FileView.aspx?itemId=352171&changeSetId=27216. You will find a lot of useful Toolkit control usage in the aspx files of the TestingClient and ToolkitTests projects.


Thank you, that's just what I was looking for..great examples!


Crying

I got the error like this:

'AjaxControlToolkit.SlideShowExtender' does not contain a definition for 'ContextKey' when I used Mr.Wen's code.Any idea???

this.slideshowextend1.ContextKey = Request.QueryString["qs"];


Have you updated to the latest version of the toolkit. I had a similar problem, deleted all my binaries and loaded the latest and everything worked!!!

Monday, March 26, 2012

Dual slider implemetation in ajax

Hiii

i have just started using the ajax toolkit. i have used the slider extender. But now my requirement is that i need to have a slider

with has got two handles.. how can i do that and how can i handle the text changed event for each of the handles.. Does ajax toolkit

has such an implementation..

Its very urgent

This came up before but it got rejected by the dev team. It looks like someone has gotten it working though:http://www.dimebrain.com/2007/07/a-dual-slider-f.html


Hello,

Just wanted to add that the example I presented earlier doesn't work with the latest version of the Toolkit, unfortunately. I'm using a different solution now, you can find it here:http://www.dimebrain.com/2007/11/another-dual-sl.html, but keep in mind that it's using another framework. ASP.NET AJAX is only used to load the scripts into the manager.



S i have worked out your sample in that web site. It works well in a sample project. But it doesnt work in my original project. When i ll add inside the <table><tr><td> .... </> tag it doesnt work . Y?

DropShadowExtender display issue

Im jsut playing about with the drop shadow extender and when i come to use it for the first time i have hit a major snag.

I have bound it to a panel which contains some text, when i run the page, i get the rounded corners of the panel, but the shadow (or I shoud say a black image the same size of the panel) appears about an inch lower down on the screen and not even remotely connected to the panel, let alone behind it to give a shadow effect.

Anyone else run into this?

I am having the same issue. Is there a solution to this?



...Have you tested this in both IE7 and FireFox?

If it displays properly in one but not the other it's probably due to HTML rendering.

You can resolve this behavior by removing HTML tags, especially tags like HTML header tags.
Replace them with ASP.NET CSS, then they should render properly in the toolkit div sections.


Yes, it's hosed the same in Firefox.

Surely someone, somewhere is using this thing somehow got it working outside of the samples.

I've recreated this page four times now and it's still not working correctly.

Saturday, March 24, 2012

Dropshadow too low

I am have a problem with the dropshadow extender placing the shadow too low on the page. I have a series of asp panels on a page that are targets of dropshadow extenders, for some reason all of the shadow are being postioned too low on the page. It seem that the top shadow is is getting a sytle element with a top value that is placing it too low on the page, and then all of the other dropshadow extender panels are offset by the same value.

Can anyone shed some light as to how the dropshadow extender determines its top position? I assmed that I would be with regard to the posotion of the target panel, but that doesn't seem to be the case here.

Thanks.

Any help welcome!

Hi Audley9,

This kind of issues is usually caused by the css settings. Here is my sample that you can reference to. Please compare it with yours.

<%@. Page Language="C#" %><%@. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head id="Head1" runat="server"> <title>Untitled Page</title> <style type="text/css">.overall { left: 10px; top: 10px; ; height: 500px; background-color: Silver; } .above { position: absolute; margin-left: 50px; margin-top: 50px; z-index: 2; } .aboveinside { width:300px; background-color:#5377A9; color:white; font-weight:bold; } .below { margin-top: 10px; left: 0px; width: 300px; height: 200px; z-index: 1; background-color: Blue; } </style></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server" /> <div class="overall"> <asp:Panel ID="above" runat="server" CssClass="aboveinside"> <div style="padding:10px"> Here's some text in a box. </div> </asp:Panel> <cc1:DropShadowExtender ID="DropShadowExtender1" runat="server" TargetControlID="above" Width="5" Opacity=".5" Rounded="true" TrackPosition="true" Radius="6"> </cc1:DropShadowExtender> <div class="below">This is some text underneath... This is some text underneath... This is some text underneath... This is some text underneath... This is some text underneath... This is some text underneath... This is some text underneath... This is some text underneath... This is some text underneath... This is some text underneath... </div> </div> </form></body></html>

I hope this help.

Best regards,

Jonathan


Thnaks for Answering!

I had solved this issue already but forgot to come back to this post. Whit my situation, I had a series of nested "Div' Tags that had "Postion: relative", set to the divs. I was trying to acomplish a rather complex layout using Css, which I was not able to acomplish (there were other issue besides this one), so I have had to intermingle css with table layout.

Thanks for the help!

DropShadow panel within another dropshadow panel

Hello,


I am trying to put a drop shadow extender on a panel around another drop shadow extender but the inside panel is acting funny. I have the panel rounded and looks great but the black shadow part is distorted and at the bottom of the indside panel ? I have tried position absolute in a few places and tried putting a div around it but still no change...

Any thoughts?

So, you are trying to nest one DropShadowExtender on a panel within another DropShadowExtender panel?
That is exactly what I am trying to do... Does anyone know how to make this work?

DropShadow Extender: Opacity-property problem

I create Atlas-website, put ScriptManager on top of the page, add panel and set height, width and background-color properties. Then i add AtlasToolkit Dropdown Extender on the page ja set it's properties. My problem is that the dropshadow is only visible when Opacity is set to 1.0. If I set Opacity-property to less than 1.0 eg. 0.75, Panel-control doesn't show drop shadow. Am I missing something?

DropShadow-sample page works though..

Which browser are you using? But you're saying the sample is working okay, so I'm not sure what's wrong. If opacity is 1.0, the extender doesn't bother to apply the OpacityBehavior, which manages the opacity property. It would be interesting to see if the OpacityBehavior works on your panel. Maybe take a closer look at any differences between the sample and your page?


I'm using IE6 & IE7.

This markup with opacity set to .7 doesn't show dropshadow for panel:

<%@.PageLanguage="VB"AutoEventWireup="true"CodeFile="Default.aspx.vb"Inherits="_Default"%>

<%@.RegisterAssembly="AtlasControlToolkit"Namespace="AtlasControlToolkit"TagPrefix="atlasToolkit"%>

<!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.1//EN""http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<htmlxmlns="http://www.w3.org/1999/xhtml">

<headrunat="server">

<title>mySample Page</title>

<styletype="text/css">

.panelStyle {

width:350px;

height:250px;

background:#517dbf;

}

</style>

</head>

<body>

<formid="form1"runat="server">

<atlas:ScriptManagerID="ScriptManager1"runat="server"/>

<div>

<asp:PanelID="Panel1"runat="server"CssClass="panelStyle">

</asp:Panel>

<atlasToolkit:DropShadowExtenderID="DropShadowExtender1"runat="server">

<atlasToolkit:DropShadowProperties

TargetControlID="Panel1"

Width="5"

Opacity=".75"

TrackPosition="true"

Rounded="false"/>

</atlasToolkit:DropShadowExtender>

</div>

</form>

<scripttype="text/xml-script">

<page xmlns:script="http://schemas.microsoft.com/xml-script/2005">

<references>

</references>

<components>

</components>

</page>

</script>

</body>

</html>

But when I add the checboxlist w/ onclick-events from the samplepage , dropshadow is visible when checkbox is checked: now opacity values from .25 to .75 are working ok.

On DesignView DropShadowExtender1-Control displays error-text: 'TargetProperties' could not be initialized. Details: 'TargetProperties' could not be added to the collection. Details: 'dsBehavior' could not be set on property 'ID'. Doesn't throw any run-time errors.

<%@.PageLanguage="VB"AutoEventWireup="true"CodeFile="Default.aspx.vb"Inherits="_Default"%>

<%@.RegisterAssembly="AtlasControlToolkit"Namespace="AtlasControlToolkit"TagPrefix="atlasToolkit"%>

<!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.1//EN""http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<htmlxmlns="http://www.w3.org/1999/xhtml">

<headrunat="server">

<title>mySample Page</title>

<styletype="text/css">

.panelStyle {

width:350px;

height:250px;

background:#517dbf;

}

</style>

</head>

<body>

<formid="form1"runat="server">

<atlas:ScriptManagerID="ScriptManager1"runat="server"/>

<div>

<asp:PanelID="Panel1"runat="server"CssClass="panelStyle">

</asp:Panel>

<atlasToolkit:DropShadowExtenderID="DropShadowExtender1"runat="server">

<atlasToolkit:DropShadowProperties

ID="dsBehavior"

Opacity=".75"

Rounded="false"

TargetControlID="Panel1"

TrackPosition="true"

Width="5"/>

</atlasToolkit:DropShadowExtender>

</div>

<divstyle="padding: 15px;">

<labelfor="chkShadow">

Show Drop Shadow:

</label>

<inputid="chkShadow"checked="checked"onclick="var b = $object('dsBehavior'); b.set_Width(chkShadow.checked ? 5 : 0);"

type="checkbox"/><br/>

<labelfor="chkRounded">

Rounded:

</label>

<inputid="chkRounded"checked="checked"onclick="var b = $object('dsBehavior'); b.set_Rounded(chkRounded.checked);"

type="checkbox"/>

<div>

Opacity:

<inputid="opacity25"name="opacityValues"onclick="$object('dsBehavior').set_Opacity(this.value);"

type="radio"value=".25"/><labelfor="opacity25">25%</label>

<inputid="opacity50"name="opacityValues"onclick="$object('dsBehavior').set_Opacity(this.value);"

type="radio"value=".5"/><labelfor="opacity50">50%</label>

<inputid="opacity75"checked="checked"name="opacityValues"onclick="$object('dsBehavior').set_Opacity(this.value);"

type="radio"value=".75"/><labelfor="opacity75">75%</label>

<inputid="opacity100"name="opacityValues"onclick="$object('dsBehavior').set_Opacity(this.value);"

type="radio"value="1.0"/><labelfor="opacity100">100%</label>

</div>

</div>

</form>

<scripttype="text/xml-script">

<page xmlns:script="http://schemas.microsoft.com/xml-script/2005">

<references>

</references>

<components>

</components>

</page>

</script>

</body>

</html>


My best guess is that this has something to do with your video card/driver. I'm not sure how IE (or FireFox) does opacity but your first sample works fine for me for all Opacity values. Note I also do not get the design time errors you're mentioning, but that shouldn't affect the runtime behavior. Does it work in other browsers for you?

I've tried with FF & IE and two different laptops with same results (both laptops have VS 2005 Team Developer installed). I don't think it's video card/driver 'cause SamplePage's checkboxlist w/ onclick-events works ok. (BTW i have NVIDIA FX 1400 Go 256Mt-video card.) DesignView error happens when I add ID-property for the DropShadowProperties. Error disappears when I remove ID-property.

IntelliSense shows only "Opacity, Rounded, TargetControlID, TrackPosition and Width"-properties, no Id-property? I uninstalled and reinstalled all Atlas relatud stuff and created a new Atlas-website, but no dropshadow with opacity less than 1.0.

I'll keep digging.. or just use CSS-based dropshadows..Sad [:(]


This markup displays default dropshadow with opacity 1.0:

<

atlas:ScriptManagerID="ScriptManager1"runat="server"EnablePartialRendering="true"/><div>
<asp:PanelID="Panel1"CssClass="panelStyle"runat="server"></asp:Panel>
<atlasToolkit:DropShadowExtenderID="DropShadowExtender1"runat="server"EnableViewState="true">
<atlasToolkit:DropShadowPropertiesTargetControlID="Panel1"/>
</atlasToolkit:DropShadowExtender>
</div>

BTW) Why tagprefix is cc1 and not atlasToolkit (you have to manually change it)

From the DropShadowProperties.cs:

// (c) Copyright Microsoft Corporation.
// This source is subject to the Microsoft Permissive License.
// Seehttp://www.microsoft.com/resources/sharedsource/licensingbasics/sharedsourcelicenses.mspx.
// All other rights reserved.


using System.Web.UI.WebControls;
using System.Web.UI;
using System.ComponentModel;
using Microsoft.AtlasControlExtender;

namespace AtlasControlToolkit
{
public class DropShadowProperties : TargetControlPropertiesBase<Panel>
{

/// <summary>
/// The opacity of the shadow, from 0 (transparent - no shadow rendered) to 1.0, which is fully opaque black.
///The default is .5.
/// </summary>
[DefaultValue(1.0f)]<-- This is not default .5
public float Opacity
{
get
{
return GetPropertyValue<float>("Opacity", 1.0f);<-- This is not default .5
}
set
{
SetPropertyValue<float>("Opacity", value);
}
}


Yes, that's a documentation bug, thanks for pointing it out.

The tag prefixes are arbitrary. They default to "cc1" or whatever, there isn't any way to specify them automatically.

Thanks!


Oh - the ID field is marked Browsable(false) so it won't show up in intellisense.

It's not needed in the 90% case and you can get yourself in trouble (e.g. if you use it in a repeater) so it's hidden.

Dropshadow extender for DIV doesnt resize

Hello! This is my first post and I am new to AJAX . I have a few questions about the dropshadow extender:

1. Does it only work with server-side controls (with runat="server" attribute)?

2. I am trying to fetch XML data from a file using the XMLHttpRequest object and putting the rsult in a div. The div resizes according to the volume of content. However, if I try to extend it using the DropShadow extender, the drop shadow doesn't resize. Am I missing something here?

Thanks in advance.

Added later:

Hi,

1. Yes, it can only be used to extend server side controls.

2. Please set TrackPosition to true to make the extender change its size according to the size of its target. You may find this in the sample web site of the AjaxControlToolkit.

Hope this helps.


Thanks Raymond!

I know how to make it work now.

DropShadow Extender

Hi everybody,

I have noticed a problem with this control: when it runs on a page, if the user resize the window browser the control moves to fit to the new size, but the shadow doesn't. It happen this to you too ?

Consider setting TrackPosition="true" for the DropShadowExtender.
Thanks Davis, now it works fine.
Thanks David, now it works fine.

Wednesday, March 21, 2012

Dropdownlist disappears on using Modal PopUP extender

Hi,

I have a strange problem here..I have a page with quite a few controls and on clicking a button I am having a panel "popped up" using the Ajax Modal popup extender. This popup has a dropdownlist and is being rendered fine. The problem is that there is another dropdown list( not on the pop up) which disappears right when the popup extender is called. This control is visible in the Source of the page but not rendered until there is a postback on the screen. Can anyone tell me if they have faced such a problem before? If so, any possible work arounds?

Can you please post the code? Or can you provide a demo?

Without code it is unable to determined.

I think we should provide as much as possible information when we ask for answers, do you think so?

Please provide more information the next time,thanks.


was this ever resolved? I have a same problem my dropdowns on the page disappear when popup extender is show and then hidden.


Usually the dropdown comes up always on top thats why the ControlToolKit team sets it invisible when showing the Modal Popup and it gets visible when the hide() method is executed, is there any chance the hide is not called?

DropDownExtender: Refresh content

I have a drop-down extender, where the control ID references a Panel, which contains a TreeView. When I update the contents of the TreeView, and hit the drop-down button, the treeview shown is not refreshed. Is there any way that I can force a refresh?

Thanks - Bennie

How are you updating the treeview?

Ron


I am adding/removing tree nodes in a public method of the treeview.


Is the TreeView in an UpdatePanel? I'm trying to determine how all of the controls in question are composed. Could you post a snippit of the aspx?


this is the DropDownExtender:

<

ajaxToolkit:DropDownExtenderrunat="server"ID="DDE"TargetControlID="bookmarksTextLabel"DropDownControlID="DropPanel"/>

This is the DropPanel:

<asp:PanelEnableViewState="false"ID="DropPanel"ForeColor="#747678"runat="server"Style="text-align:left;padding-bottom:0px;padding-top:0px;margin-bottom:0px;margin-top:0px;display:none;visibility:hidden;">

<divstyle="border-color:Blue; border-width: 1px; border-style:solid; padding: 1px,1px,1px,1px;">

<bmt:BookmarksTreeid="tvBookmarks"runat="server"/></div></asp:Panel>

I tried enabling/disabling ViewState, but to no avail.


Does it work without using the drop-down extender? Please verify that the tree is populating correctly without the extender on the page. Is all of this content within an UpdatePanel?

It does work without the DropDownExtenter. No, there is no outer UpdatePanel.