Modify form input value on submit - php

Question

I wasn't sure how to phrase the title, but here's what I'm trying to do.
I have a form to login to webmail, I don't have access to the webmail - it just posts the form input to the website and the webmail server takes it from there.
Everyone logging in to this page will be using the same email extension (e.g. "#myemail.com"), so I want to save the hassle of typing that every time, instead they can just write "mike" and the form will add "#myemail.com" on it's own.
I could post this form to a middle ground php page that sticks "mike" + "#mymail.com" together and posts this info to the webmail?
Or is there a simpler way to do this without having to create another page?
<form name="loginForm" action="http://webmail.emailsrvr.com/login.php" method="POST" target="_blank">
<input type="hidden" name="js_autodetect_results" value="SMPREF_JS_OFF">
<input type="hidden" name="just_logged_in" value="1">
<input type="hidden" name="type" value="v3">
<input type="hidden" name="useSSL" id="useSSL" value="">
<input type="email" name="user_name" placeholder="Username" required autofocus>
<input type="password" name="password" placeholder="Password" required>
<label for="remember"><input type="checkbox" name="remember">Remember my info</label>
<button type="submit">Sign In</button>
</form>
I want to take the value entered here...
<input type="email" name="user_name" placeholder="Username" required autofocus>
...and add an extension like "#myemail.com" to it, then post it.
Any idea? Thanks in advance for your help.
I could do something like this?
PAGE 1 - Enter username and password...
<input type="text" name="send_email" placeholder="Username" required autofocus>
<input type="password" name="send_password" placeholder="Password" required>
<label for="remember"><input type="checkbox" name="remember">Remember my info</label>
<button type="submit">Sign In</button>
</form>
PAGE 2 - PHP takes username and adds "#myemail.com" and sends form...
<?php
$form_email = $form_password = "";
if (!empty($_POST['send_email']) && !empty($_POST['send_password'])) {
$form_email = $test($_POST['send_email']) . '#fountaincreations.ca';
$form_password = $test($_POST['send_password']);
echo '<form name="loginForm" action="http://webmail.emailsrvr.com/login.php" method="POST" target="_blank">';
echo '<input type="hidden" name="js_autodetect_results" value="SMPREF_JS_OFF">';
echo '<input type="hidden" name="just_logged_in" value="1">';
echo '<input type="hidden" name="type" value="v3">';
echo '<input type="hidden" name="useSSL" id="useSSL" value="">';
echo '<input type="hidden" name="user_name" value="' . $form_email . '">';
echo '<input type="hidden" name="form_password" value="' . $form_password . '">';
echo '</form>';
} else {
echo '<p style="text-align:center;padding:40px 20px;">Please go back and try again.</p>';
}
function test($data) {
$data = strtolower(data);
$data = trim($data);
$data = stripslashes($data);
$data = htmlspecialchars($data);
return $data;
}
?>
How do I tell PHP to automatically submit the form though?
Here's what I have if I were to use jQuery:
It doesn't currently work though.
HTML:
<div class="box top">
<form name="loginForm" action="http://webmail.emailsrvr.com/login.php" method="POST" target="_blank">
<input type="hidden" name="js_autodetect_results" value="SMPREF_JS_OFF">
<input type="hidden" name="just_logged_in" value="1">
<input type="hidden" name="type" value="v3">
<input type="hidden" name="useSSL" id="useSSL" value="">
<div class="inner">
<div class="inner-row"><input type="text" name="user_name" placeholder="First Name" required autofocus></div>
<div class="inner-row"><input type="password" name="password" placeholder="Password" required></div>
<div class="inner-row">
<div class="inner-col col-2-4"><label for="remember"><input type="checkbox" name="remember">Remember my info</label></div>
<div class="inner-col col-2-4"><button type="submit">Sign In</button></div>
</div>
</div>
</form>
</div>
<div class="box bottom">
<div class="inner">
<div class="inner-row"><p>Already signed in? <b>Go to your inbox.</b></p>
</div>
</div>
JS:
<script type="text/javascript">
$(document).ready(function(){
$("button[type='submit']").on('click', function(e){
e.preventDefault();
var userEmail = $.trim($("input[name='user_name']").val());
$("input[name='user_name']").val(userEmail+"#fountaincreations.ca");
$("form[name='loginForm']").submit();
});
});
</script>

Answer 1

I think if you want to attach username + "#mymail.com" to useremail field, here is my suggestion:
1# create input user_email (just hide this field)
<input type="hidden" name="user_email" id="user_email" placeholder="User Email">
2# add js below
$('#user_name').on('input', function() {
username = this.value+'#myemail.com';
$('#user_email').val(username);
});
here example

Answer 2

I think this will go like this, hope this will help you. What i am doing in this code is, first I stop the form from being submitted through e.preventDefault(); and then i am taking the value of the required input and assigning it back value by attaching "#mymail.com".
$(document).ready(function(){
$("button[type='submit']").on('click', function(e){
e.preventDefault();
var userEmail = $.trim($("input[type='email']").val());
$("input[type='email']").val(userEmail+"#mymail.com");
$("form[name='loginForm']").submit();
});
});