Issue with Javascript, it won't allow the Full Calendar to load

Question

Could someone please tell me what's wrong with the following code. I'm guessing it has something to do with missing brackets for the Javascript, but I can't put my finger on it. How can we use the var modal = $("#modal"); where it says, var content = "Hello " + name + ", You have signed " + modal + " up to XYZ";

When we implement this code, the Full Calendar HTML dissapears of the site. Thanks a lot!

$(window).load(function() {
$(document).ready(function() {
    $('#calendar').fullCalendar({
        header: {
            left: '',
            center: 'title',
            right: 'prev,next today'
        },
        defaultDate: '2016-03-15',
        events: [

            {
                title: 'Event',
                start: '2016-03-26T11:00:00',
                end: '2016-03-26T12:00:00',
            },
        ],
        eventClick: function(event) {
            console.log(event)
                // alert(event.start.format('MMMM Do YYYY'))
                start = event.start.format('MMMM Do YYYY'),
                end = event.end.format('MMMM Do YYYY'),
                html = '<p>Starts: ' + start + '<p>';
            html += '<p>Ends: ' + end + '<p>';
            var modal = $("#modal");
            modal.find(".modal-title").html(event.title);
            modal.find('.modal-body').html(html)
            modal.modal();
        }  
    )}


    jQuery(function($) {
     $("#contact_form").submit(function() {
        var email = $("#email").val(); // get email field value
        var name = $("#name").val(); // get name field value
        var msg = $("#msg").val(); // get message field value
        var content = "Hello "+name+ ", You have signed "+modal+ " up to XYZ";
        $.ajax({
                type: "POST",
                url: "https://mandrillapp.com/api/1.0/messages/send.json",
                data: {
                    'key': 'api',
                    'message': {
                        'from_email': "email",
                        'text': "Hello ",
                        'from_name': "name",
                        'headers': {
                            'Reply-To': "email"
                        },
                        'subject': 'Confirmation - Sign Up',
                        'text': content,
                        'to': [{
                            'email': email,
                            'name': name,
                            'type': 'to'
                        }]

                    }
                }

            })
            .done(function(response) {
                alert('You have been signed up. Thank you!'); // show success message
                $("#name").val(''); // reset field after successful submission
                $("#email").val(''); // reset field after successful submission
                $("#msg").val(''); // reset field after successful submission

            })
            .fail(function(response) {
                alert('Error sending message.');
            });
        return false; // prevent page refresh
    });
});
  });

Answer 1

change this:

      modal.modal();
    }  
)} //<-----this

to this:

      modal.modal();
    }  
}) //<----this

full code simplified:

$(document).ready(function() {
  $('#calendar').fullCalendar({
      header: {
        left: '',
        center: 'title',
        right: 'prev,next today'
      },
      defaultDate: '2016-03-15',
      events: [

        {
          title: 'Event',
          start: '2016-03-26T11:00:00',
          end: '2016-03-26T12:00:00',
        },
      ],
      eventClick: function(event) {
        console.log(event)
          // alert(event.start.format('MMMM Do YYYY'))
        start = event.start.format('MMMM Do YYYY'),
          end = event.end.format('MMMM Do YYYY'),
          html = '<p>Starts: ' + start + '<p>';
        html += '<p>Ends: ' + end + '<p>';
        var modal = $("#modal");
        modal.find(".modal-title").html(event.title);
        modal.find('.modal-body').html(html)
        modal.modal();
      }
    }) //<-----this one 


  $("#contact_form").submit(function() {
    var email = $("#email").val(); // get email field value
    var name = $("#name").val(); // get name field value
    var msg = $("#msg").val(); // get message field value
    var content = "Hello " + name + ", You have signed " + modal + " up to XYZ";
    $.ajax({
        type: "POST",
        url: "https://mandrillapp.com/api/1.0/messages/send.json",
        data: {
          'key': 'api',
          'message': {
            'from_email': "email",
            'text': "Hello ",
            'from_name': "name",
            'headers': {
              'Reply-To': "email"
            },
            'subject': 'Confirmation - Sign Up',
            'text': content,
            'to': [{
              'email': email,
              'name': name,
              'type': 'to'
            }]

          }
        }

      })
      .done(function(response) {
        alert('You have been signed up. Thank you!'); // show success message
        $("#name").val(''); // reset field after successful submission
        $("#email").val(''); // reset field after successful submission
        $("#msg").val(''); // reset field after successful submission

      })
      .fail(function(response) {
        alert('Error sending message.');
      });
    return false; // prevent page refresh
  });
});