[Erp5-report] r35493 fabien - /erp5/trunk/products/ERP5Form/dtml/proxyFieldEdit.dtml

[nobody at svn.erp5.org]

Author: fabien
Date: Thu May 20 15:58:39 2010
New Revision: 35493

URL: http://svn.erp5.org?rev=35493&view=rev
Log:
In Proxy Field, Widget properties show parent values. Here, even if delegated
was checked on, the UI looked modifiable, and there was no difference in whether
it was possible or not. And, when you changed a value which was delegated, the UI
reports that the change was successful, but in reality the change was discarded.
This interface was horribly confusing. In this commit, I use javascript to add
the attribute readonly in case the checkbox is checked. This makes not possible to
modify a field if the checkbox is checked, in this way, we should be able to
avoid mistakes like before.

I try it on browser with javascript disable and the behaviour is exacly like
before, so this improvement benefit only to those who have javascript enable on
their web browsers.

Modified:
    erp5/trunk/products/ERP5Form/dtml/proxyFieldEdit.dtml

Modified: erp5/trunk/products/ERP5Form/dtml/proxyFieldEdit.dtml
URL: http://svn.erp5.org/erp5/trunk/products/ERP5Form/dtml/proxyFieldEdit.dtml?rev=35493&r1=35492&r2=35493&view=diff
==============================================================================
--- erp5/trunk/products/ERP5Form/dtml/proxyFieldEdit.dtml [utf8] (original)
+++ erp5/trunk/products/ERP5Form/dtml/proxyFieldEdit.dtml [utf8] Thu May 20 15:58:39 2010
@@ -78,9 +78,11 @@
                 <dtml-if "proxy_field.is_delegated(field_id)">
                   <input type="checkbox" 
                          name="<dtml-var checkbox_key>" 
+                         onclick="toggleFieldState(event)"
                          checked="checked" />
                 <dtml-else >
                   <input type="checkbox" 
+                         onclick="toggleFieldState(event)"
                          name="<dtml-var checkbox_key>" />
                 </dtml-if >
               </dtml-let >
@@ -96,9 +98,15 @@
               </dtml-if>
             </div>
             </td>
-            <td align="left" valign="top">
-            <dtml-var "field.render(value)">
-            </td>
+            <dtml-if "proxy_field.is_delegated(field_id)">
+              <td align="left" valign="top" class="to_disable delegated">
+              <dtml-var "field.render(value)">
+              </td>
+            <dtml-else >
+              <td align="left" valign="top" class="to_disable">
+              <dtml-var "field.render(value)">
+              </td>
+            </dtml-if>
             <td><div class="form-element">
             <dtml-var "field.meta_type">
             </div></td>
@@ -130,6 +138,52 @@
 </table>
 </form>
 
+<script type="text/javascript">
+function isClass(object, className) {
+        if (object.className != undefined){
+        return (object.className.search('(^|\\s)' + className + '(\\s|$)') != -1);
+        }
+        return false;
+}
+function GetElementsWithClassName(elementName,className) {
+        var allElements = document.getElementsByTagName(elementName);
+        var elemColl = new Array();
+        for (i = 0; i< allElements.length; i++) {
+                if (isClass(allElements[i], className)) {
+                        elemColl[elemColl.length] = allElements[i];
+                }
+        }
+        return elemColl;
+}
+var class_deletaged_list = GetElementsWithClassName('*','delegated');
+for(var i=0; i<class_deletaged_list.length; i++) {
+  element = class_deletaged_list[i].childNodes[1];
+  if (element.type == 'hidden'){
+    element = class_deletaged_list[i].childNodes[2];
+  }
+  element.readOnly = true;
+}
 
-
+function toggleFieldState(evt) {
+  evt=(evt)?evt:event;
+  var target=(evt.target)?evt.target:evt.srcElement;
+  tr_parent = target.parentNode.parentNode;
+  allElements = tr_parent.childNodes;
+  console.log(allElements);
+  for (i=0; i<allElements.length; i++) {
+    if (isClass(allElements[i], 'to_disable')) {
+      field = allElements[i].childNodes[1];
+      if (field.type == 'hidden'){
+        field = allElements[i].childNodes[2];
+      }
+      if (field.readOnly){
+        field.readOnly = false;
+      }
+      else{
+        field.readOnly = true;
+      }
+    }
+  }
+}
+</script>
 <dtml-var manage_page_footer>