0
\$\begingroup\$

I am working on a web page where I am creating a JS object using {} and []. This object is passed into a handler. I wanted to see if there is a better way to create the object in JavaScript

My logic

Is to build the object is JS and then pass it into the Handler to be Deserialize and then saved into the db.

Can anyone please review this code and point out the mistakes/how to make the implementation better?

const MeetingPollingQuestionTypeId = {
    LongAnswerText: 1,
    MultipleChoice: 2,
    MultipleChoiceGrid:3
};

const MeetingPollingPartsTypeId = {
    Question: 1,
    Image: 2,
    Answer: 3
};

const MeetingPollingPartsValuesTypeId = {
    Label: 1,
    Img: 2,
    Radio:3
}

function saveMultipleChoice() {
    console.log('%c saveMultipleChoice ', 'background: #222; color: #bada55');

    let sequenceorder = fnSequenceOrder();


    MeetingPollingQuestion = {};
    MeetingPollingQuestion.MeetingPollingId = $("#hfMeetingPollingId").val();
    MeetingPollingQuestion.MeetingPollingQuestionType = "MultipleChoice";
    MeetingPollingQuestion.SequenceOrder = sequenceorder;
    MeetingPollingQuestion.MeetingPollingParts = [];

    MeetingPollingParts = {};
    MeetingPollingParts.MeetingPollingPartsTypeId = MeetingPollingPartsTypeId.Question; 
    MeetingPollingParts.MeetingPollingPartsValues = [];

    MeetingPollingPartsValues = {};
    MeetingPollingPartsValues.MeetingPollingPartsValuesTypeId = MeetingPollingPartsValuesTypeId.label,
    MeetingPollingPartsValues.QuestionValue = $("#editor").data("kendoEditor").value();

    MeetingPollingParts.MeetingPollingPartsValues.push(MeetingPollingPartsValues);
    MeetingPollingQuestion.MeetingPollingParts.push(MeetingPollingParts);

    MeetingPollingParts = {};
    MeetingPollingParts.MeetingPollingPartsTypeId = MeetingPollingPartsTypeId.Image;
    MeetingPollingParts.MeetingPollingPartsValues = [];

    MeetingPollingPartsValues = {};
    MeetingPollingPartsValues.Type = "FileManagerId";
    MeetingPollingPartsValues.FileManagerId = $("#hfFileManagerId").val();

    MeetingPollingParts.MeetingPollingPartsValues.push(MeetingPollingPartsValues);
    MeetingPollingQuestion.MeetingPollingParts.push(MeetingPollingParts);

    MeetingPollingParts = {};
    MeetingPollingParts.MeetingPollingPartsTypeId = MeetingPollingPartsTypeId.Answer;
    MeetingPollingParts.MeetingPollingPartsValues = [];

    var items = $("#selectanswer").data("kendoMultiSelect");
    var selectedDataItems = items.dataItems();

    $(selectedDataItems).each(function () {
        MeetingPollingPartsValues = {};
        MeetingPollingPartsValues.MeetingPollingPartsValuesTypeId = MeetingPollingPartsValuesTypeId.Radio
        MeetingPollingPartsValues.QuestionValue = this.text;
        MeetingPollingParts.MeetingPollingPartsValues.push(MeetingPollingPartsValues);
    });

    MeetingPollingParts.MeetingPollingPartsValues.push(MeetingPollingPartsValues);
    MeetingPollingQuestion.MeetingPollingParts.push(MeetingPollingParts);



    console.log(MeetingPollingQuestion);

    Metronic.blockUI({ boxed: true, message: "Saving Question.." });
    $.ajax({
        type: 'POST',
        url: 'ManagePolling.ashx',
        data: { "PollingQuestion": JSON.stringify(MeetingPollingQuestion), "Action": "SaveQuestion" },
        datatype: "JSON",
        success: function (data) {
            if (data.resultStatus.ResultCode == "1") {
                toastr.success("Saved successfully", "Success");
                console.log('%c MeetingPollingQuestion Success! ', 'background: #222; color: #bada55');
                htmlBuilderMultipleChoice(MeetingPollingQuestion);
            }
            if (data.resultStatus.ResultCode == "2")
                toastr.warning(data.resultStatus.Message, "Warning");
            if (data.resultStatus.ResultCode == "3")
                toastr.warning(data.resultStatus.Message, "Error");
            Metronic.unblockUI();
        },
        error: function (data) {
            toastr.error('An error has occured! \n' + data.resultStatus.Message);
            Metronic.unblockUI();
        }

    });
}
\$\endgroup\$
7
  • \$\begingroup\$ What does this code do? The title/main question is too generic and there's no context to review this code by. \$\endgroup\$
    – ggorlen
    Nov 3, 2022 at 14:12
  • \$\begingroup\$ I updated the title and add some context. \$\endgroup\$
    – Jefferson
    Nov 3, 2022 at 14:21
  • 1
    \$\begingroup\$ Thanks, but it still feels like a snippet from some larger project. Usually, I want to review a self-contained, complete app I can execute or at least evaluate in full. An example of missing context that makes a complete review impossible: MeetingPollingQuestion = {}; and so forth seem like they're creating globals on the window, but I can't tell for sure. The HTML is missing. What's Metronic and toastr? Are you using third-party frameworks/libraries here? \$\endgroup\$
    – ggorlen
    Nov 3, 2022 at 14:39
  • \$\begingroup\$ MeetingPollingQuestion = {}; is a Object initializer for building the object that will be inserted into a database. \$\endgroup\$
    – Jefferson
    Nov 3, 2022 at 15:06
  • \$\begingroup\$ I understand that. I think you missed the point of my above prompt. Without const, let or var, that's a global variable attached to the window, which is extremely poor practice and would be flagged by any linter or reviewer, but maybe you have those declarations in an enclosing scope for some reason? Impossible to say because an incomplete snippet was all that was provided. \$\endgroup\$
    – ggorlen
    Nov 3, 2022 at 15:08

1 Answer 1

0
\$\begingroup\$

It is better that you use ECMAScript standards.

Here is a slightly revised version of your code in ECMAScript:

const MeetingPollingQuestionTypeId = {
  LongAnswerText: 1,
  MultipleChoice: 2,
  MultipleChoiceGrid: 3,
};

const MeetingPollingPartsTypeId = {
  Question: 1,
  Image: 2,
  Answer: 3,
};

const MeetingPollingPartsValuesTypeId = {
  Label: 1,
  Img: 2,
  Radio: 3,
};

const saveMultipleChoice = () => {
  console.log("%c saveMultipleChoice ", "background: #222; color: #bada55");

  let sequenceorder = fnSequenceOrder();

  let MeetingPollingQuestion = {};
  MeetingPollingQuestion.MeetingPollingId = $("#hfMeetingPollingId").val();
  MeetingPollingQuestion.MeetingPollingQuestionType = "MultipleChoice";
  MeetingPollingQuestion.SequenceOrder = sequenceorder;
  MeetingPollingQuestion.MeetingPollingParts = [];

  let MeetingPollingParts = {};
  MeetingPollingParts.MeetingPollingPartsTypeId =
    MeetingPollingPartsTypeId.Question;
  MeetingPollingParts.MeetingPollingPartsValues = [];

  let MeetingPollingPartsValues = {};
  (MeetingPollingPartsValues.MeetingPollingPartsValuesTypeId =
    MeetingPollingPartsValuesTypeId.label),
    (MeetingPollingPartsValues.QuestionValue = $("#editor")
      .data("kendoEditor")
      .value());

  MeetingPollingParts.MeetingPollingPartsValues.push(MeetingPollingPartsValues);
  MeetingPollingQuestion.MeetingPollingParts.push(MeetingPollingParts);

  MeetingPollingParts = {};
  MeetingPollingParts.MeetingPollingPartsTypeId =
    MeetingPollingPartsTypeId.Image;
  MeetingPollingParts.MeetingPollingPartsValues = [];

  MeetingPollingPartsValues = {};
  MeetingPollingPartsValues.Type = "FileManagerId";
  MeetingPollingPartsValues.FileManagerId = $("#hfFileManagerId").val();

  MeetingPollingParts.MeetingPollingPartsValues.push(MeetingPollingPartsValues);
  MeetingPollingQuestion.MeetingPollingParts.push(MeetingPollingParts);

  MeetingPollingParts = {};
  MeetingPollingParts.MeetingPollingPartsTypeId =
    MeetingPollingPartsTypeId.Answer;
  MeetingPollingParts.MeetingPollingPartsValues = [];

  let items = $("#selectanswer").data("kendoMultiSelect");
  let selectedDataItems = items.dataItems();

  $(selectedDataItems).each(() => {
    MeetingPollingPartsValues = {};
    MeetingPollingPartsValues.MeetingPollingPartsValuesTypeId =
      MeetingPollingPartsValuesTypeId.Radio;
    MeetingPollingPartsValues.QuestionValue = this.text;
    MeetingPollingParts.MeetingPollingPartsValues.push(
      MeetingPollingPartsValues
    );
  });

  MeetingPollingParts.MeetingPollingPartsValues.push(MeetingPollingPartsValues);
  MeetingPollingQuestion.MeetingPollingParts.push(MeetingPollingParts);

  console.log(MeetingPollingQuestion);

  Metronic.blockUI({ boxed: true, message: "Saving Question.." });
  $.ajax({
    type: "POST",
    url: "ManagePolling.ashx",
    data: {
      PollingQuestion: JSON.stringify(MeetingPollingQuestion),
      Action: "SaveQuestion",
    },
    datatype: "JSON",
    success: (data) => {
      if (data.resultStatus.ResultCode == "1") {
        toastr.success("Saved successfully", "Success");
        console.log(
          "%c MeetingPollingQuestion Success! ",
          "background: #222; color: #bada55"
        );
        htmlBuilderMultipleChoice(MeetingPollingQuestion);
      }
      if (data.resultStatus.ResultCode == "2")
        toastr.warning(data.resultStatus.Message, "Warning");
      if (data.resultStatus.ResultCode == "3")
        toastr.warning(data.resultStatus.Message, "Error");
      Metronic.unblockUI();
    },
    error: (data) => {
      toastr.error("An error has occured! \n" + data.resultStatus.Message);
      Metronic.unblockUI();
    },
  });
}
\$\endgroup\$
7
  • 1
    \$\begingroup\$ -1 This is a very poor quality answer. Be specific, explain your reasoning, don't add large blocks of code without details of what and where the focus of the review is. \$\endgroup\$
    – Blindman67
    Nov 4, 2022 at 0:47
  • \$\begingroup\$ @Blindman67 Oh I did tell that tho, this answer uses EcmaScript while the previous was old vanilla JavaScript, I didn't see much besides that. \$\endgroup\$ Nov 4, 2022 at 1:08
  • \$\begingroup\$ Thanks for the rewrite, but this doesn't explain much of anything beyond that. If you run this through eslint I'd anticipate quite a few warnings. \$\endgroup\$
    – ggorlen
    Nov 4, 2022 at 2:16
  • 1
    \$\begingroup\$ @ggorlen Very much agreed, I wrote what I could at the time. Besides, a code review here doesn't have to be a full one (Right?). Different answers may cover different topics or the same topic better than the other. That being said, I welcome you to write an improved version of my answer maybe with some more points or edit mine to help the OP as much as possible. \$\endgroup\$ Nov 4, 2022 at 10:50
  • 1
    \$\begingroup\$ I don't think you can delete it since it's accepted. No worries, life goes on, and thanks for the answer anyway. \$\endgroup\$
    – ggorlen
    Nov 4, 2022 at 17:33

Not the answer you're looking for? Browse other questions tagged or ask your own question.