Add regex validation [A-Z0-9]{6} for input
Don't block submition, but give the user a red bar. Also a link to overview. Esp if it is 5+ sec to load, we don't need it 90%+ the time, don't page through it in the scan print workflow.
This commit is contained in:
		
							parent
							
								
									f25f85f86e
								
							
						
					
					
						commit
						4b5fe34335
					
				
					 1 changed files with 31 additions and 6 deletions
				
			
		|  | @ -8,19 +8,44 @@ | |||
| 
 | ||||
| {% block body %} | ||||
|     <div> | ||||
|         <div class="form-group"> | ||||
|             <label for="bpcode">Boarding Pass Code</label> | ||||
|         <div id="code_div" class="form-group has-feedback has-error"> | ||||
|             <label class="control-label" for="bpcode">Boarding Pass Code</label> | ||||
|             <input id="bptext" type="text" class="form-control" id="bpcode" placeholder="Code"> | ||||
|             <span id="input_icon" class="glyphicon glyphicon-remove form-control-feedback" aria-hidden="true"></span> | ||||
|             <span id="help_ok" class="help-block" style="display: none;">Format appears OK</span> | ||||
|             <span id="help_ur" class="help-block" style="display: block;">Format doesn't match</span> | ||||
|         </div> | ||||
|         <button id="bpredir" class="btn btn-default">Submit</button> | ||||
|         <button id="clear" class="btn btn-default">Clear</button> | ||||
|         <button id="bpredir" class="btn btn-primary">Submit</button> | ||||
|         <button id="clear" class="btn btn-danger">Clear</button> | ||||
|         <a type=button" class="btn btn-info pull-right" href="{% url 'regidesk:boarding_overview' %}">Overview</a> | ||||
|     </div> | ||||
|     <script type="text/javascript"> | ||||
|         var code_div = document.getElementById("code_div"); | ||||
|         var icon = document.getElementById("input_icon"); | ||||
|         var tb = document.getElementById("bptext"); | ||||
|         var ok = document.getElementById("help_ok"); | ||||
|         var unk = document.getElementById("help_ur"); | ||||
|         var re = new RegExp('^[A-Z0-9]{6}$'); | ||||
|         document.getElementById("bpredir").onclick = function() { | ||||
|             location.href = document.getElementById("bptext").value; | ||||
|             location.href = tb.value; | ||||
|         }; | ||||
|         document.getElementById("clear").onclick = function() { | ||||
|             document.getElementById("bptext").value = ""; | ||||
|             tb.value = ""; | ||||
|         }; | ||||
|         tb.oninput = function() { | ||||
|             is_good = re.test(tb.value); | ||||
|             if (is_good) { | ||||
|                 code_div.className = "form-group has-feedback has-success"; | ||||
|                 icon.className = "glyphicon glyphicon-ok form-control-feedback"; | ||||
|                 ok.style.display = "block"; | ||||
|                 unk.style.display = "none"; | ||||
|             } else { | ||||
|                 code_div.className = "form-group has-feedback has-error"; | ||||
|                 icon.className = "glyphicon glyphicon-remove form-control-feedback"; | ||||
|                 ok.style.display = "none"; | ||||
|                 unk.style.display = "block"; | ||||
|             } | ||||
|             console.log(is_good); | ||||
|         }; | ||||
|     </script> | ||||
| {% endblock %} | ||||
|  |  | |||
		Loading…
	
	Add table
		
		Reference in a new issue
	
	 Sachi King
						Sachi King