Abertura de DIV ao enviar formulário

[Webmater Felipe Edwards 0]

Olá pessoal,

 

Tenho uma dúvida que é a seguinte:

Possuo um formulário que contém um campo de upload(form.php) e outra página que recebe os dados enviados(cadastrado.php). O Objetivo do formulário é enviar as informações para o banco de dados e fazer upload para uma pasta do arquivo que foi captado pelo Input "FILE".

 

o que quero fazer é o seguinte, quando eu der um submit no formulário ele abrir uma div informando que está enviando o arquivo do input "File" enquanto a pagina processa a informação para ser passada para a pagina cadastrado.php.

 

Alguém poderia me ajudar ? Sou novo na área e não tenho menor ideia de como fazer isso. Abaixo coloco o codigo fonte para tentarem me ajudarem galera, fico grato a todos que me ajudarem.

Abraços:

<table width="584" border="0">
    <tr>
      <td width="170" height="21"><span class="style1">Nome:</span></td>
      <td width="404"><span class="style1">
        <input name="nome" type="text" id="nome" size="30" />
      </span></td>
    </tr>
        <tr>
      <td height="21"><span class="style1">Idade:</span></td>
      <td><select name="idade" id="idade">
        <option>18</option>
        <option>19</option>
        <option>20</option>
        <option>21</option>
        <option>22</option>
        <option>23</option>
        <option>24</option>
        <option>25</option>
        <option>26</option>
        <option>27</option>
        <option>28</option>
        <option>29</option>
        <option>30</option>
        <option>31</option>
        <option>32</option>
        <option>33</option>
        <option>34</option>
        <option>35</option>
        <option>36</option>
        <option>37</option>
        <option>38</option>
        <option>39</option>
        <option>40</option>
        <option>41</option>
        <option>42</option>
        <option>43</option>
        <option>44</option>
        <option>45</option>
        <option>46</option>
        <option>47</option>
        <option>48</option>
        <option>49</option>
        <option>50</option>
      </select></td>
    </tr>
        <tr>
      <td height="21"><span class="style1">Telefone de Contato:</span></td>
      <td><span class="style1">
        <input name="fone" type="text" id="fone" size="12" />
      </span><span class="style2">      Insira com o DDD(ex: 61 xxxx-xxxx)</span></td>
    </tr>
    <tr>
      <td height="21"><span class="style1">Altura:</span></td>
      <td><span class="style1">
        <input name="altura" type="text" id="altura" size="10" />
      </span></td>
    </tr>
    <tr>
      <td height="21"><span class="style1">Peso:</span></td>
      <td><span class="style1">
        <input name="peso" type="text" id="peso" size="8" />
        KG</span></td>
    </tr>
    <tr>
      <td height="21"><span class="style1">Cor dos Olhos:</span></td>
      <td><span class="style1">
        <select name="cor_dos_olhos" id="cor_dos_olhos">
          <option>Selecione</option>
          <option value="Pretos">Pretos</option>
          <option value="Castanho">Castanho</option>
          <option value="Azul">Azul</option>
          <option value="Azul Claro">Azul Claro</option>
          <option value="Verde Claro">Verde Claro</option>
          <option value="Verde Escuro">Verde Escuro</option>
        </select>
      </span></td>
    </tr>
    <tr>
      <td height="21"><span class="style1">Cor dos Cabelos:</span></td>
      <td><span class="style1">
        <select name="cor_dos_cabelos" id="cor_dos_cabelos">
          <option>Selecione</option>
          <option value="Pretos">Pretos</option>
          <option value="Loiros">Loiros</option>
          <option value="Castanho">Castanho</option>
          <option value="Ruivo">Ruivo</option>
        </select>
      </span></td>
    </tr>
    <tr>
      <td height="21"><span class="style1">Idioma:</span></td>
      <td><span class="style1">
        <select name="idiomas" id="idiomas">
          <option>Selecione</option>
          <option value="Português">Português</option>
          <option value="Inglês">Inglês</option>
          <option value="Espanhol">Espanhol</option>
          <option value="Italiano">Italiano</option>
        </select>
      </span></td>
    </tr>
    <tr>
      <td height="21"><span class="style1">Horario de Atendimento:</span></td>
      <td><span class="style1">
        <select name="horario_de_atendimento" id="horario_de_atendimento">
          <option value="Manhã">Manhã</option>
          <option value="Tarde">Tarde</option>
          <option value="Noite">Noite</option>
          <option value="24 Horas">24 Horas</option>
          <option value="Segunda a Sexta">Segunda a Sexta</option>
          <option value="Segunda a Sábado">Segunda a Sábado</option>
          <option value="Finais de Semana">Finais de Semana</option>
          <option value="Todos os Dias">Todos os Dias</option>
        </select>
      </span></td>
    </tr>
    <tr>
      <td height="21"><span class="style1">Disponivel para Viagens:</span></td>
      <td><span class="style1">
        <select name="disponivel_para_viagens" id="disponivel_para_viagens">
          <option value="Sim">Sim</option>
          <option value="Não">Não</option>
          <option value="A Combinar">A Combinar</option>
        </select>
      </span></td>
    </tr>
    <tr>
      <td height="21"><span class="style1">Cachê por uma hora:</span></td>
      <td><span class="style1">
        <input name="cache_por_hora" type="text" id="cache_por_hora" size="15" maxlength="4" />
        reais</span></td>
    </tr>
  </table>

 

[angelorubin 142]

Bom dia,

Você pode utilizar o jQuery e o jQuery UI dialog para lhe ajudar com isso.

Veja um exemplo aqui - http://jsfiddle.net/angelorubin/Ahg3Z

Ou ainda com uma modal do framework twitter bootstrap - http://getbootstrap.com/javascript/#modals

Espero que ajude.

[Webmater Felipe Edwards 0]

Obrigado amigo Angelorubin,

 

Me ajudou bastante cara obrigado mesmo.

 

São pessoas assim como você, que colaborando ensinam outros inciantes a aprenderem melhor.

 

Obrigado mesmo cara.

Sucesso.