Databases
StackOverflow2013
Postsdbo
POHow can I return user to a specific div working with current code
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow can I return user to a specific div working with current code
    text
    copied!<p>I have a form questionnaire with 12 divisions. The first <code>div</code> is display block and the others are display none. The div's are then shown and hidden with a tab function on click. The last div is a review of the form which is loaded by an ajax call. The code below is working fine up to the point where I want to add a button so user can go back and answer the unanswered questions</p> <p><strong><em></strong> this code is working fine <strong></em>**</strong> $(document).ready(function () { var tab_pool = ["Q1", "Q2", "Q3", "Q4", "Q5", "Q6", "Q7", "Q8", "Q9", "Q10", "Q11", "Q12"]; var visible = $(".tab:visible").attr('class').split(" ")[1]; var curr_ind = $.inArray(visible, tab_pool);</p> <pre><code> $('.next').click(function () { $("#processing").show(); $.ajax({ type: "POST", url: "process.php", data: $('.data').serialize() + "&amp;data=" + data, success: function (data, status, xhr) { if (xhr.getResponseHeader("DB_SUCCESS") == 1) { $("#processing").hide(); } else { $("#processing").hide(); alert("Save failed"); return false; } } }); // There are conditions here such as if this then // curr_ind = curr_ind + whatever to move to next relevant question if (curr_ind &lt; 11) { $(".tab:visible").delay(750).hide(0); $("#processing").delay(750).hide(0); curr_ind = curr_ind + 1; $("." + tab_pool[curr_ind]).delay(750).show(0); $(".finished").delay(750).hide(0); $(".back").delay(750).show(0); } // if the user has reached the end then below we show the review of questionaire if (curr_ind === 11) { $("#processing").delay(750).hide(0); $(".finished").delay(750).show(0); $.ajax({ type: "POST", url: 'review.php', data: "username=" + username, success: function (data, status, xhr) { if (xhr.getResponseHeader("DB_SUCCESS") == 1) { $("#review").show(); $('#review').html(data); } else { alert("Review not available"); return false; } } }); } }); // after the first question a back button is display for // user to go back to previous question $('.back').click(function () { if (curr_ind &gt; 0) { $(".tab:visible").hide(); // There ar conditions here so user is brought back to // the right div and not one that was skipped from conditions above $("." + tab_pool[curr_ind]).show(); document.getElementById(tab_pool[curr_ind]).checked=false; $(".finished").hide(); $(".next").show(); } if (curr_ind === 0) { $(".back").hide(); } }); </code></pre> <p><em><strong></em></strong> end working code <strong>**</strong></p> <pre><code>// **** what I want here is a button for unanswered questions that will bring user // back to that specific unaswered question // I tried assigning a class and a numeric value to those buttons but // for some reason I get a new blank page??? // I tried a few variations of the code below function answerQ (value) { var returnTo = value; curr_ind = curr_ind - returnTo; $(".tab:visible").hide(); $("." + tab_pool[curr_ind]).show(); document.getElementById(tab_pool[curr_ind]).checked=false; $(".finished").hide(); $(".back").hide(); $(".next").show(); } }); </code></pre> <p><em>*</em>* a sample of the button to go back to unanswered question</p> <p>ANSWER</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload