connecting html form to my wix site database

I am trying build a customized form on wix using HTML. on submission i want the form data to store in my wix database i tried this simple code but is not working

i getting this error : TypeError: $w(…).onSubmit is not a function

HTML code.

    <form id="myForm">
      <label for="name">Name:</label>
      <input type="text" id="name" name="name">
      <label for="email">Email:</label>
      <input type="email" id="email" name="email">
      <button type="submit">Submit</button>
      </form>

JS Code

 import wixData from 'wix-data';

    $w.onReady(function () {
      $w("#myForm").onSubmit((event) => {
        event.preventDefault();
    
        let formData = {
          "name": $w("#name").value,
          "email": $w("#email").value
        };
    
        wixData.insert("FormSubmissions", formData)
          .then((result) => {
            console.log("Data submitted successfully", result);
          })
          .catch((err) => {
            console.log("Error submitting form data", err);
         });
      });
    });