0

Lets say I have this: http://jsfiddle.net/oh0omatq/2/

<form>
    <input placeholder="my value">Country
    <button name="subject" type="submit" value="england">England</button>
    <button name="subject" type="submit" value="wales">Wales</button>
    <br />Your country is: Wales
    <input type="submit">
</form>

Can I use this submit buttons for england and wales to set a value within the form, and reload the form, but also not loose the information already entered in the form, such as in the input box.

This above is just a preview, but I want to be able to reload and filter the input elements in the form depending on the button the user clicked, but also not loose any previously entered data in the fields.

J.Zil
  • 2,397
  • 7
  • 44
  • 78
  • so you mean like a two-step form? – LorDex Sep 02 '14 at 15:34
  • What server technology are you using? Re-posting values back to the form is typically done there (MVC/PHP etc). – iCollect.it Ltd Sep 02 '14 at 15:35
  • What about cookies? They work fine with JS. If you're using PHP store as a session or cookie as well. – Idris Sep 02 '14 at 15:35
  • If you do all your submission using Ajax calls, e.g. using jQuery, you will never leave the page at all so the values will be retained. Your JSFiddle does not indicate how you wish to solve this problem. – iCollect.it Ltd Sep 02 '14 at 15:37
  • There are quite a few threads already discussing this [link][1] [1]: http://stackoverflow.com/questions/19332504/struts2-how-to-keep-form-values-when-navigating-between-pages/24914738#24914738 – steven35 Sep 02 '14 at 15:38
  • Can you explain me what is purpose of holding England and Wales as submit buttons? – franki3xe Sep 02 '14 at 15:47

1 Answers1

0

I would recommend using javascript for this. I've edited your fiddle to use an onclick function.

<form>
    <input placeholder="my value">
    Country
    <button name="subject" value="england" type="button" onclick="document.getElementById('value').innerHTML = this.value">England</button>
    <button name="subject" value="wales" type="button" onclick="document.getElementById('value').innerHTML = this.value">Wales</button><br />
    Your country is: <span id="value">Wales</span>
    <input type="submit">
</form>

Changing the buttons to a type="button" so they don't submit the form allows the javascript to edit the value. Ofcourse you can make an input out of the span, allowing the chosen value to be sent with the form. Ofcourse, a select box would work as well then.

Would that do what you want?

You can see the edited fiddle here.

Keep in mind, this is a quick sketch. It is not recommended to use javascript inline.

Sander Koedood
  • 6,007
  • 6
  • 25
  • 34