Difference between revisions of "Dev/Forms"

 
(43 intermediate revisions by the same user not shown)
Line 18: Line 18:
  
  
 +
.super_user_view, #permission_edit, #permission_submit {
 +
display:none;
 +
}
 +
 +
#permission_view {
 +
display: initial;
 +
}
 +
 +
 +
#permission_view::before {
 +
content: "view";
 +
}
 +
 +
 +
#permission_edit::before {
 +
content: "edit";
 +
}
 +
 +
 +
#permission_submit::before {
 +
content: "submit";
 +
}
 +
 +
 +
#save_form {
 +
background-color:red;
 +
font-weight: bold;
 +
padding: 15px;
 +
cursor:pointer;
 +
color: white;
 +
border-radius: 5%;
 +
width: 10%;
 +
text-align:center;
 +
}
 +
 +
#save_form:hover{
 +
background-color:white;
 +
color:red;
 +
}
  
 
</style>
 
</style>
Line 101: Line 140:
 
<p> Current message:  <span id="software_messages"> </span> </p>
 
<p> Current message:  <span id="software_messages"> </span> </p>
  
−
<p> This is your user name: <span id="user_name_placeholder"></span> </p>
+
<p> Welcome, <span id="user_name_placeholder"></span> !</p>
  
  
−
<p> Are you a super user? <span id="super_user_placeholder"> </span> </p>
+
<p class="super_user_view"> </p>
  
 
<br>
 
<br>
Line 114: Line 153:
  
 
<p> Your role is:  <span id="user_role" class="refresh_for_new_form"> </span> </p>
 
<p> Your role is:  <span id="user_role" class="refresh_for_new_form"> </span> </p>
 +
 +
 +
<p> You can:  <span id="permission_view"> </span>  -  <span id="permission_edit"> </span> -  <span id="permission_submit"> </span> this form </p>
  
 
</div>
 
</div>
Line 126: Line 168:
  
 
-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
 
-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
−
 
+
<form>
 
<fieldset>
 
<fieldset>
  
Line 135: Line 177:
 
 
  
 +
 
<!------------------------------------------------------------ Question 1 ------------------------------------------------------------->
 
<!------------------------------------------------------------ Question 1 ------------------------------------------------------------->
  
−
<p class="question">1. Name <input type="text" data-form-field="example_text" placeholder="Place text here"></p>
+
 
 +
<p class="question">1. Name <input type="text" name="example_text" data-form-field="example_text" placeholder="Place text here"></p>
 +
 
  
 
<!------------------------------------------------------------ Question 2 ------------------------------------------------------------->
 
<!------------------------------------------------------------ Question 2 ------------------------------------------------------------->
Line 143: Line 188:
 
<p class="question">2. Example radio select </p>
 
<p class="question">2. Example radio select </p>
 
<ul>
 
<ul>
−
<li><label><input type="radio" data-form-field="example_radio" value="radio_option_1"> Option 1 </label></li>
+
<li><label><input type="radio" data-form-field="example_radio_1" value="radio_option_1"> Option 1 </label></li>
−
<li><label><input type="radio" data-form-field="example_radio" value="radio_option_2"> Option 2 </label></li>
+
<li><label><input type="radio" data-form-field="example_radio_2" value="radio_option_2"> Option 2 </label></li>
−
<li><label><input type="radio" data-form-field="example_radio" value="radio_option_3"> Option 3 </label></li>
+
<li><label><input type="radio" data-form-field="example_radio_3" value="radio_option_3"> Option 3 </label></li>
 
  </ul>
 
  </ul>
  
Line 161: Line 206:
  
 
<ul>
 
<ul>
−
<li><label><input type="checkbox" data-form-field="checkbox_option_1"> Option 1 </label></li>
+
<li><label><input type="checkbox" data-form-field="checkbox_option_1" value="checkbox_option_1"> Option 1 </label></li>
−
<li><label><input type="checkbox" data-form-field="checkbox_option_2"> Option 2 </label></li>
+
<li><label><input type="checkbox" data-form-field="checkbox_option_2" value="checkbox_option_2"> Option 2 </label></li>
−
<li><label><input type="checkbox" data-form-field="checkbox_option_3"> Option 3 </label></li>
+
<li><label><input type="checkbox" data-form-field="checkbox_option_3" value="checkbox_option_3"> Option 3 </label></li>
 
</ul>
 
</ul>
  
Line 176: Line 221:
 
</select>
 
</select>
  
 +
 +
<p class="question">Save? </p>
 +
<div id="save_form"> SAVE FORM<div>
 
</div>
 
</div>
  
Line 191: Line 239:
  
 
<fieldset>
 
<fieldset>
 +
 +
 +
 +
 +
 
<div class="column full_size">
 
<div class="column full_size">
  
−
<h2>2.-  Submit  </h2>
+
 
  
 
<p class="question"> Submit form? </p>
 
<p class="question"> Submit form? </p>
Line 201: Line 254:
 
</div>
 
</div>
 
</fieldset>
 
</fieldset>
−
 
+
</form>
  
  
 
</div> <!-- end of formbody -->
 
</div> <!-- end of formbody -->
 +
 +
 +
 +
 +
 +
<!------------------------------------------------------------SAFETY LOADING DATA TESTS -------------------------------------------------------
 +
 +
 +
 +
<p>Name <input type="text" name="Team member Name" data-form-field="corr_team_member_name" placeholder="Name"></p>
 +
 +
 +
 +
 +
<p class="question">7. Who is responsible for the safety of biology labs at your institution? What are the guidelines for laboratory biosafety? Please give a link to these guidelines, or briefly describe them if you cannot give a link.</p>
 +
<textarea rows="3" name="7. Your institution's biosafety" data-form-field="institution_biosafety"></textarea>
 +
 +
 +
 +
 +
<h3> Biosafety Level </h3>
 +
<p class="question">2. What is the Safety Level of your lab? </p>
 +
 +
<ul>
 +
<li><label><input type="radio" name="lab_safety_level" data-form-field="lab_bsl" value="bsl_1"> Level 1 (low risk)</label></li>
 +
<li><label><input type="radio" name="lab_safety_level"  data-form-field="lab_bsl" value="bsl_2"> Level 2 (moderate risk)</label></li>
 +
<li style="color: #a0a0a0;"><label><span class="wrapper"><input type="radio" disabled id="bsl_3"></span> Level 3 (high risk)</label></li>
 +
<li style="color: #a0a0a0;"><label><span class="wrapper"><input type="radio" disabled id="bsl_4"></span> Level 4 (extreme risk)</label></li>
 +
<li><label><input type="radio"  name="lab_safety_level" data-form-field="lab_bsl" value="bsl_none"> Our team is not doing any wet-lab work</label></li>
 +
<li><label><input type="radio" name="lab_safety_level"  data-form-field="lab_bsl" value="bsl_other"> Other safety level:</label> <textarea rows="2" name="Other safety level (describe)" data-form-field="bsl_other_describe" data-validation="[value=bsl_other]" placeholder="Please describe"></textarea></li>
 +
 +
<li><label><input type="radio" name="lab_safety_level" data-form-field="lab_bsl" value="bsl_multiple"> We have several different lab spaces with different Safety Levels:</label> <textarea rows="2" name="Different safety levels (describe)" data-form-field="bsl_multiple_describe" data-validation="[value=bsl_multiple]" placeholder=" Please describe what experiments you do in each space"></textarea></li>
 +
 +
 +
<li><label><input type="radio"name="lab_safety_level"  data-form-field="lab_bsl" value="bsl_unknown"> Unknown (please comment):</label> <textarea rows="2" name="Safety level unknown (comment)" data-form-field="bsl_unknown_describe" data-validation="[value=bsl_unknown]" placeholder="Please describe"></textarea></li>
 +
</ul>
 +
 +
 +
 +
 +
 +
 +
<p class="question">5. Please briefly describe the topics that you learned about (or will learn about) in your safety training.</p>
 +
 +
<ul>
 +
<li><input type="checkbox"  name="learn" data-form-field="learn_lab_access" value="learn_lab_access_and_rules"> Lab access and rules (including appropriate clothing, eating and drinking, etc.) </label></li>
 +
<li><input type="checkbox" name="learn" data-form-field="learn_responsible" value="learn_responsible"> Responsible individuals (such as lab or departmental specialist or institutional biosafety officer) </label></li>
 +
<li><input type="checkbox"  name ="learn" data-form-field="learn_biosafety_lvl" value="learn_biosafety_levels">Differences between biosafety levels </label></li>
 +
<li><input type="checkbox"  name="learn" data-form-field="learn_biosafety_equip" value="learn_biosafety_equipment">Biosafety equipment (such as biosafety cabinets) </label></li>
 +
<li><input type="checkbox" name="learn" data-form-field="learn_biosafety_microbal" value="learn_biosafety_good_microbal_technique"> Good microbial technique (such as lab practices)</label></li>
 +
<li><input type="checkbox" name="learn" data-form-field="learn_disinfection" value="learn_disinfection"> Disinfection and sterilization </label></li>
 +
<li><input type="checkbox" name="learn" data-form-field="learn_emergency" value="learn_emergency"> Emergency procedures </label></li>
 +
<li><input type="checkbox" name="learn" data-form-field="learn_transport" value="learn_transport"> Transport rules </label></li>
 +
<li><input type="checkbox" name="learn" data-form-field="learn_fire_elect" value="learn_chemicals_fire_electrical">Chemicals, fire and electrical safety </label></li>
 +
<li><input type="checkbox" name="learn" data-form-field="learn_other_m" value="learn_other"> We will not have safety training: </label> <textarea rows="2" name="learn" data-form-field="learn_other_describe" data-validation="[data-form-field=learn_other_m]" placeholder="Please comment"></textarea></li>
 +
 +
</ul>
 +
 +
 +
 +
---->

Latest revision as of 21:18, 20 March 2018

MENU
Loading...


You have JavaScript disabled.

This page requires JavaScript in order to function correctly. Please enable JavaScript in your browser, then try again.

Example Form

This is the example form you can use to create new ones!

Example Form

Team Selection

Please choose a team

Current message:

Welcome, !


You selected team:

Are you in this team?

Your role is:

You can: - - this form

1.- Section Title

1. Name

2. Example radio select

3. Example text area

4. Example checkbox

5. Example dropdown

Save?

SAVE FORM

Submit form?