How to make and save custom form in custom plugin page?

I am making a plugin with a setting page in it. In its setting page I need a user registration form with only two fields: username and password. How can I save this data to the database?

Here is what I am trying to do:

public function PLUGIN_setting_page(){
    require_once PLUGIN_PATH. 'templates/admin/plugin-settings.php';
}

plugin-settins.php:

<?php
if(isset($_POST['submit'])) {
   global $wpdb;
   $table = 'wp_myp_user';
   $data = array(
      'username' => $_POST['username'],
      'password'    => $_POST['password']
   );
   $format = array(
      '%s',
      '%s'
   );
   $success=$wpdb->insert( $table, $data, $format );
   if($success){
       echo 'data has been save' ; 
    }
} 
?>
<div class="login-page">
  <div class="form" method="post" action="">
    <form class="login-form">
      <input type="text" name="ldc_username" placeholder="username" value=""/>
      <input type="password" name="ldc_password" placeholder="password" value=""/>
      <!-- <button type="submit">login</button> -->
      <?php submit_button(); ?>
    </form>
  </div>
</div>

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

There are quite of few issues with the code. I made notes to help explain the changes. References are at the bottom, make sure to read those as well.

//isset is not the correct way. It does not check to see if the post was empty - this is the correct one ($_SERVER..)
if($_SERVER['REQUEST_METHOD'] == 'POST') {
    global $wpdb;
    //Make sure this is spelled correct.
    $table = 'wp_myp_user';

    //output will check to see if it was posted correctly.
    $output = ['status' => 1];
    //You have to sanitize the fields first - for security reasons.
    $username = sanitize_text_field($_POST["ldc_username"]);
    $password = sanitize_text_field($_POST["ldc_password"]);
    $data = array(
            //Make sure this is the same name as in the database - its spelled like this correct?
        'username' => $username,
        'password' => $password
    );
    $format = array(
        '%s',
        '%s'
    );
    //I would not put it in a variable - just send it directly.
    $wpdb->insert( $table, $data, $format );
    //Here is your post check - to console if it prints 2 - your good.
    $output['status'] = 2;
    //check reference material to learn more about wp_send_json.
    wp_send_json($output);
}
//Previously you were sending it to a function?  submit_button(); ... there is no function I can see with this. So, I would leave it out. 
?>
<div class="login-page">
   //For the action - use "#" if you want the action is happen on the same page. 
    <div class="form" method="post" action="#">
        <form class="login-form">
            <input type="text" name="ldc_username" placeholder="username" value=""/>
            <input type="password" name="ldc_password" placeholder="password" value=""/>
            <button type="submit" name="submit">login</button>
        </form>
    </div>
</div>

NOTES:

https://developer.wordpress.org/reference/functions/wp_send_json/

https://developer.wordpress.org/reference/functions/sanitize_text_field/

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0