Message:

I have two text type inputs. I want to convert them into one textbox(Lowercase with dash) while typing just like below.

<input type="text" name="first">

<input type="text" name="last">

I want combine this two text box into another textbox

Example: Nikhil Patel to nikhil-patel

I am trying to combine below inputs but can't.

function conv(){



                var title, author;

                title = document.getElementById("title").value;

                author = document.getElementById("author").value;



                /*converting to LowerCase*/

                title = String.toLowerCase(title);

                author = String.toLowerCase(author);



                var out  = title + "-" + author;



                document.getElementById("output").value = output;

            }

    <div class="form-group">

    <label>Title :</label>

    <input class="form-control" type="text" name="title" id="title" />

    </div>

    <div class="form-group">

    <label>Author :</label>

    <input class="form-control" type="text" name="author" id="author" />

    </div>

    <div class="form-group">

    <label>Output :</label>

    <input class="form-control" type="text" name="output" id="output"/>

    </div>

My Answer:
You can achieve this by using JavaScript to listen for input events on the two textboxes and then combining their values into a third textbox with the desired format. Here's an example code snippet to accomplish this:

html







    Combine Textboxes

In this code, we have three textboxes - `textbox1`, `textbox2`, and `combined`. We listen for input events on `textbox1` and `textbox2` using the `addEventListener` method and call the `updateCombinedText` function whenever there is an input event.

The `updateCombinedText` function gets the values of `textbox1` and `textbox2`, converts them to lowercase, replaces any spaces with dashes, and then combines them with a dash in between. Finally, it sets the combined text in the `combined` textbox.

You can copy and paste this code into an HTML file and open it in a browser to see the functionality in action.

Rate this post

3 of 5 based on 1939 votes

John Davidson

javascript - Combine two textbox value into other textbox in lowercase with dash

Rate this post

Comments