yesod-myblog/templates/homepage.julius

document.getElementById(#{toJSON aDomId}).innerHTML = "This text was added by the Javascript part of the homepage widget.";

$(function() {
  $("##{rawJS commentFormId}").submit(function(event) {
    event.preventDefault();

    var message = $("##{rawJS commentTextareaId}").val();
    // (Browsers that enforce the "required" attribute on the textarea won't see this alert)
    if (!message) {
      alert("Please fill out the comment form first.");
      return;
    }

    // Make an AJAX request to the server to create a new comment
    $.ajax({
      url: '@{CommentR}',
      type: 'POST',
      contentType: "application/json",
      data: JSON.stringify({
        message: message,
      }),
      success: function (data) {
        var newNode = $("<li></li>");
        newNode.text(data.message);
        console.log(data);
        $("##{rawJS commentListId}").append(newNode);
      },
      error: function (data) {
        console.log("Error creating comment: " + data);
      },
    });

  });
});