Welcome Guest! You need to login or register to make posts.

Notification

Icon
Error

Options
Go to last post Go to first unread
corlin  
#1 Posted : Monday, March 29, 2010 6:36:27 AM(UTC)
corlin

Rank: Newbie

Groups: Member
Joined: 1/9/2010(UTC)
Posts: 7

Hi,

I can't figure out how to add an extra imageList to the sample - so there could be two sets of images to choose from.

I have tried just to add following to the PhotoLabelSampel.aspx:

Code:

<a rel="imageMenu" href="#" onclick="return false;" class="button menuToggleButton">
							<span class="icon addimage">image_2 ▼</span></a>
						<div id="Div1" class="menu">
							<aur:ImageList runat="server" ID="imageList_2" />
						</div>


I get an new dropdown with images - but it is filled with the same images as the first imagelist?
Why is that - I assumed that the imageList was filled in the codebehind:
Code:

private void LoadImageList()
		{
			//add jpg and png images
			Array.ForEach(Directory.GetFiles(_imageFolder, "*.jpg"), s => imageList.Images.Add(s));
			Array.ForEach(Directory.GetFiles(_imageFolder, "*.png"), s => imageList.Images.Add(s));
		}

But here is only reference to imageList not imageList_2 - I can't see how this works?

Could you please guide me a little here :-)

Best regards
Claus Corlin
andreym  
#2 Posted : Monday, March 29, 2010 1:36:43 PM(UTC)
andreym

Rank: Advanced Member

Groups:
Joined: 6/16/2009(UTC)
Posts: 134

Was thanked: 8 time(s) in 8 post(s)
Hello!

You are correct, the image list are filled from LoadImageList method. You need to correct your markup in the PhotoLabelSampel.aspx. It should be like this:
Code:
<a rel="imageMenu2" href="#" onclick="return false;" class="button menuToggleButton">
     <span class="icon addimage">image_2 ▼</span></a>
<div id="imageMenu2" class="menu">
     <aur:ImageList runat="server" ID="imageList2" />
</div>

The rel attribute of the menu button should be the same as id attribute of the menu. In the code snippet above it is imageMenu2.

Also you need to add event handler for click event for $(".menuToggleButton[rel='imageMenu2']") element in the Scripts/Sample.js file. Something like that:
Code:
    // show / hide menu helper function
    function toogleMenu() {
        var th = $(this), menu = th.attr('rel');
        if (th.hasClass("pushed")) {
            // hide menu
            $('#' + menu).slideUp('fast');
            th.removeClass("pushed");
        } else {
            //hide other menus
            $('.menu').not('#' + menu).hide();
            // show menu that related to the clicked button
            $('#' + menu).slideDown('fast');
            // remove pushed class from other buttons
            $(".menuToggleButton").removeClass("pushed");
            $("div.regions div.tabPanel ul li.listItem a.edit").removeClass("pushed");
            // add pushed class for clicked button
            th.addClass("pushed");
        }
    }

    //show / hide add image2 menu
    $(".menuToggleButton[rel='imageMenu2']").click(toogleMenu);
Users browsing this topic
Forum Jump  
You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.