essa eu quero ver...

[brunoww 0]

pessoal,

estou fazendo um sisteminha aqui,

e estou usando o codigo do pita para o ajax com formulario e link,

mais me deparei de um formulario com envio de arquivos "<input type="file">", bom, com o codigo do pita, não ocorre o envio, pois quando aperta no botao do formulario, muda de pagina não avendo tempo para o upload.

 

Como eu posso ter o formulario de envio de arquivo(input type file), que mude de pagina com o ajax, dentro de uma div?

 

Eu vi em outros forums, que tem que dar o submit na form, antes do ajax.. algo assim. se alguem souber dessa...

 

Valeuuu!!

[Tiago_Ribeiro 0]

Nunca tentei, por nao ter necessidade disso, mais tive olhando... Acredito que pelo ajax nao consigam ainda...Nao sei dizer se e verdade.. mais vou testar.. e posto ai que deu..Valeu..

[brunoww 0]

eu bto fe que tipo, quando se usa o ajax no botao, a pagina muda, ai nao da tempo para dar o envio da foto, saca? tem que dar o submit, se tiver alguma funcao javascript que bloqueia a funcao saca?ai botavadocument.form.submit();bloqued(document.form.submit()) ;alguma coisa assimmais eh f***....se alguem souber..abracos

[Fleury 3]

Rapaiz, de todos os assuntos de javascript, acho esse o mais complicado. Tanto acho que até hoje não conseguir aprender uma forma de fazer upload de arquivos para qualquer tipo de linguagem, seja asp, seja php ou qualquer outra.Bem, nessa eu fico te devendo =(mas você pode tentar usando iframes. Faz uma pesquisa no forum.Abraços, t+

[brunoww 0]

é, foi o que eu utilizei.. eu vireiii o codigo para conseguir fazer upload com ajax mais eh mtooo f***, PARECE impossivel..!! fiz com iframe mesmo.

 

Pra quem nao ta acompanhando o topico, como eu fiz o upload com o ajax.

 

na pagina com o div (div_layer), tem o formulario e um div (processo) que fica embaixo do form,

quando a pessoa aperta no btn, da submit na form normalmente maiss com o <form target="iframe">) um iframe de 1px x 1px), na lay processo mostra o texto: "Aguarde, Carregando arquivos...", e desabilita o botão de enviar do formulario, já no arquivo de envio(PHP, ASP etc.) quando enviar o arquivo, no codigo do iframe você bota: parent.getElementyById('div_layer').InnerHTML = "Enviado Com sucesso";

 

e pronto x)

valeu ae moçada.. upload com ajax eh f*** msm..

abracaoo

[Pita 53]

Bruno, semana passada eu tinha feito uma alteração para consertar um problema de limpar o div do formulario antes de enviar as informações. Eu não cheguei a trabalhar com envio de arquivo pelo ajax pq pra mim o ajax tem algo que seja transparente para o cliente e o envio de arquivo leva muito tempo e mata essa minha idéia, vou ver umas aplicações em asp que eu fiz e tentar alterar meu código para enviar arquivo tb.Não garanto nada por enquanto, mas vamos ver o que podemos fazer

[Lab Design 0]

Bruno, dá pra fazer upload sim dentro do ajax so que as coisas mudam um pouquinho.

function goajax(page)

{

theRequest = false;

 

if(window.XMLHttpRequest)

{

theRequest = new XMLHttpRequest();

if(theRequest.overrideMimeType)

{

theRequest.overrideMimeType('text/xml');

}

}

else if(window.ActiveXObject)

{

try

{

theRequest = new ActiveXObject("Msxml2.XMLHTTP");

} catch (e) {

try

{

theRequest = new ActiveXObject("Microsoft.XMLHTTP");

} catch (e) {}

}

}

if(!theRequest)

{

alert('Your upload is in progress and will probably complete successfully, but your browser cannot display the progress bar (most likely because it is too old). Please wait while your upload completes.');

return false;

}

 

theRequest.onreadystatechange = updateProgress;

theRequest.open('POST', page, true);

theRequest.setRequestHeader("Content-type", "multipart/form-data");

theRequest.send(null);

}

 

 

 

 

Parte inicial que cria o objeto ajax

 

 

essa função é acionada pelo botão submit do form

 

function startupload()

{

document.getElementById('theuploadform').submit();

document.getElementById('progressMeter').style.position = 'relative';

document.getElementById('progressMeter').style.left = '0';

document.getElementById('progressMeter').style.height = 'auto';

document.getElementById('progressMeterText').innerHTML = 'upload in progress: 0%';

document.getElementById('uploadbutton').disabled = true;

 

 

 

document.getElementById('theuploadform').style.position = 'absolute';

document.getElementById('theuploadform').style.left = '-10000px';

document.getElementById('theuploadform').style.overflow = 'hidden';

document.getElementById('theuploadform').style.height = '0';

 

var timeout = navigator.userAgent.indexOf("Safari") == -1 ? 1200 : 5200;

window.setTimeout("goajax('upLoad.php?action=1')", timeout);

}

 

 

Parte do onreadystate

function updateProgress()

{

if(theRequest)

{

if(theRequest.readyState == 4)

{

if(theRequest.status == 200)

{

 

 

var update = new Array();

update = theRequest.responseText.split('|');

 

if(update[1] != 0)

{

total_upload_size = update[1];

}

 

if(update[5] == 'toobig')

{

location.href="http://encodable.com/uploaddemo/?error=toobig&size=" + total_upload_size;

}

 

var completed_upload_size = update[0];

var elapsedtime = update[2];

var numfinishedfiles = update[3];

var numtotalfiles = update[4];

...

infelizmente tive que colocar so parte do tratamento porque é muito longo e faz chamadas a arquivos cgi então não tem nem como depurar essa parte mas veja que o sistema fica em loop ou seja, no final da função readystate, chama novamente o goajax so que agora passando outros parametros.

 

//window.setTimeout("goajax('ajaxUpLoad.php?items=1&action=get_progress_and_size')", 700);

window.setTimeout("goajax('upLoad.php?upload=1&action=1')", 700);

}

else

{

alert('Error: got a not-OK status code...');

}

}

}

}

 

 

 

parte de form

<FORM id=theuploadform name=theuploadform

action=""

method=post encType=multipart/form-data>

<input type="hidden" name="MAX_FILE_SIZE" value="8000000" />

<DIV id=intro>

<DIV style="MARGIN-TOP: 17px">This is a demo of <A

href="http://encodable.com/filechucker/" target=_blank>FileChucker</A>. The idea

is that you pick any large-ish (2MB or so) file from your system and upload it,

to see the realtime progress bar and data-transfer-meters in action. You can <A

href="http://encodable.com/filechucker/" target=_blank>get a copy of

FileChucker</A> to put on your own site. Note: all uploaded files are

automatically deleted after a few hours.</DIV></DIV>

<DIV id=setfilecount>Number of files to upload:   <SELECT id=itemcount

name=itemcount> <OPTION value=1 selected>1</OPTION> <OPTION value=2>2</OPTION>

<OPTION value=3>3</OPTION> <OPTION value=4>4</OPTION> <OPTION

value=5>5</OPTION></SELECT>   <INPUT class=defaultbutton onclick=update_form_fields() type=button value=Apply name=updateformfields>

</DIV>

<DIV id=filefields>

<DIV class="odd formfields">

<DIV>File 1 of 1: <INPUT class=default type=file name=uploadname1></DIV>

<DIV>Upload to: <SELECT name=subdir1> <OPTION value="toledo/folders/"

selected>/uploaddemo/files/</OPTION> <OPTION

</SELECT></DIV>

<DIV>New subdirectory? Name: <INPUT class=default maxLength=25

name=newsubdir1></DIV>

<DIV>(will be created inside the selected directory)</DIV></DIV></DIV><INPUT

type=hidden value=1 name=numitems> <INPUT id=uploadbutton onclick=startupload() type=button value="Begin Upload">

 

 

do lado do server php

$arquivo=$_FILES['uploadname1'];

print '<pre>';

print_r($_FILES);

print '</pre>';

 

move_uploaded_file($_FILES['uploadname1']['tmp_name'], "/var/www/html/toledo/folders/novoarquivo.tmp");

 

 

Arquivo demo baixado de: http://encodable.com/filechucker/

[Pita 53]

Uma pergunta sobre envio de arquivo,por padrão, pra mim, form = metodo post, não tem o que discutirMas é possivel enviar arquivo por Get??

[micox 2]

Não entendi direito o código anterior.Vou testar ainda.Mas ví um submit do formulário lá ué. (document.getElementById('theuploadform').submit();)Certeza que não carrega a página toda?

[Pita 53]

Eu estou alterando o ajax que eu uso para enviar arquivo, só não testei ainda, mas quando conseguir testar posto aqui o resultado :D