saucelabs/the-internet

Add an example for read-only fields

ChrisLMerrill opened this issue · 0 comments

I whipped up a read-only fields example, but was unable to get it working in the docker image linked from the main page (other things were broken, too...seemed like the image is out of date).

Here is the readonly.erb file I had created. I have exceeded the time I can spend trying to setup an environment to test it in :( Hopefully you can try it out and include in a future update?

<div class="example">
  <h3>Read-only Inputs</h3>
  <form id='readonly'>
    <input type="checkbox" id="checkbox"> Text field is read-only</br>
    <input type="text" id="textfield" value="I am editable">
  </form>
</div>
<script>
var checkbox = form.getElementById('checkbox');
checkbox.onclick = function() {
	var textfield = form.getElementById('textfield');
    if (this.checked) {
   		textfield.setAttribute("readonly", "");
      	textfield.setAttribute("value", "You cannot change me");
    }
    else {
    	textfield.removeAttribute("readonly");
    	textfield.setAttribute("value", "I am editable");
    }
}
</script>