Question

I have an html form with two input fields, in first one user puts name of first town, and in other second town, after form is submitted users gets directions how to go from first town to second town.

I want to enable user to click button “Change directions” and to automatically change first town name into second and second town name into first and vise versa. ( A to B, B to A)

I guess i’m supposed to use javascript, but I’m new at it and can’t get a clue anywhere.

Can anyone help me please?

input type="text" size="25" id="fromAddress" name="from"
 value=""/>
  <input name="submit1" type="submit" value="Change directions" />
<input type="text" size="25" id="toAddress" name="to"
 value="" />
<input name="submit" type="submit" value="OK" />

Answer 1

Below is the sample code of what you want to achieve enjoy 🙂

        function swap1() {
            var data1 = document.getElementById("fromAddress").value;
            var data2 = document.getElementById("toAddress").value;
            document.getElementById("fromAddress").value = data2;
            document.getElementById("toAddress").value = data1;
            document.getElementById("swap_button").onclcik = function () {swap2()};
        }

        function swap2() {
            var data1 = document.getElementById("toAddress").value;
            var data2 = document.getElementById("fromAddress").value;
            document.getElementById("toAddress").value = data2;
            document.getElementById("toAddress").value = data1;
            document.getElementById("swap_button").onclcik = function () {swap2()};
        }


    <input type="text" size="25" id="fromAddress" name="from" value=""/>
    <input id="swap_button" type="button" value="Change directions" onclick="swap1()" />
    <input type="text" size="25" id="toAddress" name="to" value="" />
    <input name="submit" type="submit" value="OK" />