Forums

Reset form after pressing Back button

Luc 06 Nov, 2013
I allmost completed a dynamic form with 7 dropdown boxen.
Everything goes well.

After making the necessery desicions in the different boxes, the user have to press the submit button (I changed the text)

When the user got the result and press the Back key from the keyboard the form resets the values for the dynamic boxes except for the first box.

How can I solve this ?

This is the URL http://www.j-jennen.be/sigmatech
GreyHead 06 Nov, 2013
Hi Luc,

Either you block the back button; or you set up the page so that the JavaScript runs on the onLoad event to reset all the drop-downs. If you put it into functions then it's not hard to do:
window.addEvent('load', function() {
  $('veld_1').addEvent('change', veld1Change);
  veld1Change();

  function veld1Change() {
    if($('veld_1').get('value') == 'sel-1'){
      $('veld_2').empty();
      new Element('option', {'value': 'sel-1a', 'text': 'Hout'}).inject($('veld_2));
      new Element('option', {'value': 'sel-1b', 'text': 'Kunststof'}).inject($('veld_2'));
      new Element('option', {'value': 'sel-1c', 'text': 'Metaal'}).inject($('veld_2'));
      new Element('option', {'value': 'sel-1d', 'text': 'Minerale ondergrond'}).inject($('veld_2'));
      new Element('option', {'value': 'sel-1e', 'text': 'Vloer'}).inject($('veld_2'));
      $('veld_2').fireEvent('change');
    }
    if($('veld_1').get('value') == 'sel-2'){
      $('veld_2').empty();
      new Element('option', {'value': 'sel-2a', 'text': 'Hout'}).inject($('veld_2'));
      new Element('option', {'value': 'sel-2b', 'text': 'Kunststof'}).inject($('veld_2'));
      new Element('option', {'value': 'sel-2c', 'text': 'Metaal'}).inject($('veld_2'));
      new Element('option', {'value': 'sel-2d', 'text': 'Minerale ondergrond'}).inject($('veld_2'));
      $('veld_2').fireEvent('change');
    }
  }
});

Bob
Luc 07 Nov, 2013
It's not clear for me on the moment.

In the On Load Event I added the function Custom Code.
In this function I started with :
<script>


then your code, and at last

</script>


What do I wrong to solve this ?
GreyHead 07 Nov, 2013
Hi Luc,

Was the form code your custom code or created by a ChronoForms action?

Please see this FAQ about adding JavaScript.

Note that my code was only a part of the full code that's needed.

Bob
Luc 08 Nov, 2013
I now added the action Load JS in the On Load event and I placed your code in the box, but I see nothing changing.

I think the code given by you is not what I need. If I see the code than I think you want to place the selected values back into the different boxes after the Back button is pressed.

This is not what I need. For box 2 to 7 is everything OK. Here I get the standard value 'Maak uw keuze'. Only for box 1 stays the first selected value. This is what has to be changed in the standard value 'Maak uw keuze'.

Here you find the steps the users makes :

- User makes the selections in the different boxes for the result he needed
- User Pressed the Submit button with the text 'Zoek het systeem, is nog in opbouw'
- Then the user gets a resume page from his choices
- In case that the user now pressed the Back button then the values for box 2 to 7 got the value 'Maak uw keuze'. This is OK for me, but box 1 keeps his first selected value and here I like also the standard value 'Maak uw keuze'

How can I change this ?
Luc 09 Nov, 2013
Perhaps I make my question in a another way.

How can I place a value in a dynamic textbox by using an action on the OnLoad Event ?
Luc 09 Nov, 2013
Someone an idea.
I've been searching whole day but without result.
Max_admin 09 Nov, 2013
So the goal is to reset the selection of the first dropdown ? if so then you ma ysimply use a small JS code to reset it in the domready event!

Regards,
Max
Max, ChronoForms developer
ChronoMyAdmin: Database administration within Joomla, no phpMyAdmin needed.
ChronoMails simplifies Joomla email: newsletters, logging, and custom templates.
Luc 09 Nov, 2013
After searching a whole day I found a solution that works.

In the Load JS action I placed following code :

function init() {
    // Clear forms here
    document.getElementById("veld_1").value = "sel-x";
}
window.onload = init;
This topic is locked and no more replies can be posted.