Fragebogen: Unterschied zwischen den Versionen

Aus Mittel- und Neulatein macht Schule!
imported>Mnlmachtschule
(Die Seite wurde neu angelegt: „ #qTable td {padding:3px 1em; border:1px solid #ccc; border-radius:5px; background-color:#FeF; font-family:"Segoe UI"} #qTable {width:100%; border-spacing:0.5…“)
 
imported>Mnlmachtschule
(Der Seiteninhalt wurde durch einen anderen Text ersetzt: „{{FragebogenTemplate}}“)
Zeile 1: Zeile 1:
 
+
{{FragebogenTemplate}}
 
 
#qTable td {padding:3px 1em; border:1px solid #ccc; border-radius:5px; background-color:#FeF; font-family:"Segoe UI"}
 
#qTable {width:100%; border-spacing:0.5em}
 
#qTable li {cursor:pointer}
 
#qTable li:hover { text-decoration:underline}
 
#qTable tr:nth-child(n+2) {display:none}
 
#qTable p {font-weight:bold; line-height:50%}
 
 
 
#errdiv {display:none; font-weight:bold; color:#903; padding:0.3em}
 
.selectedAnswer {font-weight:bold; color:#060}
 
 
 
i {display:none}
 
 
 
 
 
 
 
<html>
 
<div id="errdiv"></div>
 
<table id="qTable" >
 
  <tr>
 
    <td><p>The Applicant is a: </p>
 
      <ul>
 
        <li>Person <i>2</i></li>
 
        <li>Corporation <i>3</i></li>
 
    </ul></td>
 
  </tr>
 
  <tr>
 
    <td><p>The person live in: </p>
 
      <ul>
 
        <li>Grande Oak Estates <i>11</i></li>
 
        <li>Other neighborhood <i>4</i></li>
 
    </ul></td>
 
  </tr>
 
  <tr>
 
    <td><p>The corporation's annual sales are:</p>
 
      <ul>
 
        <li>$5 million or more <i>10</i></li>
 
        <li>Less than $ 5 million <i>6</i></li>
 
    </ul></td>
 
  </tr>
 
  <tr>
 
    <td><p>What is the person's golf handicap?</p>
 
      <ul>
 
        <li>Less than 5 <i>8</i></li>
 
        <li>5 or more <i>5</i></li>
 
    </ul></td>
 
  </tr>
 
  <tr>
 
    <td><p>What is the person's net worth?</p>
 
      <ul>
 
        <li>$2 million or more <i>9</i></li>
 
        <li>Less than $2 million<i>7</i></li>
 
      </ul></td>
 
  </tr>
 
  <tr>
 
    <td>The corporation does not qualify for a membership </td>
 
  </tr>
 
  <tr>
 
    <td>The person does not qualify for a membership </td>
 
  </tr>
 
  <tr>
 
    <td>The person qualifies for a discounted membership</td>
 
  </tr>
 
  <tr>
 
    <td>The person qualifies for a regular membership</td>
 
  </tr>
 
  <tr>
 
    <td>The corporation qualifies for a corporate membership</td>
 
  </tr>
 
  <tr>
 
    <td>The person qualifies for a regular membership</td>
 
  </tr>
 
</table>
 
 
 
<script type="text/javascript">
 
//<![CDATA[
 
 
 
 
 
$(document).ready(function() {
 
//checks difference between number of rows and ids. If none, guide is complete and code can be removed.
 
//if a result is used in more that one question reduce the value or results by the number of reuses
 
var rows = $('#qTable tr').length - 1;
 
var liids = $('#qTable li').length;
 
if(rows  != liids) {  
 
  $('#errdiv').html('Number of rows ( ' + rows + ' ) does not match the number of questions ( ' +liids + ' )').show()
 
}
 
 
 
  $('#qTable li').on('click',function() {
 
    //style the selected answer
 
    $(this).addClass('selectedAnswer').siblings().removeClass('selectedAnswer');
 
//find the id of the first question in the graoup
 
//var q1id = $(this).parent().children('li:first').find('i').text();
 
//hide all rows after the currently displayed row and remove selectedAnswer style
 
var rowCurrent = $(this).closest("tr").prevAll("tr").length + 2;
 
var rowsAfter = ' tr:nth-child(n+' + rowCurrent + ')';
 
$('#qTable' + rowsAfter).hide().find('li').removeClass('selectedAnswer');
 
//show the next row that matches the question id
 
var italNum =  $(this).find('i').text();
 
var qNext = ' tr:nth-child(' + italNum + ')';
 
$('#qTable' + qNext).fadeIn(800);
 
//scroll code to bring next question into view
 
var qNextPos = $('#qTable' + qNext).offset();
 
var qNextTop = qNextPos.top;
 
var qNextHigh = $('#qTable' + qNext).height();
 
var qNextBot = qNextHigh + qNextTop + 20;
 
var scrHigh = $(window).innerHeight();
 
var difHigh = qNextBot - scrHigh;
 
if(difHigh > 0) {window.scrollTo(0, difHigh)}
 
})
 
})
 
  //]]>
 
</script>
 
 
 
 
 
</html>
 

Version vom 12. August 2020, 09:36 Uhr