Hi all! I am writing an interface for my Company's Web Application and one of the features is allowing the user to change some of the fields of a report. The thing is: I cannot make the whole content editable and only some authorized people will be able to change content. What we do now is: when the right person clicks a button, we copy the html, changing only the body tag contenteditable to true. We thought, at first, the following code (after pressing the button) would do:
<html><head><style type="text/css"><!-- table {border-collapse:collapse;} td {width:20%;} table, td {border: 1px solid black;} th {background-color:#E0E0E0;} td, th {padding:2px;}--></style></head><body contenteditable="true"> <table cellspacing="0" cellpadding="0"> <tr> <th><span contenteditable="false">Field 1</th> <td></td> <th><span contenteditable="false">Field 2</span></th> <td></td> <th><span contenteditable="false">Field 3</span></th> <td></td> </tr> </table></body></html>
If you run this code, you will see that the span contents cannot be edited but, once I cannot use contenteditable="false" inside the th tag (reason I used spans), the th still can be edited, and the span can be deleted completely, which I certainly don't want. My questions:1) Can I stop the th from being editable? How?2) Can I stop the spans from being selectable? How?3) Is there a way to do that in CSS? Which?I would very much appreciate any comments. Thanks a lot.Paulo.