1

This is a noob question. What I'd like to do is set up a birthday party reservation website that has people fill out a form: yes/ no will attend, name, email. After the form is filled out for 'will attend' I'd like to have a popup modal that has the option to 'add to your calendar: Google, iCal, etc.' Is this possible in an html form (javascript/ ajax)? I know it can be done in WordPress. Thank you for any help/ suggestions.

Kevin
  • 21
  • 3
  • yes it is possible. The question is too vague, however. Unless you want someone to write this whole thing for you. Here is one source you way want to look at: https://developers.google.com/calendar – sample Jan 04 '21 at 19:10
  • Thank you. I will look at those docs. No, I don't want someone to write it; I want to learn how. – Kevin Jan 04 '21 at 19:12
  • I got the idea from this website. It's for a wedding but I thought I could use the same concept for a family birthday party. https://www.berichinlove.com/. Secret Code : 04092016 – Kevin Jan 04 '21 at 19:16

1 Answers1

1

Here is a very basic idea of what you could do. I put the form in the console using the answer here: https://stackoverflow.com/a/47188324/12946266 you will need to use php to operate on this form most likely, but I can't use that here.

const form = document.querySelector('form');
document.getElementById("myForm").addEventListener("submit", function(event) {
  event.preventDefault();
  var values = Object.values(form).reduce((obj, field) => {
    if(field.type=='radio'){
     obj[field.name] = field.checked;
    }else{
      obj[field.name] = field.value;
    }
    return obj
  }, {})
  console.log(values);
});
<form id="myForm" action="/action_page.php">
  First name: <input type="text" name="fname" value=""><br> Last name: <input type="text" name="lname" value=""><br> email: <input type="text" name="email" value=""><br>
  <input type="radio" id="attending" name="attendance" value="attending">
  <label for="attending">attending</label>
  <br>
  <input type="submit" value="Submit"><br>
</form>
sample
  • 392
  • 2
  • 10