view-request-responses.js

About this file

Upon showing the request responses, the previous button is disabled.
showResponses() clears out the response html and renders the history list template
loadMoreResponse() retrieves the responses log and loads the next set of responses.
When the previous button is clicked on, this indicates that the current set of responses being shown is not the starting set. The next button is then disabled. After clicking the previous button, if the starting set of responses is loaded, the previous button is then disabled. Similarly, when then the next button is clicked on, if the last set of the responses is loaded, the next button is then disabled.
For the setEditResponseWorkflow function, different cases are detected: file uploads, notes, instructions, and links.
- Files
Tinymce is enabled for specific text areas; constraints are placed on file uploads. Users can upload forms when editing a response and the upload form is validated using parsley. An error appears if the file has not been fully uploaded. Upon clicking the next button of the second modal, a save is triggered, and values are stored inside the data template. A confirmation header and email summary are then rendered. Upon clicking the submit button, the form is turned into an array of data and sent; page is then reloaded.
Required input fields are given the data-parsley-required field.
- Notes, Instructions, Links
The form is validated upon clicking the next button. If valid, the data template is filled out with the fields for the note. If not, then an error messag is displayed. If the next button of the second modal is clicked on, a save is triggered, values are stored inside the data template. A confirmation header and email summary are rendered. Upon clicking the submit button, the form is transformed into an array and is stored inside the data template. The page is reloaded.
Required fields are given the data-parsley-required field; fields are also given character limits. Character counters are displayed.
The setDeleteResponseWorkflow function handles deleting a response and disables the delete button upon deletion; it sends to the backend that the response is deleted (making deleted = true), and then reloads the page.

Code Issues

  • The switch conditions run on lines 173-628. Recommend separating the code inside the cases into different functions.
  • There are some snippets of code that sets attributes of an element several times. An example is shown below. 
      
    first.find('.note-content').attr("data-parsley-required", "");

    // Apply parsley max length validation to note content
    first.find('.note-content').attr("data-parsley-maxlength", "5000");

    // Apply custom validation messages
    first.find('.note-content').attr("data-parsley-required-message",
        "Note content must be provided");
    first.find('.note-content').attr("data-parsley-maxlength-message",
        "Note content must be less than 5000 characters");
    Recommend creating a function that takes in a query selector and an object containing the mappings of the attributes to values.

Code Check Report 




  181:29  warning  Function has a complexity of 7  complexity
  417:89  error    Unexpected trailing comma       comma-dangle
  527:89  error    Unexpected trailing comma       comma-dangle

✖ 3 problems (2 errors, 1 warning)
  2 errors and 0 warnings potentially fixable with the `--fix` option.

Documentation drawn from source code

$(function () {
   success: function (data) {
   error: function (error) {
  function showResponses() {
  function loadMoreResponses() {
    success: function (data) {
    error: function (error) {
  function getRandomString(length, chars) {
  prevButton.click(function () {
  nextButton.click(function () {
  function setEditResponseWorkflow(response_id, response_type) {
     next1.click(function (e) {
        success: function (data) {
     next2.click(function () {
       success: function (data) {
     prev2.click(function () {
     prev3.click(function () {
     submitBtn.click(function () {
       success: function () {
     next1.click(function () {
        success: function (data) {
     next2.click(function () {
       success: function (data) {
     prev2.click(function () {
     prev3.click(function () {
     submitBtn.click(function () {
       success: function (response) {
     $(first.find(".note-content")).keyup(function () {
     next1.click(function () {
        success: function (data) {
     next2.click(function () {
       success: function (data) {
       error: function (error) {
     prev2.click(function () {
     prev3.click(function () {
     submitBtn.click(function () {
       success: function (response) {
     $(first.find(".instruction-content")).keyup(function () {
     first.find("input[name='url']").on('input', function () {
     next1.click(function () {
        success: function (data) {
     next2.click(function () {
       success: function (data) {
     prev2.click(function () {
     prev3.click(function () {
     submitBtn.click(function () {
       success: function (response) {
     first.find('.title').keyup(function () {
     first.find('.url').keyup(function () {
   $(editFileTitle).keyup(function () {
  function setDeleteResponseWorkflow(response_id) {
   deleteConfirmCheck.on('paste', function (e) {
   deleteConfirmCheck.on("input", function () {
   responseModal.find(".delete-select").click(function () {
   responseModal.find(".delete-cancel").click(function () {
   responseModal.find(".delete-confirm").click(function () {
     success: function () {
     error: function (error) {

Source code