Question T10973
Visible to All Users

Updating an existing survey Model

created 2 years ago

Hi,

How do you update an existing model?

I have the model loaded and showing using the analytics. However when I change the model adding a question and/or some possible options in an questions it then use survey.fromJSON() with the newly generated json string and then I do an updateData(jsonData) on the vispanel but the changes are not reflected until I refresh the entire page.

Thanks

Ray

Comments (3)

    Hello Ray,
    The VisualizationPanel.updateData method actually updates the visualization panel with new survey results. You can check an example here: Refresh Survey Result.

    From what I gather, you've tried this method but it didn't work, correct? Do you use a custom visualization panel?

    CG CG
    Craig Goldberg 2 years ago

      Hi Jane, Thanks for your quick response.

      I don't use custom visualization.
      Please see below some part of the code:

      After page load:

      Code
      let data = $("textarea[name='submission_data']").val(); let questions = $("textarea[name='questions']").val(); survey = new Survey.Model(JSON.parse(questions)); visPanel = new SurveyAnalytics.VisualizationPanel( survey.getAllQuestions(), JSON.parse(data), options); visPanel.showHeader = true; visPanel.render(document.getElementById("dashboard"));

      Where data contains the answers and questions is the model in json format. This works without any problems.

      Then when I add an question and/or an answer to a question I want the analytics to reflect these changes without have to reload the entire page hence I have the following javascript function:

      Code
      let questionnaire_id = $("input[name='id']").val(); pageBlockerStart(); $.ajax({ type: 'POST', url: '/questionnaire/reloadDashboard', data: { 'questionnaire_id': questionnaire_id, }, success: function (result) { if (result['status'] === 'success') { $("textarea[name='submission_data']").val(JSON.stringify(result['data']['answers'])); pageBlockerStop(); $('#submission_count')[0].innerText = result['data']['submission_count']; $("textarea[name='questions']").val(result['data']['questions']); survey.fromJSON(JSON.parse(result['data']['questions'])); window.setTimeout(function() { visPanel.updateData(JSON.parse(JSON.stringify(result['data']['answers']))); }, 1000); } else { eswal({ title: "", html: result['message'], type: 'error', showCloseButton: true, showCancelButton: false, }).then(function () { pageBlockerStop(); }); } }});
      CG CG
      Craig Goldberg 2 years ago

        Sorry the prevous comment got submitted before completed.

        The code to try to update the analytics is shown below.
        First: Doing an ajax call to retrieve the latest version of the survey which was saved previously.
        I have checked and tested the ajax call and the updated survey is indeed returned in the result['data']['questions'] variable.
        I then use the survey (global variable) as created during the onpage load function and use:
        survey.fromJSON(JSON.parse(result['data']['questions']));
        After that run the updateData function on the visPanel (also global variable) created during page onload gets run. Note. In the code I put the code in a timeout because I thought maybe there is a timing issue.

        However the analytics panel do not show any new questions and/or new answers to existing questions after calling this function. I have to reload the entire page for the changes to show. I don't want to reload the entire page to show any changes because our page uses tabs and reloading will go to the wrong tab which make the experience for our end users very cumbersome.

        Hope this helps.

        Thanks
        Ray

        Code
        let questionnaire_id = $("input[name='id']").val(); pageBlockerStart(); $.ajax({ type: 'POST', url: '/questionnaire/reloadDashboard', data: { 'questionnaire_id': questionnaire_id, }, success: function (result) { if (result['status'] === 'success') { $("textarea[name='submission_data']").val(JSON.stringify(result['data']['answers'])); pageBlockerStop(); $('#submission_count')[0].innerText = result['data']['submission_count']; $("textarea[name='questions']").val(result['data']['questions']); survey.fromJSON(JSON.parse(result['data']['questions'])); window.setTimeout(function() { visPanel.updateData(JSON.parse(JSON.stringify(result['data']['answers']))); }, 1000); } else { eswal({ title: "", html: result['message'], type: 'error', showCloseButton: true, showCancelButton: false, }).then(function () { pageBlockerStop(); }); } } });

        Answers

        created 2 years ago

        Hi Jane,

        I have been able to resolve the issue.

        Instead of using the survey.fromJSON(…) I clear the innerHTML and then run survey = new Survey.Model( <modified json questions>) and that seems to work.

        Thanks

        Ray

          Comments (1)

            Thank you for the update, Ray. Please feel free to contact us if you have any questions or require further assistance.