From: Ricardo Markiewicz <rmarkie@fi.uba.ar>
Date: Fri, 9 Mar 2007 03:05:16 +0000 (+0000)
Subject: Nuevo Widget con 2 listas para pasar datos de una a otra.
X-Git-Tag: 0_9~109
X-Git-Url: https://git.llucax.com/z.facultad/75.52/sercom.git/commitdiff_plain/093cc6f1322e48e79088a864addd7fff4c34c252?hp=de32d0c699858b1502f5f1e793174db8b56f9c1b

Nuevo Widget con 2 listas para pasar datos de una a otra.
Esta lista tiene el objetivo de pasar cosas de FROM a TO dando un layout horizontal
que queda mas piolas ;).
Crea 2 listas ${name}_from y {$name}_to que son pasadas al controller (previamente hay que
seleccionar desde JS todos los items de las listas que se deseen leer, puede ser una sola o
ambas). Como propiedades utiles tiene :
  * title_from : El titulo que va arriba de la lista FROM (la de la derecha)
  * title_to : El titulo que va arriba de la lista FROM (la de la izquierda)
  * El resto igual que MultiSelectField
No puse el texto de los botones configurable porque se rompe muy facil el layour :S, pero creo
que con los titulitos se da a entender.
Desde JS se accede con form_${name}_from y form_${name}_to a FROM y TO respectivamente. Para inicializar
los valores de FROM se usa directamente el atributo options de MultipleSelectField y a TO se lo debe
inicializar desde JS.
---

diff --git a/sercom/subcontrollers/curso/__init__.py b/sercom/subcontrollers/curso/__init__.py
index 9d1c1f3..7b5fccd 100644
--- a/sercom/subcontrollers/curso/__init__.py
+++ b/sercom/subcontrollers/curso/__init__.py
@@ -68,7 +68,7 @@ ajax = u"""
         d.addCallbacks(procesar, err);
     }
 
-    function onsubmit()
+    function doSubmit()
     {
         /* TODO : Validar datos y evitar el submit si no esta completo */
 
@@ -78,7 +78,7 @@ ajax = u"""
             l.options[i].selected = true;
         }
         /* Selecciono todos los miembros si no, no llegan al controllere*/
-        l = MochiKit.DOM.getElement('form_docentes_curso');
+        l = MochiKit.DOM.getElement('form_docentes_to');
         for (i=0; i<l.options.length; i++) {
             l.options[i].selected = true;
         }
@@ -131,20 +131,25 @@ class CursoForm(W.TableForm):
             help_text=_(u'Descripcion.'),
             validator=V.UnicodeString(not_empty=False, strip=True))
 
-        docentes = W.MultipleSelectField(name="docentes",
-            label=_(u'Docentes'),
-            attrs=dict(style='width:300px'),
+        #docentes = W.MultipleSelectField(name="docentes",
+        #    label=_(u'Docentes'),
+        #    attrs=dict(style='width:300px'),
+        #    options=get_docentes,
+        #    validator=V.Int(not_empty=True))
+        #addDocente = W.Button(default='Asignar', label='',
+        #    attrs=dict( onclick='mover("form_docentes","form_docentes_curso")'))
+        #remDocente = W.Button(default='Remover', label='',
+        #    attrs=dict( onclick='remover("form_docentes_curso","form_docentes")'))
+        #docentes_curso = W.MultipleSelectField(name="docentes_curso",
+        #    label=_(u'Docentes del curso'),
+        #    attrs=dict(style='width:300px'),
+#       #     options=get_docentes_curso,
+        #    validator=V.Int(not_empty=True))
+        docentes = AjaxDosListasSelect(label=_(u'Docentes'),
+            title_from="Docentes",
+            title_to="Docentes del Curso",
             options=get_docentes,
             validator=V.Int(not_empty=True))
-        addDocente = W.Button(default='Asignar', label='',
-            attrs=dict( onclick='mover("form_docentes","form_docentes_curso")'))
-        remDocente = W.Button(default='Remover', label='',
-            attrs=dict( onclick='remover("form_docentes_curso","form_docentes")'))
-        docentes_curso = W.MultipleSelectField(name="docentes_curso",
-            label=_(u'Docentes del curso'),
-            attrs=dict(style='width:300px'),
-#            options=get_docentes_curso,
-            validator=V.Int(not_empty=True))
 
         alumnos = AjaxMultiSelect(label=_(u'Alumnos'),
                 validator=V.Int(),
@@ -154,7 +159,7 @@ class CursoForm(W.TableForm):
     fields = Fields()
     javascript = [W.JSSource("MochiKit.DOM.focusOnLoad('anio');"),
                   W.JSSource(ajax)]
-    form_attrs = dict(onsubmit='return onsubmit()')
+    form_attrs = dict(onsubmit='return doSubmit();')
 form = CursoForm()
 #}}}
 
@@ -202,12 +207,9 @@ class CursoController(controllers.Controller, identity.SecureResource):
     def create(self, **kw):
         """Save or create record to model"""
         print "--KW--"
-        print kw
-        docentes = kw.get('docentes_curso', [])
+        docentes = kw.get('docentes_to', [])
         alumnos = kw.get('alumnos', [])
-        del(kw['remDocente'])
-        del(kw['addDocente'])
-        del(kw['docentes_curso'])
+        del(kw['docentes_to'])
         del(kw['alumnos'])
         r = validate_new(kw)
         """ Agrego la nueva seleccion de docentes """
@@ -233,7 +235,7 @@ class CursoController(controllers.Controller, identity.SecureResource):
         values.cursoID = r.id
         values.descripcion = r.descripcion
         # cargo la lista con los docentes asignados al curso
-        values.docentes_curso = [{"id":d.docente.id, "label":d.docente.shortrepr()} for d in DocenteInscripto.selectBy(curso=r.id)]
+        values.docentes_to = [{"id":d.docente.id, "label":d.docente.shortrepr()} for d in DocenteInscripto.selectBy(curso=r.id)]
         values.alumnos_inscriptos = [{"id":a.alumno.id, "label":a.alumno.shortrepr()} for a in AlumnoInscripto.selectBy(curso=r.id)]
 
         return dict(name=name, namepl=namepl, record=values, form=form)
@@ -246,7 +248,7 @@ class CursoController(controllers.Controller, identity.SecureResource):
         params = dict([(k,v) for (k,v) in kw.iteritems() if k in Curso.sqlmeta.columns.keys()])
         r = validate_set(id, params)
 
-        docentes = kw.get('docentes_curso', [])
+        docentes = kw.get('docentes_to', [])
         alumnos = kw.get('alumnos', [])
         alumnos_inscriptos = AlumnoInscripto.selectBy(curso=id)
         """ levanto los doncentes del curso para ver cuales tengo que agregar """
diff --git a/sercom/subcontrollers/curso/templates/edit.kid b/sercom/subcontrollers/curso/templates/edit.kid
index 6939753..7cbef82 100644
--- a/sercom/subcontrollers/curso/templates/edit.kid
+++ b/sercom/subcontrollers/curso/templates/edit.kid
@@ -9,8 +9,8 @@
     function init_data() {
  //       MochiKit.DOM.getElement('form_responsable').focus();
         MochiKit.DOM.getElement('form_anio').focus();
-        <span py:for="d in record.docentes_curso" py:strip="True">
-            MochiKit.DOM.appendChildNodes("form_docentes_curso", OPTION({"value":${d['id']}}, '${d['label']}'))
+        <span py:for="d in record.docentes_to" py:strip="True">
+            MochiKit.DOM.appendChildNodes("form_docentes_to", OPTION({"value":${d['id']}}, '${d['label']}'))
         </span>
         
         <span py:for="a in record.alumnos_inscriptos" py:strip="True">
@@ -18,28 +18,6 @@
         </span>
     }
     MochiKit.DOM.addLoadEvent(init_data)
-    
-    function makeOption(option) {
-        return OPTION({"value": option.value}, option.text);
-    }
-                   
-    function moveOption( fromSelect, toSelect) {
-        // add 'selected' nodes toSelect
-        appendChildNodes(toSelect,
-        map( makeOption,ifilter(itemgetter('selected'), $(fromSelect).options)));
-        // remove the 'selected' fromSelect
-        // replaceChildNodes(fromSelect,
-        // list(ifilterfalse(itemgetter('selected'), $(fromSelect).options)));
-    }
-    
-    function mover( src, dest ) {
-        moveOption(src, dest)    
-    }
-    
-    function remover (src, dest) {
-        replaceChildNodes(src,list(ifilterfalse(itemgetter('selected'), $(src).options)))
-    }
-    
 </script>
 <body>
 
diff --git a/sercom/subcontrollers/curso/templates/new.kid b/sercom/subcontrollers/curso/templates/new.kid
index e50ec76..1724584 100644
--- a/sercom/subcontrollers/curso/templates/new.kid
+++ b/sercom/subcontrollers/curso/templates/new.kid
@@ -2,30 +2,6 @@
 <html xmlns="http://www.w3.org/1999/xhtml" xmlns:py="http://purl.org/kid/ns#"
     py:extends="'../../../templates/master.kid'">
 <head>
-
-<script type="text/javascript">
-    function makeOption(option) {
-        return OPTION({"value": option.value}, option.text);
-    }
-                   
-    function moveOption( fromSelect, toSelect) {
-        // add 'selected' nodes toSelect
-        appendChildNodes(toSelect,
-        map( makeOption,ifilter(itemgetter('selected'), $(fromSelect).options)));
-        // remove the 'selected' fromSelect
-        replaceChildNodes(fromSelect,
-            list(ifilterfalse(itemgetter('selected'), $(fromSelect).options))
-        );
-    }
-    
-    function mover(src, dest) {
-        moveOption(src, dest)
-    }
-    
-    function remover( src, dest ) {
-        moveOption(src, dest)
-    }
-</script>
 <meta content="text/html; charset=utf-8" http-equiv="Content-Type" py:replace="''"/>
 <title>new</title>
 </head>
diff --git a/sercom/widgets.py b/sercom/widgets.py
index 612d950..b9a14c1 100644
--- a/sercom/widgets.py
+++ b/sercom/widgets.py
@@ -108,3 +108,77 @@ class AjaxMultiSelect(widgets.MultipleSelectField):
         self.params.append('on_add')
         self.on_add = "alert('Not defined action');"
         widgets.MultipleSelectField.__init__(self, **kw)
+
+DosListasAjax = '''
+    function makeOption(option) {
+        return OPTION({"value": option.value}, option.text);
+    }
+
+    function moveOption( fromSelect, toSelect) {
+        // add 'selected' nodes toSelect
+        appendChildNodes(toSelect,
+            map( makeOption,ifilter(itemgetter('selected'), $(fromSelect).options)));
+        // remove the 'selected' fromSelect
+        replaceChildNodes(fromSelect,
+            list(ifilterfalse(itemgetter('selected'), $(fromSelect).options))
+        );
+    }
+
+'''
+
+class AjaxDosListasSelect(widgets.MultipleSelectField):
+    template = '''
+    <div xmlns:py="http://purl.org/kid/ns#">  
+    <table style="border:0; margin:0px; border-spacing:0px 0px">
+    <tr class="nada">
+        <td style="padding:0 0 0 0;" align="center">${title_from}</td>
+        <td>&nbsp;</td>
+        <td style="padding:0 0 0 0;" align="center">${title_to}</td>
+    </tr>
+    <tr class="nada">
+    <td style="padding:0 0 0 0;">
+    <select  
+        multiple="multiple"
+        size="${size}"
+        class="${field_class}"
+        name="${name}_from"
+        id="${field_id}_from"
+        py:attrs="attrs"
+        style="width:200px;">
+        <optgroup py:for="group, options in grouped_options" label="${group}" py:strip="not group">
+        <option py:for="value, desc, attrs in options" value="${value}" py:attrs="attrs" py:content="desc" />  
+        </optgroup>  
+    </select>
+    </td>
+    <td style="padding:0 10px 0 10px;" valign="center" align="center">
+        <input type="button" value="&gt;&gt;&gt;" style="font-size:90%;" onClick="moveOption('${field_id}_from', '${field_id}_to');" />
+        <br />
+        <br />
+        <input type="button" value="&lt;&lt;&lt;" style="font-size:90%;" onClick="moveOption('${field_id}_to', '${field_id}_from');" />
+    </td>
+    <td style="padding:0 0 0 0;">
+    <select  
+        multiple="multiple"
+        size="${size}"
+        name="${name}_to"
+        class="${field_class}"
+        id="${field_id}_to"
+        py:attrs="attrs"
+        style="width:200px;">
+    </select>
+    </td>
+    </tr>
+    </table>
+    </div>
+    '''
+    javascript = [widgets.JSSource(DosListasAjax)]
+    title_from = ""
+    title_to = ""
+
+    def __init__(self, **kw):
+        self.params.append('title_from')
+        self.params.append('title_to')
+        self.title_from = "&nbsp;"
+        self.title_to = "&nbsp;"
+        widgets.MultipleSelectField.__init__(self, **kw)
+