How to pass values to a div? Jquery

Question

I have a form below, to pass below values to div (myDiv) and want that div to be shown (display:block).

<form method="post">

       <input type="text" name="value_a" value="A" >
    <input type="text" name="value_b" value="B" >

<input type="submit" name="submitX" value="submit" ;">

</form>

<div id="myDiv" style="display: none;"  >

<?php if(isset($_POST['submitX'])) 
  
{

  $AA= $_POST['value_a'];
  $BB = $_POST['value_b'];  
  .
  .
</div>

I already try below input type:

<input type="button" name="submitX" value="Submit" onclick="document.getElementById('myDiv').style.display = 'block' ;" >

It shows the div(myDiv) but the values i wanted not carry along.

Thanx:)

Answer 1

You assign values to variables, but you never actually output them. Instead of this:

$AA= $_POST['value_a'];

Simply do this:

echo $_POST['value_a'];

---

Additionally, your <div> should probably be visible in order to see it. This is styled to always be hidden:

<div id="myDiv" style="display: none;"  >

Even if you run JavaScript to show it when clicking the button, that won't matter as soon as the form posts and the page reloads. Instead, conditionally style it based on the form input:

<div id="myDiv" style="display: <?= isset($_POST['submitX']) ? "block" : "none" ?>;"  >

Or if you prefer for readability:

<?php if (isset($_POST['submitX'])) { ?>
  <div id="myDiv">
<?php } else { ?>
  <div id="myDiv" style="display: none;">
<?php } ?>

There are a variety of ways to structure your logic, really.

---

As a learning exercise, further considerations include:

1. Formatting your output so the values aren't just munged together in the result. This would involve using more HTML in your output. Observe the browser's page source to see what you actually output vs. how it's rendered.
2. Start looking into something called Cross Site Scripting . For a contrived exercise like this one, it's not a problem. But in real-world applications you don't want to blindly output user input, especially if you're outputting someone else's input to the user.