Closing featherlight upon submitting form

Question

I have a demo-employee.php page that retrieves all the users of the system alongside specific actions that can be performed:

<td><table>
    <tr>
    <td><a href="edit-user.php?userid=<?php echo $userid ?> "><i class="fa fa-pencil-square-o"></i></a></td>
    <td><a href="demo-change-password.php?userid=<?php echo $userid ?>" data-featherlight><i class="fa fa-key"></i></a></td>**
    <td><a href="remove-user.php?userid=<?php echo $userid ?>" onclick="return confirmAction()"><i class="fa fa-trash-o"></i></a></td>
    </tr>
    </table>
    </td>**

I am using data-featherlight to pop up the page demo-change-passowrd.php, upon clicking the link the user gets this form:

<form id="changePwd" name="formPwd" method="post" action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>" accept-charset="UTF-8"> 



 <p>Please fill all the mandatory (*) fields.</p>
    <div class="question">
    <input type="password" name="new_pwd"  pattern="^.*(?=.{6,})(?=.*[a-zA-Z])[a-zA-Z0-9]+$" title="Your new Password is required" required/>
    <label><?php echo "<font color='red'>New Password(*):</font>" ?></label>
    </div>
    <div class="question">
    <input type="password" name="confirm_pwd"  pattern="^.*(?=.{6,})(?=.*[a-zA-Z])[a-zA-Z0-9]+$" title="Confirm Password field is required" required/>
    <label><?php echo "<font color='red'>Confirm Password(*):</font>" ?></label>
    <span class="required" id="doesNotMatch"></span>
    </div>

<center>
<input type="submit" name="submit" onclick="checkPwdMatch();" onsubmit="return closeSelf(this);" value="Submit" />
<input type="hidden" name="user_id" id="user_id" value="<?php echo $user_id; ?>" />
</center>
</form>

I have a method to check if the pwdmatches, and upon successfully submitting the form, it should close with this method which is appended @ the bottom of the page

function closeSelf(f){
f.submit()
window.close();
}

Also I moved this from the button to the form onsubmit="return closeSelf(this);", still no luck. Upon submitting the form, it just stays on the demo-change-passowrd.php. I also used window.location.replace to the demo-employeed page instead of window.close(), no luck as well. Can someone help please, I did

$("#myform").submit(function(e) {

        //prevent Default functionality
        e.preventDefault();
window.close();

Still no luck? am I missing something please?

Answer 1

I added an onsubmit attribute to form that would call 'click' on the close button (which has the class featherlight-close).

<form ... onsubmit="$('.featherlight-close').click()">