Случайное изображение в UpdateProgress

Question

У меня есть элемент управления мастера внутри панели обновления. Для отображения некоторых шагов мастера требуется несколько секунд, поэтому я хочу показать элемент updateprogress во время загрузки. Это работает, но я хотел бы показать другое изображение (случайное изображение, выбранное из папки) в шаблоне выполнения между каждым шагом мастера.

Я могу получить доступ к элементу управления изображением и изменить ImageUrl, но шаблон прогресса никогда не обновляется. Он сохраняет первое случайное изображение, выбранное с самой первой загрузки.

Я пытался обновить imageUrl в PageLoad, а также переопределить метод Render (), но ни один из них не работает.

<asp:UpdateProgress ID="UpdateProgress1" runat="server" DisplayAfter="500" >
    <ProgressTemplate>
        <div class="modalWrapper">
            <div class="updateProgress">
                <asp:Image ID="imgLoading" runat="server" AlternateText="Loading..." />
            </div>
        </div>
    </ProgressTemplate>
</asp:UpdateProgress>

В коде позади:

protected void Page_Load(object sender, EventArgs e)
{
 System.Web.UI.WebControls.Image img = (System.Web.UI.WebControls.Image)UpdateProgress1.FindControl("imgLoading");

    if (img != null)
        img.ImageUrl = PickImageFromDirectory("~/images/loaders/"); //returns "~/images/loaders/randomimage.gif"  
}

ТАКЖЕ ПРОБОВАН:

protected override void Render(HtmlTextWriter writer)
    {          
        System.Web.UI.WebControls.Image img = (System.Web.UI.WebControls.Image)UpdateProgress1.FindControl("imgLoading");

        if (img != null)                       
            img.ImageUrl = PickImageFromDirectory("~/images/loaders/"); //returns "~/images/loaders/randomimage.gif"

        base.Render(writer);
    }

Answer 1

Ваше изображение, скорее всего, не будет перезагружено, потому что UpdateProgress находится за пределами вашей UpdatePanel. Природа UpdatePanel заключается в том, что только элементы управления в нем обновляются по асинхронному запросу. =) * * Тысяча одна

Вот что вы можете сделать:

Измените PickImageFromDirectory на статический метод и пометьте его как WebMethod в коде:

[WebMethod]
public static string PickRandomImage()
{
   // Logic to return the full path to a random image
}

Затем на стороне клиента поместите следующий скрипт внизу:

<script type="text/javascript">
function requestEnded()
{
   PageMethods.PickRandomImage(imageSuccess, imageFailed);
}

function imageSuccess(result,ctx,methodName)
{
  document.getElementById('<%= imgLoading.ClientID %>').src = result;
}

function imageFailed(err,ctx,methodName)
{
  alert(err);
}

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(requestEnded);
</script>

После каждой асинхронной обратной передачи это вызовет ваш веб-метод на стороне сервера и установит для src изображения случайный URL. =)

Answer 2

Вы можете указать URL, который перейдет на страницу aspx:

<asp:Image runat="server" ImageUrl="GenerateImage.aspx"/>

В GenerateImage.aspx:

protected void Page_Load(object sender, EventArgs e)
    {
        Response.Clear();
        Response.ContentType = "image/jpeg";
        Response.Cache.SetCacheability(HttpCacheability.NoCache);
        Response.Write(GetRandomImageData());
        Response.End();
    }