2011-02-16 3 views
1

목록 상자와 이미지 상자를 둡니다. 이제 사용자가 목록의 다른 요소를 클릭 할 때마다 이미지를 교환하고 싶습니다. 사물의ASP. 목록 및 그림

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using System.Web.UI; 
using System.Web.UI.WebControls; 

public partial class _Default : System.Web.UI.Page 
{ 
    string[] pictures = { "~/createWii.jpg", 
           "~/DKC4_wii.png", 
           "~/Donkey-Kong-Country-1.jpg", 
           "~/DSCallOfDutyBlackOps.jpg", 
           "~/DSPreviewsCodmw2.jpg", 
           "~/DSPreviewsAliceInWonderLAnds.jpg", 
           "~/DSPreviewPicross3d.jpg", 
           "~/createii.jpg", 
         }; 
string[] picturesNames = { "picture1", "picture2", "picture3", "picture4", "picture5", "picture6", "picture7", "picture8" }; 

protected void Page_Load(object sender, EventArgs e) 
{ 
    for (int i = 0; i < pictures.Length; i++) 
    { 
      ListBox1.Items.Add(new ListItem(picturesNames[i],pictures[i])); 
    } 

    Image1.ImageUrl = "~/Donkey-Kong-Country-1.jpg"; 


    ListBox1.DataSource = picturesNames; 
    ListBox1.DataBind(); 
} 
protected void ListBox1_SelectedIndexChanged(object sender, EventArgs e) 
{ 
    Image1.ImageUrl = pictures[ListBox1.SelectedIndex];// it tells me that there is index out of range each time. why ? 
} 

}

+0

이 질문에 대해서는 클라이언트 쪽 코드를 사용하는 것이 좋습니다. 실제로 이미지를 스왑하는 데는 전체 포스트 백이 필요하지 않습니다. 구글은 "jQuery 이미지 슬라이더"에 대한 자세한 내용을 볼 수 있습니다. –

답변

2

몇 일 것 같지 않습니다.

1) 당신이를 Page_Load에서 코드를 포장해야

if(!IsPostback) 

2)은 "AutoPostBack은"속성은 목록 상자에 true로 설정되어있는 .ASPX에 있는지 확인하십시오!

주석의 요청에 따라

편집이 필요한 이유는 두 배입니다.

  1. ASP.NET ViewState를 사용하면 정보가 한 번만 바인딩되어 있는지 확인하기 위해 !IsPostback 조건을 사용할 수 있습니다, 따라서 다시 게시 값의 지속성을 처리합니다. 이렇게하면 장래에 '이상한'현상이 나타나지 않습니다.

  2. 기본적으로 사용자가 선택 항목을 변경하면 ListBoxes/DropDownLists/etc가 자동으로 다시 게시되지 않습니다. 따라서 실제로 이벤트를 트리거하려면 포스트 백을 수행하는 버튼이 필요하거나 사용자가 서버 쪽 코드를 트리거하도록 변경 한 경우이를 보장하기 위해 "AutoPostback"속성을 업데이트해야합니다.

+0

와우. 그것은 효과가 있었다. 하지만 왜 내 페이지를 if (! ispostback)에 넣어야 했습니까? 왜 작동하게 만들었습니까? –

+0

두 가지 제안에 대한 이유를 설명해 드렸습니다. –