I want to make the contents within a DIV uneditable but still viewable.
<div id="committee"><?php include 'committee_members_list.php'; ?></div>
The DIV holds the contents of an 'included' file within it. I would like the contents to be viewable but not editable or clickable.
The content of the DIV looks as above.
NB: The text and textarea elements are not in the included file that's in the DIV
Everything in the DIV should be viewable as it is but nothing should be clickable/editable. How can i achieve/implement this?
Well, you could make all elements in a div container uneditable via JQuery if you want it fast and dynamic.
<div id="committee">
<?php include 'committee_members_list.php'; ?>
</div>
<script type="text/javascript">
$("#committee").each(function() {
$(this).attr("readonly", "1");
});
</script>
For more security you have to validate everything serversided anyway if it is a form anyway.
But are input elements nesessary anyway if the content is for read only?
A div is uneditable in general. If you want a textbox which is uneditable, add "readonly":
<input type="textbox" name="test" readonly>
Edit: Or you can block it via CSS with the properties user-select:
.unselectable {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
Remember that this is NOT a validation, i can modify whats inside with firebug or similar tools.