SitePoint Sponsor

User Tag List

Page 1 of 2 12 LastLast
Results 1 to 25 of 26
  1. #1
    SitePoint Enthusiast
    Join Date
    Dec 2004
    Location
    uk
    Posts
    41
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question How to reset all form fields when reloading/refreshing page?

    Hi Everyone.
    This is my first post on this forum. On first impression it seems to be a great resource with lots of knowledgeable folk but we will see

    Anyway, my problem is…
    I am using a JavaScript form which acts as an order form. The problem with this script is that if you select any of the check boxes and then click your browsers "refresh page" (not reset) button it will reset the price total on reload but will not clear the ticked boxes.

    Please view the form at: http://www.improvingfutures.co.uk/Sh.../shopping4.htm



    Basically all I need is a method to reset all form fields when the user reloads the page (clicking browser refresh)


    I would be extremely grateful if someone could provide a solution.

    Many thanks
    Dave.

  2. #2
    SitePoint Wizard
    Join Date
    Mar 2004
    Posts
    1,647
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    wellcome to sitepoint!!!
    for textfields..
    Code:
    function clearInp() {
    document.getElementsByTagName("input").value = "";
    }
    for checkboxes...
    Code:
    function clearChk() {
    for(var i = 0; i < document.myForm.myCheckboxes.lenght; i++) {
    document.myForm.myCheckboxes.checked = false;
    }
    }
    be sure that your checkboxes have the same name!
    then call the function with body onLoad
    cheers

  3. #3
    SitePoint Enthusiast
    Join Date
    Dec 2004
    Location
    uk
    Posts
    41
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    WOW!
    Rapid response.

    I will try it now.

    Thank you so much Octopus

  4. #4
    SitePoint Enthusiast
    Join Date
    Dec 2004
    Location
    uk
    Posts
    41
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    heres is a snippet for one of the check boxes, could you tell me how I change the code provided to work with this? Cheers

    Mail-Lite Padded Envelopes £12.39
    <input type="checkbox" name="Envelopes" value=12.39 onclick="this.form.total.value=CheckChoice(this);">

  5. #5
    SitePoint Wizard
    Join Date
    Mar 2004
    Posts
    1,647
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code:
    function clearChk() {
    for(var i = 0; i < document.YourFormName.Envelopes.lenght; i++) {
    document.YourFormName.Envelopes.checked = false;
    }
    }
    be sure that all checkboxes have the same name
    cheers

  6. #6
    SitePoint Enthusiast
    Join Date
    Dec 2004
    Location
    uk
    Posts
    41
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm Really sorry but I can't seem to work this 1 out.
    If I am taking up too much time I will understand if you can't offer further assistance.

    Below is a complete copy of the code.

    Any help would be fantastic. Cheers!

    </style>
    <SCRIPT LANGUAGE="JavaScript">
    function clearChk() {
    for(var i = 0; i < document.myform.Envelopes.length; i++) {
    document.myform.Envelopes.checked = false;
    }
    }
    </script>
    <SCRIPT LANGUAGE="JavaScript">

    <!-- Begin
    function CheckChoice(whichbox)
    {
    with (whichbox.form)
    {
    if (whichbox.type == "radio")
    {
    hiddentotal.value = eval(hiddentotal.value) - eval(hiddenpriorradio.value);
    hiddenpriorradio.value = eval(whichbox.price);
    hiddentotal.value = eval(hiddentotal.value) + eval(whichbox.price);
    }
    else
    {
    if (whichbox.checked == false)
    { hiddentotal.value = eval(hiddentotal.value) - eval(whichbox.value); }
    else { hiddentotal.value = eval(hiddentotal.value) + eval(whichbox.value); }
    }

    if (hiddentotal.value < 0)
    {
    InitForm();
    }

    return(formatCurrency(hiddentotal.value));
    }
    }

    function formatCurrency(num)
    {
    num = num.toString().replace(/\£|\,/g,'');
    if(isNaN(num))
    num = "0";
    sign = (num == (num = Math.abs(num)));
    num = Math.floor(num*100+0.50000000001);
    cents = num%100;
    num = Math.floor(num/100).toString();
    if(cents<10)
    cents = "0" + cents;
    for (var i = 0; i < Math.floor((num.length-(1+i))/3); i++)
    num = num.substring(0,num.length-(4*i+3))+','+
    num.substring(num.length-(4*i+3));
    return (((sign)?'':'-') + '£' + num + '.' + cents);
    }

    function InitForm()
    {
    document.myform.total.value='£0';
    document.myform.hiddentotal.value=0;
    document.myform.hiddenpriorradio.value=0;
    document.myform2.total.value='£0';
    document.myform2.hiddentotal.value=0;
    document.myform2.hiddenpriorradio.value=0;
    document.myform2.hiddenpriorradio.value=0;

    for (xx=0; xx < document.myform.elements.length; xx++)
    {
    if (document.myform.elements[xx].type == 'checkbox' | document.myform.elements[xx].type == 'radio')
    {
    document.myform.elements[xx].checked = false;
    }
    }
    for (xx=0; xx < document.myform2.elements.length; xx++)
    {
    if (document.myform2.elements[xx].type == 'checkbox' | document.myform2.elements[xx].type == 'radio')
    {
    document.myform2.elements[xx].checked = false;
    }
    }

    }

    // End -->
    </script>

    </HEAD>
    <BODY onload="InitForm();clearChk()" onreset="InitForm();">

    <table width="363" border="0" cellpadding="0" cellspacing="0" class="web_main">
    <!--DWLayoutTable-->
    <tr>
    <td width="8" height="278">&nbsp;</td>
    <td width="355" valign="top"><form method="POST" name="myform" class="supplyform">
    <input type="Hidden" name="subject" value="Ebay Club: Supplies Order">
    <input type="Hidden" name="recipient" value="support@improvingfutures.co.uk">
    <input type="Hidden" name="redirect" value="http://www.improvingfutures.co.uk/ecm/order_ty.htm">
    <span class="web_supplyform"> AirCap Bubble Wrap £15.25
    <input type="checkbox" name="Steak" value=15.25 onclick="this.form.total.value=CheckChoice(this);">
    <br>
    Mail-Lite Padded Envelopes £12.39
    <input type="checkbox" name="Envelopes" value=12.39 onclick="this.form.total.value=CheckChoice(this);">
    <br>
    Pure Kraft Wrapping Paper £18.75
    <input type="checkbox" name="Sushi" value=18.75 onclick="this.form.total.value=CheckChoice(this);">
    <br>
    <br>
    Additional options: <br>
    None, thanks
    <input type="radio" name="Sauce" value=none price=0.00
    onclick="this.form.total.value=CheckChoice(this);">
    Field &pound;10.99
    <input type="radio" name="Sauce" value=duck price=10.99
    onclick="this.form.total.value=CheckChoice(this);">
    Field &pound;5.00
    <input type="radio" name="Sauce" value=ginger price=5.00
    onclick="this.form.total.value=CheckChoice(this);">
    Field &pound;1.50
    <input type="radio" name="Sauce" value=hot price=1.50
    onclick="this.form.total.value=CheckChoice(this);">
    <br>
    <input type="hidden" name="hiddentotal" value=0>
    <input type="hidden" name="hiddenpriorradio" value=0>
    </span> <span class="web_heading">Your total is:
    <input name="total" type="text" onFocus="this.blur();" size="5" readonly>
    <input type="image" class="submit" src="buynow.gif" width="96" height="26" border="0" name="submit">
    </span> </form>

  7. #7
    SitePoint Wizard
    Join Date
    Mar 2004
    Posts
    1,647
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    then use names separately like..
    Code:
    function clearChk() {
    if(document.getElementById) {
    document.myForm.Envelopes.checked = false;
    document.myForm.Sushi.checked = false;
    document.myForm.Sauce.checked = false;
    // and so on....
    }
    }

  8. #8
    SitePoint Enthusiast
    Join Date
    Dec 2004
    Location
    uk
    Posts
    41
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    OK It's working!!! You are a star!

    What do I need to change to get the radio buttons to do the same thing?

    Cheers

  9. #9
    SitePoint Wizard
    Join Date
    Mar 2004
    Posts
    1,647
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code:
    function clearChk() {
    if(document.getElementById) {
    document.myForm.Envelopes.checked = false;
    document.myForm.Sushi.checked = false;
    for (var i = 0; i < document.myForm.Souce.lenght; i++) {
    document.myForm.Sauce.checked = false;
    }
    }
    }
    cheers

  10. #10
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Nelson BC
    Posts
    2,310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    2 things:

    - your resetForms function has a syntax error (there's a "b" where there shouldn't "b")
    - you need to use double vertical bars to do a logical OR in initForm, ie:
    if (document.myform.elements[xx].type == 'checkbox' || document.myform.elements[xx].type == 'radio')

  11. #11
    SitePoint Enthusiast
    Join Date
    Dec 2004
    Location
    uk
    Posts
    41
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I added:

    document.myform.Sauce.checked = false;

    Which relates to the radio button names but it isn't working?

  12. #12
    SitePoint Enthusiast
    Join Date
    Dec 2004
    Location
    uk
    Posts
    41
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks Jim. Will update the code adding double verticals.

    Where is the "b"? I can't find it

  13. #13
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Nelson BC
    Posts
    2,310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    function resetForms() {
    for (i=0; i b< document.forms.length; i++) {
    document.forms[i].reset();
    }
    }

  14. #14
    SitePoint Enthusiast
    Join Date
    Dec 2004
    Location
    uk
    Posts
    41
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    reminder, I still can't get the radio buttons to reset.
    **Script**

    function clearChk() {
    if(document.getElementById) {
    document.myform.Envelopes.checked = false;
    document.myform.Sushi.checked = false;
    document.myform.Steak.checked = false;
    document.myform.Sauce.checked = false;
    }
    }


    **Form Snippet For Radio button(s)**

    Field &pound;10.99
    <input type="radio" name="Sauce" value=duck price=10.99
    onclick="this.form.total.value=CheckChoice(this);">


    Sorry if I am being a pain. You are a true gent!

    Cheers

  15. #15
    SitePoint Wizard
    Join Date
    Mar 2004
    Posts
    1,647
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    jim..
    where u see this function?

  16. #16
    SitePoint Wizard
    Join Date
    Mar 2004
    Posts
    1,647
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    look better at the previous post
    cheers

  17. #17
    SitePoint Enthusiast
    Join Date
    Dec 2004
    Location
    uk
    Posts
    41
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    reminder:
    After changing the script too:

    function clearChk() {
    if(document.getElementById) {
    document.myform.Envelopes.checked = false;
    document.myform.Sushi.checked = false;
    document.myform.Steak.checked = false;
    for (var i = 0; i < document.myform.Souce.length; i++) {
    document.myform.Sauce.checked = false;
    }
    }
    }


    It Still doesn't reset the radio buttons and now will not reset the price

    I also can't find the section Jim is seeing

  18. #18
    SitePoint Enthusiast
    Join Date
    Dec 2004
    Location
    uk
    Posts
    41
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm pulling my hair out here. Can't get the damn radio's to reset. Tried lots of things but no Joy.

  19. #19
    SitePoint Wizard
    Join Date
    Mar 2004
    Posts
    1,647
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    u cant do this...
    value=duck price=10.99

  20. #20
    SitePoint Wizard
    Join Date
    Mar 2004
    Posts
    1,647
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    try this..
    Code:
    function clearForm() {
    document.myform.reset();
    }
    cheers

  21. #21
    SitePoint Enthusiast
    Join Date
    Dec 2004
    Location
    uk
    Posts
    41
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This is far as I can get at the moment.

    http://www.improvingfutures.co.uk/Shopping/form.htm

    Will keep going but getting a little depressed

  22. #22
    SitePoint Enthusiast
    Join Date
    Dec 2004
    Location
    uk
    Posts
    41
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    IT WORKED!!!!!!

    You are a wonderfull guy

    Thank you my friend.

    Arn't the simplest things the most beautiful

    Thanks again!

    Dave

  23. #23
    SitePoint Wizard
    Join Date
    Mar 2004
    Posts
    1,647
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    can i see the code!

  24. #24
    SitePoint Enthusiast
    Join Date
    Dec 2004
    Location
    uk
    Posts
    41
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sorry for my late reply. I have just been driving home from work.(UK resident)

    The code is on the office computer. I will try to get the script off our web server but I can't promise.

    If I can't get it tonight I will post it for you on Monday.

    Thanks again for your time & effort.

    My original message about there being lots of knowledgable folk here certainly is true, especially in your case.

    Best Regards
    Dave

  25. #25
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Nelson BC
    Posts
    2,310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well done.

    Your extra "b" has disappeared along with the function it was in, I must've been looking at an old version of the code.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •