Ajuda com calculo em formulario

Gabriel Gois · Junho 7, 2011

Peguei um job aqui na Australia de uma escola de Ingles

Eles querem que ao preencher todo o formulario já apareca o valor total de quanto se pagaria para depois aplicar o form.

So que não sei como fazer.

Meu form:

<form action="envia_form.php" method="post" enctype="multipart/form-data" name="form1" id="form1">
<fieldset style="width:400px">
<legend>Latin America</legend>
<br />
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="2">
<tr bgcolor="#0E59AA">
<td colspan="2"><div align="center"><font size="4"><strong><font color="#FFFFFF" face="Arial, Helvetica, sans-serif">Online Application</font></strong></font></div></td>
</tr>
<tr>
<td width="136" bgcolor="#0691C1"><font color="#FFFFFF">First Name</font></font></td>
<td width="258"><label for="textfield"></label>
<input type="text" name="textfield" id="textfield" /></td>
</tr>
<tr>
<td bgcolor="#0691C1"><font color="#FFFFFF">Middle Name</font></font></td>
<td><label for="textfield2"></label>
<input type="text" name="textfield2" id="textfield2" /></td>
</tr>
<tr>
<td bgcolor="#0691C1"><font color="#FFFFFF">Last Name</font></font></td>
<td><label for="textfield3"></label>
<input type="text" name="textfield3" id="textfield3" /></td>
</tr>
<tr>
<td bgcolor="#0691C1"><font color="#FFFFFF">Date of Birth</font></font></td>
<td><label for="textfield4"></label>
<label for="select6"></label>
<label for="textfield4"></label>
<span id="sprytextfield3">
<input type="text" name="textfield4" id="textfield4" />
<span class="textfieldRequiredMsg">A value is required.</span><span class="textfieldInvalidFormatMsg">Invalid format.</span></span>
<label for="select7"></label>
<label for="select8"></label></td>
</tr>
<tr>
<td bgcolor="#0691C1"><font color="#FFFFFF">Gender</font></font></td>
<td><label for="select6"></label>
<select name="select6" id="select6">
<option>--Select--</option>
<option>Male</option>
<option>Female</option>
</select></td>
</tr>
<tr>
<td bgcolor="#0691C1"><font color="#FFFFFF">Email</font></font></td>
<td><label for="textfield5"></label>
<input type="text" name="textfield5" id="textfield5" /></td>
</tr>
<tr>
<td bgcolor="#0691C1"><font color="#FFFFFF">Your Visa Details</font></font></td>
<td><label for="select"></label>
<select name="select" id="select">
<option selected="selected">--Select--</option>
<option>Visitor Visa</option>
<option>Student Visa</option>
<option>Working Holiday Visa</option>
</select></td>
</tr>
<tr>
<td bgcolor="#0691C1"><font color="#FFFFFF">When would you like to start your course?</font></font></td>
<td><label for="select2"></label>
<select name="select2" id="select2">
<option selected="selected">--Month--</option>
<option>January</option>
<option>February</option>
<option>March</option>
<option>April</option>
<option>May</option>
<option>June</option>
<option>July</option>
<option>August</option>
<option>September</option>
<option>October</option>
<option>November</option>
<option>December</option>
</select>
<label for="select3"></label>
<select name="select3" id="select3">
<option value="0">--Year--</option>
<option>2011</option>
<option>2012</option>
<option>2013</option>
<option>2014</option>
<option>2015</option>
</select></td>
</tr>
<tr>
<td bgcolor="#0691C1"><font color="#FFFFFF">Choose your course</font></font></td>
<td>
<label for="select5"></label>
<select name="select5" id="select5">
<option selected="selected">--Select--</option>
<option>Business English</option>
<option>English for Academic Purpose (EAP)</option>
<option>General Intensive English</option>
<option>IELTS</option>
</select>
<br />
</td>
</tr>
<tr>
<td bgcolor="#0691C1"><font color="#FFFFFF">Period</font></font></td>
<td><label for="select9"></label>
<select name="select8" id="select9">
<option selected="selected">--Select--</option>
<option>Morning</option>
<option>Evening</option>
</select></td>
</tr>
<tr>
<td bgcolor="#0691C1"><font color="#FFFFFF">How many weeks?</font></font></td>
<td><label for="select10">
<select name="select9" id="select8">
<option>--Select--</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
<option>13</option>
<option>14</option>
<option>15</option>
<option>16</option>
<option>17</option>
<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>
<option>51</option>
<option>52</option>
</select>
</label></td>
</tr>
<tr>
<td bgcolor="#0691C1"><font color="#FFFFFF">Preparation Course For the Cambrigde Exams</font></font> <img src="exclamation.png" alt="" width="14" height="14" onmouseover="alert('If you choose first selection go to the next step. These courses have certain weeks can not be changed')"
href="" /></td>
<td><label for="select11"></label>
<select name="select10" id="select11">
<option selected="selected">--Select--</option>
<option>Preliminary English Test (PET)</option>
<option>First Certificate in English (FCE)</option>
<option>Certificate in Advanced English (CAE)</option>
</select></td>
</tr>
<tr>
<td bgcolor="#0691C1"><font color="#FFFFFF">How many weeks?</font></font></td>
<td><label for="select12"></label>
<select name="select11" id="select12">
<option selected="selected">--Select--</option>
<option>10 per $2.300</option>
<option>12 per $2.760</option>
</select></td>
</tr>
<tr>
<td bgcolor="#0691C1"><font color="#FFFFFF">Enrolment Fee</font></font></td>
<td><label for="select7"></label>
<select name="select7" id="select7">
<option selected="selected">--Select--</option>
<option>Student Visa $200</option>
<option>Other Visa $150</option>
</select></td>
</tr>
<tr>
<td bgcolor="#0691C1"><font color="#FFFFFF">Materials Fees</font></font></td>
<td>
<label for="select4"></label>
<select name="select4" id="select4">
<option selected="selected">--Select--</option>
<option>2-4 weeks $60</option>
<option>5-8 weeks $ 90</option>
<option>9-12 weeks $120</option>
<option>13-24 weeks $ 150</option>
<option>25 + weeks $180</option>
</select>
<br />
</td>
</tr>
<tr>
<td bgcolor="#0691C1"><font color="#FFFFFF">OSHC</font></font></td>
<td>$ 35 per Month</td>
</tr>
<tr>
<td bgcolor="#0691C1"><font color="#FFFFFF">Acommodation</font></font></td>
<td><input type="radio" name="radio3" id="radio3" value="radio3" />
<label for="radio3"></label>
Yes
<input type="radio" name="radio" id="radio" value="radio" />
<label for="radio"></label>
No</td>
</tr>
<tr>
<td bgcolor="#0691C1"><font color="#FFFFFF">Airport Pick up</font></font></td>
<td><input type="radio" name="radio4" id="radio4" value="radio4" />
<label for="radio4"></label>
Yes
<input type="radio" name="radio2" id="radio2" value="radio2" />
<label for="radio2"></label>
No</td>
</tr>
<tr></tr>
<tr>
<td align="right" valign="right" bgcolor="#0691C1"><font color="#FFFFFF"><strong>TOTAL</strong></font></font></td>
<td align="center" valign="middle">&nbsp;</td>
</tr>
<tr>
<td colspan="2" align="center" valign="middle"><em><font size="2">All informations will be checked and confirmed by email</font></em></td>
</tr>
<tr>
<td colspan="2" align="center" valign="middle"><input type="reset" name="limpar" id="limpar" value="Clear" />
<input type="submit" name="enviar" id="enviar" value="Apply" /></td>
</tr>
</table>
</fieldset>
</form>[/codebox]

Editado Junho 10, 2011 por fercosmig
add tag's

fercosmig · Junho 10, 2011

olha um exemplo meia boca ae.. precisa adaptar e corrigir uns probleminhas

<html>
<head>
<script language="JavaScript" type="text/javascript">
<!--//
var v_soma = 0;
function soma(valor,campo,res){
    
    var obj_campo = document.getElementById(campo);
    var obj_res = document.getElementById(res);
    
    if (isNaN(valor)){
        alert('valor inválido!');
        obj_campo.value = '';
        obj_campo.focus();
        return;
    }
    
    v_soma += eval(valor);
    obj_res.value = v_soma;    
}

//-->
</script>
</head>

<body>

valor 1: <input type="text" name="txt1" id="t1" onBlur="soma(this.value,this.id,'t6');" />
<br />
valor 2: <input type="text" name="txt2" id="t2" onBlur="soma(this.value,this.id,'t6');"/>
<br />
valor 3: <input type="text" name="txt3" id="t3" onBlur="soma(this.value,this.id,'t6');"/>
<br />
valor 4: <input type="text" name="txt4" id="t4" onBlur="soma(this.value,this.id,'t6');"/>
<br />
valor 5: <input type="text" name="txt5" id="t5" onBlur="soma(this.value,this.id,'t6');"/>
<hr>
soma: <input type="text" name="txt6" id="t6" />

</body>
</html>

Entrar

Ajuda com calculo em formulario

Pergunta

Gabriel Gois

Link para o comentário

Compartilhar em outros sites

1 resposta a esta questão

Posts Recomendados

fercosmig

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades