none
Mudar imagem dinamicamente sem dar refresh RRS feed

  • Pergunta

  • Olá senhores, tenho o seguinte problema... Quero mudar a imagem em um formulário de cadastro quando o usuário fazer o upload de uma imagem.

    Eu tenho um um UploadControl e com ele eu consigo mover a imagem para uma determinada página... 

      <dx:ASPxUploadControl ID="upload" runat="server" ShowUploadButton="True" Width="186px" ClientInstanceName="upload" OnFileUploadComplete="upload_FileUploadComplete">
                        <ClientSideEvents FileUploadComplete="function(s, e) { // não funciona -> imagem.Visible = false;
                         //funciona -> alert('FileUploadComplete: ' + e.callbackData);
    
     }" TextChanged="function(s, e) {
    	s.Upload();
    }" />
                        <BrowseButton Text="Procurar...">
                        </BrowseButton>
                        <UploadButton Text="Carregar">
                        </UploadButton>
                        <ValidationSettings AllowedFileExtensions=".jpg, .png" GeneralErrorText="Tipo de imagem nãp permitida." MaxFileSizeErrorText="O tamanho passou do limite." MultiSelectionErrorText="Tipo de imagem nãp permitida." NotAllowedFileExtensionErrorText="Tipo de imagem nãp permitida.">
                        </ValidationSettings>
    
                      </dx:ASPxUploadControl>

    Em cima eu tenho um AspxImage que eu quero mudar assim que completar o upload...

    <dx:ASPxImage ID="imagem" ClientInstanceName="imagem" runat="server" Height="227px" ImageUrl="~/Images/foto_mol.png" Width="184px" />

    No C# eu tenho um método que move a imagem...

    protected void upload_FileUploadComplete(object sender, DevExpress.Web.ASPxUploadControl.FileUploadCompleteEventArgs e)
        {
          e.CallbackData = SaveFile(e.UploadedFile);
    
    
        }
    
        protected string SaveFile(UploadedFile uploadedFile)
        {
          string fileName = string.Empty;
          if (uploadedFile.IsValid)
          {
            //esses 2 comando eu fiz pra testar,mas não funciona
            DevExpress.Web.ASPxEditors.ASPxImage imgEmpresa = (DevExpress.Web.ASPxEditors.ASPxImage) gdpessoas.FindEditFormTemplateControl("imagem");
            imgEmpresa.Visible = false;
            
    
            fileName = string.Format("{0}{1}", MapPath("~/"), uploadedFile.FileName);
            if (File.Exists(fileName))
              File.Delete(fileName);
            //uploadedFile.SaveAs(fileName); //uncomment this line
          }
          return uploadedFile.FileName;
        }
    

    O que eu poderia fazer nessa situação ?

    Eu estou seguindo esse exemplo http://www.devexpress.com/Support/Center/Example/Details/E2531 ele faz o upload automaticamente da imagem...

    quarta-feira, 2 de janeiro de 2013 19:46

Respostas

  • Olá senhores, tenho o seguinte problema... Quero mudar a imagem em um formulário de cadastro quando o usuário fazer o upload de uma imagem.

    Eu tenho um um UploadControl e com ele eu consigo mover a imagem para uma determinada página... 

      <dx:ASPxUploadControl ID="upload" runat="server" ShowUploadButton="True" Width="186px" ClientInstanceName="upload" OnFileUploadComplete="upload_FileUploadComplete">
                        <ClientSideEvents FileUploadComplete="function(s, e) { // não funciona -> imagem.Visible = false;
                         //funciona -> alert('FileUploadComplete: ' + e.callbackData);
    
     }" TextChanged="function(s, e) {
    	s.Upload();
    }" />
                        <BrowseButton Text="Procurar...">
                        </BrowseButton>
                        <UploadButton Text="Carregar">
                        </UploadButton>
                        <ValidationSettings AllowedFileExtensions=".jpg, .png" GeneralErrorText="Tipo de imagem nãp permitida." MaxFileSizeErrorText="O tamanho passou do limite." MultiSelectionErrorText="Tipo de imagem nãp permitida." NotAllowedFileExtensionErrorText="Tipo de imagem nãp permitida.">
                        </ValidationSettings>
    
                      </dx:ASPxUploadControl>

    Em cima eu tenho um AspxImage que eu quero mudar assim que completar o upload...

    <dx:ASPxImage ID="imagem" ClientInstanceName="imagem" runat="server" Height="227px" ImageUrl="~/Images/foto_mol.png" Width="184px" />

    No C# eu tenho um método que move a imagem...

    protected void upload_FileUploadComplete(object sender, DevExpress.Web.ASPxUploadControl.FileUploadCompleteEventArgs e)
        {
          e.CallbackData = SaveFile(e.UploadedFile);
    
    
        }
    
        protected string SaveFile(UploadedFile uploadedFile)
        {
          string fileName = string.Empty;
          if (uploadedFile.IsValid)
          {
            //esses 2 comando eu fiz pra testar,mas não funciona
            DevExpress.Web.ASPxEditors.ASPxImage imgEmpresa = (DevExpress.Web.ASPxEditors.ASPxImage) gdpessoas.FindEditFormTemplateControl("imagem");
            imgEmpresa.Visible = false;
            
    
            fileName = string.Format("{0}{1}", MapPath("~/"), uploadedFile.FileName);
            if (File.Exists(fileName))
              File.Delete(fileName);
            //uploadedFile.SaveAs(fileName); //uncomment this line
          }
          return uploadedFile.FileName;
        }

    O que eu poderia fazer nessa situação ?

    Eu estou seguindo esse exemplo http://www.devexpress.com/Support/Center/Example/Details/E2531 ele faz o upload automaticamente da imagem...

    Se eu não me engano o controle AspxImage possui o evento Init, você pode tentar mapear esse evento e alterar por lá através da propriedade ImageUrl.

    imagem.ImageUrl = "CaminhoDaNovaImagem.Extensao";



    Leonardo Lourenço Silva

    sexta-feira, 4 de janeiro de 2013 03:45