Question

In Survey, people can respond all the questions sequentially within one page or Add branching logic to answer one by one like wizards. Please refer the Image enter image description here

After creating survey with branching logic, the user has the option to jump to the next question by clicking Next. But the sad thing is SharePoint survey does not have Back Button to move to previous question. How to add the back button to Survey list in SharePoint 2013?

Was it helpful?

Solution

What is Survey in SharePoint 2013?
Survey a special kind of list that enables the owner to create questions, have multiple people to respond, and summarize the results. You can use surveys to ask people what they think about issues, how to improve your processes, and many other topics. You can collect the results by using several different types of questions, such as multiple choice, fill-in fields, and even ratings.

(Source: Create a Survey, Office Support)

Add branching logic to a survey question
Before you begin adding branching logic, create your survey and enter all the questions that you want.

  • If the survey is not already open, click its name on the Quick Launch.
  • If the name of your survey does not appear, click Settings and then click View Site Contents.

  • Locate the survey, point to it, and click the survey title.

  • On the Settings menu, click Survey Settings.

    enter image description here

  • Under Questions, click the question to which you want to add branching logic.

  • Under Branching Logic, for each possible response to the question, select the question that you want to branch to. Please refer the below image enter image description here

  • For example, if someone answers Yes to a question about home ownership, you might branch to the next question that is about owning a home. If someone answers No to the question, you may want to skip forward to a question that follows the home ownership questions. Some question types have a single Jump to option, which means that regardless of the response, the user should jump to the specified question. Question types such as Choice and Yes/No allow users to specify a branching option for each possible answer.

  • Click OK.

  • To insert additional branches to your survey, repeat steps 3 through 5.

NOTES:

You cannot specify a branching option for each possible answer for Choice question types with the Checkboxes (allow multiple selections) display option. You can only choose a single Jump to option for this question type. If you want to change the order of the questions in your survey, you should first evaluate any impact on the branching. If you reorder a survey so that the question that followed the branching logic is now before the question that contains the branching logic, the branching logic will be removed. A question can only branch to questions that follow it.

(Source: Add a branching logic to a survey, Office Support)

Problem Solution
Using JQuery & HTML5 Local storage we can achieve this problem. Follow the steps to add back button to the survey questions

  • Open SharePoint Designer 2013
  • Click Open Site and give the corresponding URL of the survey list
  • In List and Libraries, Select the survey list created
  • In the forms tab, Right click on NewForm.aspx and click Edit File in Advanced Mode.
  • Paste the below code in the NewForm.aspx

    $(document).ready(function () {
    SP.SOD.executeFunc('sp.js', 'SP.ClientContext', execOperation);
    });
    function execOperation() {
    try {
    clientContext = new SP.ClientContext.get_current();
    }
    catch (err) {
    alert('Unable to get Context' + err);
    }
    }
    ExecuteOrDelayUntilScriptLoaded(appplyLogic, 'sp.js');
    function appplyLogic()
    {
    var nextButton = $('input[value=\'Next\']');
    nextButton.bind("click", function(){
    var cLoc = window.location.href;
    if(cLoc.toLowerCase().indexOf('newform.aspx') > -1)
    {
    localStorage.next = '';
    localStorage.next = cLoc + "$";
    }
    else
    {
    localStorage.next += cLoc + "$";
    }
    });
    }

  • Click the opened Survey list tab

  • In the forms tab, Right click on EditForm.aspx and click Edit File in Advanced Mode.

  • Paste the below code in the EditForm.aspx

    $(document).ready(function () {
    SP.SOD.executeFunc('sp.js', 'SP.ClientContext', execOperation);
    });

    function execOperation() {
    try {
    clientContext = new SP.ClientContext.get_current();
    }
    catch (err) {
    alert('Unable to get Context' + err);
    }
    }
    ExecuteOrDelayUntilScriptLoaded(appplyLogic, 'sp.js');
    function appplyLogic()
    {
    var nextButton = $('input[value=\'Next\']');
    if(nextButton.length == 0)
    {
    nextButton = $('input[value=\'Finish\']');
    }
    nextButton.parent('td').before('');
    nextButton.bind("click", function(){
    var cLoc = window.location.href;
    if(cLoc.toLowerCase().indexOf('newform.aspx') > -1)
    {
    localStorage.next = '';
    //cLoc = cLoc.substring(0, cLoc.indexOf('newform.aspx'));
    localStorage.next = cLoc + "$";
    //window.location = cLoc ;

    }
    else
    {
    localStorage.next += cLoc + "$";
    }
    });
    }

    function getBack()
    {
    var cLoc = window.location.href;
    var str = localStorage.next;
    if (str.charAt(str.length - 1) == '$') {
    str = str.substr(0, str.length - 1);
    }
    var n = str.lastIndexOf('$');
    var result = str.substring(n + 1);
    var withoutLastDollar = str.slice(0, str.lastIndexOf("$"));
    localStorage.next = withoutLastDollar + "$";
    if(cLoc.toLowerCase().indexOf('newform.aspx') > -1)
    {
    localStorage.next= "";
    window.location = cLoc ;

    }
    else
    {
    window.location = result;

    }
    }

  • Click Save

  • After the above steps are completed you survey is looking like this. Please refer the below imageenter image description here

OTHER TIPS

Using local storage was a good idea. Here's a version that works a little better. Put it in a script editor on EditForm.aspx. No need to do anything to NewForm.aspx:

<script>

$(document).ready(function () { 
  SP.SOD.executeFunc('sp.js', 'SP.ClientContext', applyLogic); 
});

//ExecuteOrDelayUntilScriptLoaded(applyLogic, 'sp.js'); 
function applyLogic()
{

  var isBack = localStorage.getItem('isBack');
  if (isBack == 'true') {
    localStorage.setItem('isBack', 'false');
    goBack();
  }

  var nextButton = $('input[value="Next"]');
  if(nextButton.length == 0) 
  {
    nextButton = $('input[value="Finish"]'); 
  }
  var firstField = getParameterByName("FirstField");
  if (firstField != "")
  {
    nextButton.parent('td').before('<input id="btnBack" type="button" value="Back" />');
    var backButton = $('input#btnBack');
    backButton.attr('class', 'ms-ButtonHeightWidth');
    backButton.click(function () { 
      if ($('input[value="Finish"]').length == 0) // only trigger next if next != finish...
      {
        localStorage.setItem('isBack', 'true');
        nextButton.trigger('click'); 
      }
      else {
        goBack();
      }
    });
  }

  nextButton.bind("click", function(){
    var isBack = localStorage.getItem('isBack');
    if (isBack != 'true')
    {
      var cLoc = window.location.href; 
      var firstField = getParameterByName("FirstField");

      if (!localStorage.next || firstField == '') // is first page or localstorage.next undefined
        localStorage.next = '';

      localStorage.next += cLoc + "$"; 
    }
  });
}


function goBack()
{
  var cLoc = window.location.href; 
  var str = localStorage.next; 
  if (!str)
    str = '';

  if (str.charAt(str.length - 1) == '$') {
    str = str.substr(0, str.length - 1); 
  }
  var n = str.lastIndexOf('$'); 
  var result = str.substring(n + 1); 
  var withoutLastDollar = str.slice(0, str.lastIndexOf("$"));
  if (n>-1)
    localStorage.next = withoutLastDollar + "$";
  if (result + '' == '' || (result+'').toLowerCase().indexOf('newform.aspx')>-1) {
    localStorage.next = '';
    location.href = "EditForm.aspx?ID=" + getParameterByName("ID");
  }
  else
    window.location = result; 
}


function getParameterByName(name) {
    name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
        results = regex.exec(location.search);
    return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}

</script>

Some code is borrowed from Gertjan's 2010 solution: http://gertjanvanmontfoort.blogspot.ca/2013/11/sharepoint-survey-back-button.html

Licensed under: CC-BY-SA with attribution
Not affiliated with sharepoint.stackexchange
scroll top