← Desenvolvimento

[Javascript] O DOM e problemas em mostrar uma imagem

Lida 2552 vezes

Offline

Nazgulled 
Membro
Mensagens 552 Gostos 0
Troféus totais: 29
Trófeus: (Ver todos)
Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Poll Starter Level 5 Level 4 Level 3 Level 2

Estou a tentar mostrar um pequeno texto e uma imagem animada assim que o utilizador pressionar o botão de um formulario que irá enviar um ficheiro para o servidor atraves de PHP, no meu script nzFotolog. E estou com uns problemas a usar o DOM, javascript não é o meu forte, mas lá vou dando uns toques... Imaginem que estão a enviar um ficheiro grande e ainda irá demorar uns segundos (ou minutos) a enviar o ficheiro para o servidor. Durante esse tempo pretendo mostrar um pequeno popup no centro da pagina a notificar o utilizador que algo esta a ser enviado para o servidor e juntamente com um gif animado. Tudo isto esta definido no css.

Eu tenho a função SubmitTest() associada ao click do botão que submete o form e esta função irá devolver "verdadeiro" para o form ser submetido, se for devolvido "falso" o form não será submetido (já vão entender para que disse isto).

A função é a seguinte:
Código: [Seleccione]
function SubmitTest() {
var W3CDOM = (document.getElementsByTagName && document.createElement);
var message = document.forms['newimage'].elements['upmessage'].value;

if (W3CDOM) {
/*var upImg = document.createElement('img');
upImg.setAttribute("src", "uploading.gif");*/

var upDiv = document.createElement('div');
upDiv.id = "popup-uploading-bg";
upDiv.innerHTML = "<div id=\"popup-global-msg\">" +
 "<div class=\"popup-icon\"><img src=\"uploading.gif\" height=\"32\" width=\"32\" alt=\"\" /></div>" +
 "<div class=\"popup-text\">" + message + "<\/div>" +
 "</div>";

var loadDiv = document.getElementById('popup-loader-bg');
document.body.insertBefore(upDiv, loadDiv);
}

return true;
}


Este código está quase a funcionar na totalidade... Imaginem que no fim em vez de retornar "verdadeiro", retorno "falso", o form não irá ser submetido. Neste caso particular, a função funciona a 100%, mas se retornar "verdadeiro", que é o que pretendemos obviamente, a função não funciona totalmente. O que falha é a imagem. Não sei porquê, mas a imagem não é carregada.

Imaginem que a cache do browser está limpa. Se eu submeter o form, o meu popup irá parecer conforme o design especificado no css, a mensagem também irá aparecer, mas a imagem não foi carregada. Se eu abrir a imagem no browser directamente, carregando assim a imagem para a cache e posteriormente submeter o form, a imagem já sera disponibilizada mas não irá ser animada. Apenas permanece um frame fixo dela e não anima.

Foi aqui que pensei no seguinte... Estão a ver o codigo comentado na função? Tentei adicionar esse simples codigo que irá pré-carregar a imagem a ser mostrar, claro que o codigo n estava comentado, mas mesmo assim, não funciona, os resultados eram exactamente os mesmos.

Já tentei também o seguinte:
1) Criar a imagem usando o DOM em vez de simplesmente adicionar o HTML. Não resultou.
2) Usar a função no evento onSubmit do form em vez do onClick do botão de submissão. Não resultou.

Não consigo entender qual o problema aqui, será que existe por ai algum guru de DOM/JavaScript que me possa ajudar com este problema ou será que vou ter de esquecer esta ideia?
Offline

helt 
Membro
Mensagens 111 Gostos 0
Troféus totais: 25
Trófeus: (Ver todos)
Super Combination Combination Topic Starter Poll Voter Level 5 Level 4 Level 3 Level 2 Level 1 100 Posts

Bem, eu não percebo nada de javascript., mas o return true não deveria estar dentro do if? E o default da função não deveria ser false?
Offline

Nazgulled 
Membro
Mensagens 552 Gostos 0
Troféus totais: 29
Trófeus: (Ver todos)
Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Poll Starter Level 5 Level 4 Level 3 Level 2

Não e não.

Se fosse false, o formulario não iria ser submetido.
Offline

helt 
Membro
Mensagens 111 Gostos 0
Troféus totais: 25
Trófeus: (Ver todos)
Super Combination Combination Topic Starter Poll Voter Level 5 Level 4 Level 3 Level 2 Level 1 100 Posts

lol, desc mas realmente de javascript n pesco nada... confesso q até me estou a aproveitar para ver se começo a pescar alguma coisa   :mrgreen:
Ora mostra o que tens no onclick
Offline

Nazgulled 
Membro
Mensagens 552 Gostos 0
Troféus totais: 29
Trófeus: (Ver todos)
Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Poll Starter Level 5 Level 4 Level 3 Level 2

o onclick simplesmente chama a função acima, nada mais. se não pescas nada de javascript, esquece, o que eu tou aqui a perguntar já é algo um bocado avançado...
Offline

kingless 
Membro
Mensagens 857 Gostos 0
Troféus totais: 27
Trófeus: (Ver todos)
Super Combination Combination Topic Starter Poll Voter Poll Starter Level 5 Level 4 Level 3 Level 2 Level 1

@Nazgulled escreveste tanto sobre o teu problema e ninguém vai conseguir ajudar-te LOL
Offline

Nazgulled 
Membro
Mensagens 552 Gostos 0
Troféus totais: 29
Trófeus: (Ver todos)
Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Poll Starter Level 5 Level 4 Level 3 Level 2

eu qd tenho um problema, são problemas sérios que precisam de ser bem explicados para toda a gente entender sem ser necessario eu responder a duvidas... eu gosto de explicar tudo ao pormenor para entenderem a primeira e foi o que eu fiz.

anyway, eskeçam, ja resolvi... não como queria. usei uma tecnica completamente diferente sem usar o DOM tão avançado.
Offline

kingless 
Membro
Mensagens 857 Gostos 0
Troféus totais: 27
Trófeus: (Ver todos)
Super Combination Combination Topic Starter Poll Voter Poll Starter Level 5 Level 4 Level 3 Level 2 Level 1

Citação de: "Nazgulled"
eu qd tenho um problema, são problemas sérios que precisam de ser bem explicados para toda a gente entender sem ser necessario eu responder a duvidas... eu gosto de explicar tudo ao pormenor para entenderem a primeira e foi o que eu fiz.

anyway, eskeçam, ja resolvi... não como queria. usei uma tecnica completamente diferente sem usar o DOM tão avançado.

Estava apenas no gozo :wink:  Fazes muito bem em explicar os teus problemas ao pormenor.
Offline

Pure_Water 
Membro
Mensagens 515 Gostos 0
Troféus totais: 27
Trófeus: (Ver todos)
Super Combination Combination Topic Starter Poll Voter Level 5 Level 4 Level 3 Level 2 Level 1 500 Posts

kingless engates é por PM :P
Offline

kingless 
Membro
Mensagens 857 Gostos 0
Troféus totais: 27
Trófeus: (Ver todos)
Super Combination Combination Topic Starter Poll Voter Poll Starter Level 5 Level 4 Level 3 Level 2 Level 1

Citação de: "Pure_Water"
kingless engates é por PM :P

Também estas no gozo por isso tinhas que me enviar por PM também  :lol: