Untitled


<!DOCTYPE html>
<html>
<head>
  <title>Survey</title>
  <link data-turbolinks-track="true" href="/assets/select2.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/bootstrap_configuration.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/categories.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/food_ranks.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/landings.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/pages.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/surveys.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/vas_answers.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/vas_questions.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/application.css?body=1" media="all" rel="stylesheet" />
  <script data-turbolinks-track="true" src="/assets/jquery.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery_ujs.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/turbolinks.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/bootstrap.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/select2-full.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery-ui/core.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery-ui/widget.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery-ui/mouse.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery-ui/sortable.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery-ui/effect.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery-ui/effect-highlight.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/categories.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/food_ranks.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/landings.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/pages.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/surveys.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/update_food_ranks_row_position.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/vas_answers.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/vas_questions.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/application.js?body=1"></script>
  <meta content="authenticity_token" name="csrf-param" />
<meta content="/59h3G/eBdxdJ6GrXgYwxqkd5ktyPTfYjZTlnwL+RUs=" name="csrf-token" />

<meta name="viewport" content="width=device-width, initial-scale=1"/></head>
<body>

<div class="container">
	<nav class="navbar navbar-default" role="navigation">
  <!-- Brand and toggle get grouped for better mobile display -->
  <div class="navbar-header">
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse-1">
      <span class="sr-only">Toggle navigation</span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
    </button>
    <a class="navbar-brand" href="/">Survey</a>
  </div>

  <!-- Collect the nav links, forms, and other content for toggling -->
  <div class="collapse navbar-collapse" id="navbar-collapse-1">
    <ul class="nav navbar-nav">
    </ul>
    <ul class="nav navbar-nav navbar-right">
          <li class="dropdown">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Account <b class="caret"></b></a>
            <ul class="dropdown-menu">
              <li><a href="/account">Edit Account</a></li>
              <li class="divider"></li>
              <li><a data-method="delete" href="/signout" rel="nofollow">Sign Out</a></li>
            </ul>
          </li>
    </ul>
  </div><!-- /.navbar-collapse -->
</nav>


	<div class="progress">
  <div class="progress-bar progress-bar-info progress-bar-striped" role="progressbar" aria-valuenow="15" aria-valuemin="0" aria-valuemax="100" style="width: 15%">
    <span class="sr-only">15% Complete (success)</span>
  </div>
</div>

<h3>Rank the selected foods from most to least problematic </h3>


<div class="panel panel-default" style="max-width: 400px">
  <table class="table table-bordered table-striped" id="sortable">
    <col style="width: 10%">
    <thead>
      <tr>
        <th>
          Rank
        </th>
        <th>
          Food
        </th>
      </tr>
    </thead>
    <tbody>
        <tr data-item-id=3 class="item">
          <td style="font-size: 1.2em; text-align: center">
            1
          <td>
            Popcorn
          </td>
        </tr>
        <tr data-item-id=4 class="item">
          <td style="font-size: 1.2em; text-align: center">
            2
          <td>
            Crackers
          </td>
        </tr>
        <tr data-item-id=6 class="item">
          <td style="font-size: 1.2em; text-align: center">
            3
          <td>
            Salted nuts/seeds
          </td>
        </tr>
        <tr data-item-id=10 class="item">
          <td style="font-size: 1.2em; text-align: center">
            4
          <td>
            Burger/Cheeseburgers
          </td>
        </tr>
        <tr data-item-id=14 class="item">
          <td style="font-size: 1.2em; text-align: center">
            5
          <td>
            Hot dogs
          </td>
        </tr>
        <tr data-item-id=16 class="item">
          <td style="font-size: 1.2em; text-align: center">
            6
          <td>
            Strawberries
          </td>
        </tr>
        <tr data-item-id=18 class="item">
          <td style="font-size: 1.2em; text-align: center">
            7
          <td>
            Other berries (blueberries, blackberries, raspberries)
          </td>
        </tr>
        <tr data-item-id=25 class="item">
          <td style="font-size: 1.2em; text-align: center">
            8
          <td>
            Tomatoes
          </td>
        </tr>
    </tbody>
  </table>
</div>


<div style="background-color: rgb(249, 249, 249);  background-color: white;  color: rgb(51, 51, 50);
            clear: left; display: block; border: 1px solid rgb(221, 221, 221);
            float: left; font-size: 1.35em; padding-top: 6px; height: 37px; width: 39px; text-align: center">
1
</div>
<div style="background-color: rgb(249, 249, 249);  color: rgb(51, 51, 50);
            clear: left; display: block; border: 1px solid rgb(221, 221, 221);
            float: left; font-size: 1.35em; padding-top: 6px; height: 37px; width: 39px; text-align: center">
2
</div>
<div style="background-color: rgb(249, 249, 249);  background-color: white;  color: rgb(51, 51, 50);
            clear: left; display: block; border: 1px solid rgb(221, 221, 221);
            float: left; font-size: 1.35em; padding-top: 6px; height: 37px; width: 39px; text-align: center">
3
</div>
<div style="background-color: rgb(249, 249, 249);  color: rgb(51, 51, 50);
            clear: left; display: block; border: 1px solid rgb(221, 221, 221);
            float: left; font-size: 1.35em; padding-top: 6px; height: 37px; width: 39px; text-align: center">
4
</div>
<div style="background-color: rgb(249, 249, 249);  background-color: white;  color: rgb(51, 51, 50);
            clear: left; display: block; border: 1px solid rgb(221, 221, 221);
            float: left; font-size: 1.35em; padding-top: 6px; height: 37px; width: 39px; text-align: center">
5
</div>
<div style="background-color: rgb(249, 249, 249);  color: rgb(51, 51, 50);
            clear: left; display: block; border: 1px solid rgb(221, 221, 221);
            float: left; font-size: 1.35em; padding-top: 6px; height: 37px; width: 39px; text-align: center">
6
</div>
<div style="background-color: rgb(249, 249, 249);  background-color: white;  color: rgb(51, 51, 50);
            clear: left; display: block; border: 1px solid rgb(221, 221, 221);
            float: left; font-size: 1.35em; padding-top: 6px; height: 37px; width: 39px; text-align: center">
7
</div>
<div style="background-color: rgb(249, 249, 249);  color: rgb(51, 51, 50);
            clear: left; display: block; border: 1px solid rgb(221, 221, 221);
            float: left; font-size: 1.35em; padding-top: 6px; height: 37px; width: 39px; text-align: center">
8
</div>


<form action="/vas_questions" class="button_to" method="get"><div><input class="btn btn btn-primary btn-default" type="submit" value="Next" /></div></form>

</div>

</body>
</html>