Concatenate 2 form fields with button

Question

I am trying to concatenate the values of 2 fields when the user presses the button. After pressing the button it should display the concatenated string. Can't seem to figure this out as this is my first time playing with html forms. Here's my code:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Test</title>
</head>

<body>

<form method="GET">
<input type="text" name="num1" placeholder="Number 1">
<input type="text" name="num2" placeholder="Number 2">
<br>
<button type="submit" name="submit" value="submit">Generate</button>
</form>
<p>Response:</p>
<?php
if (isset($_GET["submit"])) {
$name = $_GET['num1'] . ' ' . $_GET['num2'];
echo $name;
}
?>



</body>


</html>

It seems like the info is getting passed to the URL when I click the button because this is what it shows when entering "aaaa" and "bbbb":

    file:///storage/emulated/0/web-files/index.php?num1=aaaa&num2=bbbb&submit=submit

Does changing `valie` (a typo) to `value` on the button fix your form? — potNPan, Jan 07 '19 at 05:30
I don't think it will display anything because you're embedding php code inside html. And since you're not using Ajax, your
content won't change as php produces static content when executed as a part of html. — Dr. Kevin Wang, Jan 07 '19 at 05:43
Also if you're just trying to concatenate the two numbers, why not just use javascript. — Dr. Kevin Wang, Jan 07 '19 at 05:45
@Dr.KevinWang Thanks for your input. I'm new to this and learning. Can you please show me how it would work using ajax? Thanks — harvey, Jan 07 '19 at 05:59
@Dr.KevinWang They're not necessarily two numbers, as they are text fields. — harvey, Jan 07 '19 at 06:00
@harvey You can check out [this link](https://stackoverflow.com/questions/9436534/ajax-tutorial-for-post-and-get) for more detail. — Dr. Kevin Wang, Jan 07 '19 at 06:02

score 0 · Answer 1 · answered Jan 07 '19 at 05:49

0

use

isset($_GET['submit'])

instead of

isset($_GET["submit"])

answered Jan 07 '19 at 05:49

Vishnu Vijaykumar

412
4
14

score 0 · Answer 2 · answered Jan 07 '19 at 06:49

As I can see the url provided, you are directly opening a php file from a browser. Try to install apache server and then keep the file in root directory. It will definitely work. If you want to continue with php, you can go through this link https://howtoubuntu.org/how-to-install-lamp-on-ubuntu Or if you just want to concatenate those input values you can use JavaScript to do the job and a simple html file will help.

<!DOCTYPE html>
    <head>
        <meta charset="UTF-8">
        <title>Test</title>
        <script type="text/javascript">
            function concatme()
            {
                var num1 = document.getElementById("num1").value;
                var num2 = document.getElementById("num2").value;
                document.getElementById("response").innerText = num1 + ' ' +num2;
            }
        </script>
    </head>
    <body>

    <form method="GET">
        <input type="text" name="num1" id="num1" placeholder="Number 1">
        <input type="text" name="num2" id="num2" placeholder="Number 2">
    </form>
    <br>
    <button  value="submit" onclick="concatme()">Generate</button>
    <p id="response"></p>
    </body>
</html>

lainderon · Answer 3 · 2019-05-06T10:07:39.213

0

There is no correct input "submit" in your form, so retry with :

<input type="submit" name="submit" value="submit"/>

Instead this button, and a button have to be write like this :

<input type="button" name="btnName" value="btnValue"/>

It seem it can work on some browser with <button> but it's not the standard way.

Edit: your url is strange too, are you sure php is right running.

edited May 06 '19 at 10:07

answered May 06 '19 at 10:01

lainderon

95
8

I think it will not works thought... what is the form url? do you fall on this form page when you submit? Try adding the action `
`. Your file:// is strange, it must be http://
– lainderon May 06 '19 at 12:28

Concatenate 2 form fields with button

3 Answers3