PDA

View Full Version : Javascript Form Refresh Page



iprainwater
03-12-2010, 07:46 PM
Let me start out by saying I am creating this form for my department website, which is not on a server. It is located on a localized network drive. That being said, I cannot use PHP, ASP, etc... Since we all use the same computers, OS, web browser, etc... some of this coding might not be recommended in most situations but is all we can do.

Anyway, I created a form that uses Javascript so you can choose the recipient with a dropdown and then all of the fields will be email to the person. Now I am wanting the page to automatically refresh when it is submitted. I have tried all of the other suggestions I have found on the web but just doesn't seem to work with what I have. Any suggestions are highly appreciated!

[CODE]
<SCRIPT LANGUAGE="JavaScript">
<!--


function mailIt(form) {

for (var i=0; i < document.dataForm.BenTime.length; i++)
{
if (document.dataForm.BenTime[i].checked)
{
var Benefit_Time = document.dataForm.BenTime[i].value;
}
}


var data = document.dataForm
var userInfo = ""

// comment out the next line if you want to hardcode the reciepient
// then add 'foo@bar.com' to the 'mailform' action attribute
// (i.e. -- ACTION="mailto:foo@bar.com")
form.action += data.recipient.value

// comment out the next line if you want to hardcode the subject
// then add '?subject=example' to the 'mailform' action attribute.
// You must hardcode an address before you can hardcode a subject.
// (i.e. -- ACTION="mailto:foo@bar.com?subject=example")
form.action += "?subject=" + data.subject.value


form.Name.value = userInfo + data.Name.value
form.Dates.value = userInfo + data.Dates.value
form.Partial_or_Full.value = userInfo + data.Partial_or_Full.value
form.Hours_Taken.value = userInfo + data.Hours_Taken.value
form.Partial_Day_Time.value = userInfo + data.Partial_Day_Time.value
form.Benefit_Time.value = userInfo + Benefit_Time
form.Making_Up_Time.value = userInfo + data.Making_Up_Time.value
form.Reason.value = userInfo + data.Reason.value
return true

}
// -->
</SCRIPT>
[CODE]

and here is the two parts of the form

[CODE]
<table width="90%" cellspacing="10px">
<FORM NAME="dataForm">

<!-- DELETE THIS TABLE ROW IF YOU'RE HARDCODING A RECIPIENT -->
<tr>
<td><LABEL for=Name>Your Name:</LABEL></td>
<td><INPUT name=Name></td>
<td><LABEL for=recipient>Your Manager</LABEL></td>
<td><SELECT name="recipient"> <OPTION selected>
<OPTION name="recipient" value="xxx@example.com">John Doe0</OPTION>
<OPTION name="recipient" value="xxx@example.com">John Doe1</OPTION>
<OPTION name="recipient" value="xxx@example.com">John Doe2</OPTION>
<OPTION name="recipient" value="xxx@example.com">John Doe3</OPTION>
<OPTION name="recipient" value="xxx@example.com">John Doe4</OPTION>
<OPTION name="recipient" value="xxx@example.com">John Doe5</OPTION>
</SELECT><br />
</td>
</tr>

<tr>
<td><LABEL for=Dates>Dates Requested:</LABEL></td>
<td><INPUT name=Dates></td>

<td><LABEL for=Partial_or_Full>Partial/Full Day:</LABEL></td>
<td><SELECT name=Partial_or_Full>
<OPTION>
<OPTION value="Full">Full</OPTION>
<option value="In Late">In Late</option>
<option value="Leave Early">Leave Early</option> </SELECT></td>

</tr>

<tr>
<td><LABEL for=Hours_Taken>Total Hours Requested:</LABEL></td>
<td><INPUT name=Hours_Taken></td>

<td><LABEL for="Partial_Day_Time">Leave Early/In Late Time:</LABEL></td>
<td><INPUT name="Partial_Day_Time"></td>
</tr>


<!-- DELETE THIS TABLE ROW IF YOU'RE HARDCODING A SUBJECT -->

<tr>
<td><INPUT NAME="subject" value="Time Off Request" type="hidden"></td>
</tr>

<tr>
<td colspan="3">Reason:</td>
</tr>

<tr>
<td colspan="2"><TEXTAREA NAME="Reason" COLS=50 ROWS=8 WRAP=virtual></TEXTAREA></td>

<td colspan="2"><FIELDSET><LEGEND align=top>Choose Benefit Time to Be Used</LEGEND>
<input type="radio" name="BenTime" value=" Sick"><label for=" Sick">Sick</a><br />
<input type="radio" name="BenTime" value=" Vacation"><label for=" Vacation">Vacation</a><br />
<input type="radio" name="BenTime" value=" Floating"><label for=" Floating">Floating Holiday</a><br />

<LABEL for="Making_Up_Time">Making Up Any Time?:</LABEL> <INPUT name="Making_Up_Time">

</FIELDSET> </td>

</tr>
</FORM>



<FORM
NAME="mailForm"
ACTION="mailto:"
METHOD="post"
ENCTYPE="text/plain"
onSubmit="return mailIt(this)">

<INPUT TYPE="hidden" NAME="Name" VALUE="">
<INPUT TYPE="hidden" NAME="Dates" VALUE="">
<INPUT TYPE="hidden" NAME="Partial_or_Full" VALUE="">
<INPUT TYPE="hidden" NAME="Hours_Taken" VALUE="">
<INPUT TYPE="hidden" NAME="Partial_Day_Time" VALUE="">
<INPUT TYPE="hidden" NAME="Benefit_Time" VALUE="">
<INPUT TYPE="hidden" NAME="Making_Up_Time" VALUE="">
<INPUT TYPE="hidden" NAME="Reason" VALUE="">

<TR>
<TD>
<INPUT TYPE="submit" VALUE="Send Request">
</TR>
</FORM>
</TABLE>
[CODE]

The problem I am getting is whenever the form is filled out and submitted more than once without the page being refreshed each additional email adds "xxx@example.com?subject=Time Off Request" to the subject so the results of the subject are like this:

Try 1 - Time Off Request
Try 2 - Time Off Requestxxx@example.com?subject=Time Off Request
Try 3 - Time Off Requestxxx@example.com?subject=Time Off Requestxxx@example.com?subject=Time Off Request

and so on. So my first thought was to have it automatically refresh. But if anyone has any suggestions at all I would appreciate them. Thanks!

auriaks
03-12-2010, 07:51 PM
javascript is shown one time per page... If you use AJAX, then you can do this refresh easuly, but now - you must refresh your page with meta refresher...

It is just my opinion.

iprainwater
03-12-2010, 08:11 PM
javascript is shown one time per page... If you use AJAX, then you can do this refresh easuly, but now - you must refresh your page with meta refresher...

It is just my opinion.
Ok. I am a fairly new Javascript user, and honestly have never used AJAX. Would you care to explain a little more how I would implement AJAX in this code?

auriaks
03-12-2010, 08:21 PM
hmm, you want to refresh all the page or just a part? write me a link to your this file even if it doesn't exists.

iprainwater
03-12-2010, 08:28 PM
hmm, you want to refresh all the page or just a part? write me a link to your this file even if it doesn't exists.
S:\Chargebacks\Chargeback Website\New\Forms\TimeOff.html

Yes, I want to refresh the whole page

auriaks
03-12-2010, 08:30 PM
use this button to redirect you to the same page:

<a href="javascript:void()" onclick="location.href( 'TimeOff.html');"> Click here </a>

iprainwater
03-12-2010, 08:34 PM
use this button to redirect you to the same page:

<a href="javascript:void()" onclick="location.href( 'TimeOff.html');"> Click here </a>
The problem I am having is I need it to refresh when submitting the form. So I would need one button to both Send the information AND refresh the page with a single click.

auriaks
03-12-2010, 09:08 PM
function Work() {
//***here you must write your submit action, but write as this: return mailIt(this);
window.location="TimeOff.html";
}

<input type="button" value="Send" onclick="Work();" />

*** I don't know which part of your script executes information...