How to return second register form on submition?

Question

I have a page with two registration forms individual and business type and individual type form is set as default the other form is hidden, it works fine. but when I switch it to second form and click on submit button it submits second form but returns to first form after submition even on errors it return to first form.

I want it to stay on second form on errors and after submition.

Here is my php :

if (isset($_POST["btnRegister"])) {
    echo "Done";
}elseif (isset($_POST["btnbusiness"])) {
    echo "Done";
}

HTML and js codes in my page:

 function swapConfig(x) { var radioName = document.getElementsByName(x.name); for(i = 0 ; i < radioName.length; i++){ document.getElementById(radioName[i].id.concat("Settings")).style.display="none"; } document.getElementById(x.id.concat("Settings")).style.display="initial"; }

 <div class="col-10 clmiddle"> <label for="production"><b>Individual</b></label> <input type="radio" onchange="swapConfig(this)" name="urlOptions" id="production" checked="checked" /> <label for="development"><b>&nbsp;&nbsp;Business</b></label> <input type="radio" onchange="swapConfig(this)" name="urlOptions" id="development" /> </div> First Form : <div id="productionSettings" class="col-12"> <form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="post"> <div class="col-6"> <input type="text" class="form-control" name="fname" placeholder="Name..." required> <button type="submit" name="btnRegister" class="btn btn-primary right">Send</button> </div> </form> </div> Second Form : <div id="developmentSettings" style="display:none" class="col-12"> <form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="post"> <div class="col-6"> <input type="text" class="form-control" name="fname" placeholder="Name..." required> <button type="submit" name="btnbusiness" class="btn btn-primary right">Send</button> </div> </form> </div>

EDIT: I changed JS to php, Here is the solution. PHP codes (which get url):

$path = $_SERVER['REQUEST_URI'];
    $Aurl = explode(",",$path);
    for ($i=0; $i<count($Aurl);$i++){
      $Burl = str_replace("?", "/", trim($Aurl[$i]));
    }
$url = htmlspecialchars(basename($Burl));
$FormPostUrl = basename($path);

Html part :

 Checkbox : <div class="col-10 clmiddle" style="margin-top: 20px;"> <label for="production"><b>Individual</b></label> <input type="checkbox" value="<?php echo htmlspecialchars("register.php"); ?>" name="checket" onClick="if (this.checked) { window.location = this.value; }" <?php if($url === htmlspecialchars("register.php")){ echo 'checked="checked"';}?>> <label for="development"><b>Business</b></label> <input type="checkbox" value="<?php echo htmlspecialchars("register.php?business");?>" name="checket" onClick="if (this.checked) { window.location = this.value; }" <?php if($url === htmlspecialchars("business")){ echo 'checked="checked"';}?>> </div> First Form : <?php if($url === htmlspecialchars("register.php")){?> <div id="productionSettings" class="col-12"> <form action="<?php echo htmlspecialchars($FormPostUrl); ?>" method="post"> <div class="col-6"> <input type="text" class="form-control" name="fname" placeholder="Name..." required> <button type="submit" name="btnRegister" class="btn btn-primary right">Send</button> </div> </form> </div> Second form: <?php } elseif($url === htmlspecialchars("business")){ ?> <div id="developmentSettings" class="col-12"> <form action="<?php echo htmlspecialchars($FormPostUrl); ?>" method="post"> <div class="col-6"> <input type="text" class="form-control" name="fname" placeholder="Name..." required> <button type="submit" name="btnbusiness" class="btn btn-primary right">Send</button> </div> </form> </div> <?php } ?>

Answer 1

You can use PHP to control whether display:none is added to your divs or not. Use an if statement (or a ternary operator might be neater syntax in the context) to make the decision about what to echo. Since the default is to display the production settings form, we only need to check whether the other form has been submitted or not, in order to know whether to change that.

eg something like this (untested):

<input type="radio" onchange="swapConfig(this)" name="urlOptions" id="production" <?php echo (isset($_POST["btnRegister"]) ? "" : 'checked="checked"'); ?> />

and

<input type="radio" onchange="swapConfig(this)" name="urlOptions" id="development" <?php echo (isset($_POST["btnRegister"]) ? 'checked="checked"' : ""); ?> />

and

<div id="productionSettings" class="col-12" <?php echo (isset($_POST["btnbusiness"]) ? "style='display:none'" : ""); ?>>

and

<div id="developmentSettings" class="col-12" <?php echo (isset($_POST["btnbusiness"]) ? "" : "style='display:none'"); ?>>

---

PS Unless you've massively simplified these forms for the purpose of your example, they appear to be basically identical. It's questionable whether you actually need two separate forms at all. The only difference appears to be the choice between "individual" and "business" - that could be handled by a single form with a radio button to choose the type, which would then simplify how you handle the postback as well, and reduce the amount of duplicated code and HTML. Of course if you're actually capturing more distinct fields for these forms than you've shown, then these remarks don't really apply.