How To Swap Value Between Two Input Fields On Click Using Jquery?

Forums jQueryHow To Swap Value Between Two Input Fields On Click Using Jquery?
Staff asked 2 years ago

How to swap value between two input fields on click using jQuery?

Answers (2)

Add Answer
Umang Ramani Marked As Accepted
Staff answered 2 years ago
Staff answered 2 years ago

Swap values between two input fields using jQuery:

Include jQuery link:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

Html Code:

<body>
  <div class="row">
    <div class="firstinputbox">
      <input type="text" name="box1" id="left">
    </div>
    <div class="button">
      <button type="button" id="btnleft">>></button>
    </div>
    <div class="secondinputbox">
      <input type="text" name="box1" id="right">
    </div>
  </div>
</body>

jQuery code:

 $("#btnleft").click(function () {
     var left = $("#left").val();
     var right = $("#right").val();

     if ($("#btnleft").text() == ">>") {
         $("#right").val(left);
         $("#left").val("");
         $("#btnleft").text("<<");
     }
     else {
         $("#left").val(right);
         $("#right").val("");
         $("#btnleft").text(">>");
     }
});

Subscribe

Select Categories