From 35d5ac9874224f4cd63dbdd194d99b7a3dea3803 Mon Sep 17 00:00:00 2001
From: Guillermo Moguel Mandujano <gmoguel@unich.edu.mx>
Date: Mon, 16 Jun 2014 14:04:33 -0500
Subject: [PATCH] actualizado a plugins

---
 index.html           | 112 ++++++++++++++++++++++++++++++++++++++++++++-------
 js/jquery.mutable.js |  77 ++++++++++++++++++-----------------
 2 files changed, 138 insertions(+), 51 deletions(-)

diff --git a/index.html b/index.html
index 854a988..708d752 100644
--- a/index.html
+++ b/index.html
@@ -6,9 +6,28 @@
 	<script src="js/jquery-1.10.2.js"></script>
 	<script src="js/jquery.mutable.js"></script>
 	<script>
-        
+        $(document).ready(function(){
 
+            $("#id_lengua").mutarSelect({
+                valueselector:"Otra",
+            });
 
+            $("#id_trabajasactual").mutarSelect({
+                valueselector:"Otra",
+            });
+
+            $("#id_trabajasactual").mutarSelect({
+                valueselector:"No, ¿Por que?",
+            });
+
+
+            $("id_cencontrabajo").mutarSelect({
+                valueselector:"¿Otra forma, Cual?",
+            });
+                       
+           
+            
+        });
 	</script>
 <style>
 	body{
@@ -27,23 +46,86 @@
 
 <h1>YOUR COMPONENTS:</h1>
 
-<!-- Select -->
-<form style="margin-top: 1em;">
-    <select name="cars" id="cars" class="mutarselect">
-      <option value="volvo">Volvo</option>
-      <option value="saab">Saab</option>
-      <option value="mercedes">Mercedes</option>
-      <option value="audi">Audi</option>
-    </select>
-
-    <select name="food" class="mutarselect">
-      <option value="tacos">Tacos</option>
-      <option value="tostadas">Tostadas</option>
-      <option value="tamales">Tamales</option>
-    </select>
+
+<form id="datos" action="" method="post">
+    <table>
+    <tr><th><label for="id_lengua">Lengua:</label></th><td><select id="id_lengua" required="true" class="form-control mutarselect" name="lengua">
+<option value=""></option>
+<option value="Castellano">Castellano</option>
+<option value="Tseltal">Tseltal</option>
+<option value="Tsotsil">Tsotsil</option>
+<option value="Ch&#39;ol">Ch&#39;ol</option>
+<option value="Tojolabal">Tojolabal</option>
+<option value="Zoque">Zoque</option>
+</select></td></tr>
+<tr><th><label for="id_ciudad">Ciudad de nacimiento:</label></th><td><input id="id_ciudad" type="text" name="ciudad" maxlength="120" /></td></tr>
+<tr><th><label for="id_municipio">Municipio de nacimiento:</label></th><td><input id="id_municipio" type="text" name="municipio" maxlength="120" /></td></tr>
+<tr><th><label for="id_estado">Estado de nacimiento:</label></th><td><input id="id_estado" type="text" name="estado" maxlength="120" /></td></tr>
+<tr><th><label for="id_titulado">¿Ya te titulaste?</label></th><td><select id="id_titulado" required="true" class="form-control" name="titulado">
+<option value="" selected="selected"></option>
+<option value="True">SI</option>
+<option value="False">NO</option>
+</select></td></tr>
+<tr><th><label for="id_rectitulacion">¿Requieres titularte?</label></th><td><select id="id_rectitulacion" required="true" class="form-control mutarselect" name="rectitulacion">
+<option value="" selected="selected"></option>
+<option value="True">SI</option>
+<option value="False">NO</option>
+</select></td></tr>
+<tr><th><label for="id_trabajasactual">¿Tabajas actualmente?</label></th><td><select id="id_trabajasactual" required="true" class="form-control mutarselect" name="trabajasactual">
+<option value="" selected="selected"></option>
+<option value="Si">Si</option>
+</select></td></tr>
+<tr><th><label for="id_tencontrabajo">¿Cuánto tiempo tardaste en encontrar trabajo?</label></th><td><select id="id_tencontrabajo" required="true" class="form-control" name="tencontrabajo">
+<option value="" selected="selected"></option>
+<option value="Menos de 3 meses">Menos de 3 meses</option>
+<option value="De 3 a 6 Meses">De 3 a 6 Meses</option>
+<option value="De 6 a 9 Meses">De 6 a 9 Meses</option>
+<option value="De 9 a 12 Meses">De 9 a 12 Meses</option>
+<option value="Más de 1 año">Más de 1 año</option>
+<option value="Aún no cuentas con empleo">Aún no cuentas con empleo</option>
+</select></td></tr>
+<tr><th><label for="id_cencontrabajo">¿Cómo conseguite el trabajo?</label></th><td><select id="id_cencontrabajo" required="true" class="form-control" name="cencontrabajo">
+<option value="" selected="selected"></option>
+<option value="Relaciones personales">Relaciones personales</option>
+<option value="Bolsa de trabajo de la Universidad">Bolsa de trabajo de la Universidad</option>
+<option value="Bolsa de trabajo externas">Bolsa de trabajo externas</option>
+<option value="Entregando Curriculums">Entregando Curriculums</option>
+<option value="Concurso de selección">Concurso de selección</option>
+<option value="Durante el servicio social">Durante el servicio social</option>
+<option value="Ofresiendo mis servicios independientes">Ofresiendo mis servicios independientes</option>
+</select></td></tr>
+<tr><th><label for="id_dencontrabajo">Dificultades para conseguir trabajo:</label></th><td><input id="id_dencontrabajo" type="text" name="dencontrabajo" maxlength="120" /></td></tr>
+<tr><th><label for="id_arealaboral">En el área laboral te desarrollas en:</label></th><td><select id="id_arealaboral" required="true" class="form-control mutarselect" name="arealaboral">
+<option value="" selected="selected"></option>
+<option value="En empleos profecionales que requien de la formación de su carrera">En empleos profecionales que requien de la formación de su carrera</option>
+<option value="En empleos profecionales que no requieren de la formación de su carrera">En empleos profecionales que no requieren de la formación de su carrera</option>
+<option value="En empleos que no requieren de una profeción">En empleos que no requieren de una profeción</option>
+<option value="otra">Otra, ¿Cual?</option>
+</select></td></tr>
+
+<tr><th><label for="id_dedicacionem">Tiempo de dedicación en el empleo:</label></th><td><select id="id_dedicacionem" required="true" class="form-control mutarselect" name="dedicacionem">
+<option value="" selected="selected"></option>
+<option value="Tiempo completo">Tiempo completo</option>
+<option value="Medio tiempo">Medio tiempo</option>
+<option value="Eventual">Eventual</option>
+<option value="otra">Otra, ¿Cual?</option>
+</select></td></tr>
+<tr><th><label for="id_formacionprofecional">¿Consideras que tu formacion profecional es?</label></th><td><select id="id_formacionprofecional" required="true" class="form-control mutarselect" name="formacionprofecional">
+<option value="" selected="selected"></option>
+<option value="Excelente">Excelente</option>
+<option value="Buena">Buena</option>
+<option value="Regular">Regular</option>
+<option value="Insatisfactoria">Insatisfactoria</option>
+</select></td></tr>
+
+    <table>
+
+    <input id="terminar" type="submit" name="terminar" value="Terminar">
+
 </form>
 
 
 
+
 </body>
 </html>
diff --git a/js/jquery.mutable.js b/js/jquery.mutable.js
index 0ad8919..4ebfc13 100644
--- a/js/jquery.mutable.js
+++ b/js/jquery.mutable.js
@@ -1,37 +1,42 @@
-function MutarSelect(){
-        
-    $(".mutarselect").append("<option value='' class='mutarselect-add'>Agregar nuevo</option>");
+(function ( $ ) {
+    $.fn.mutarSelect = function( options ){
+
+
+        // This is the easiest way to have default options.
+        var settings = $.extend({
+        valueselector:"Agregar nuevo",
+        }, options );
+
+        var selector = this;
+        selector.append("<option value='' class='mutarselect-add'>" + settings.valueselector + "</option>");
+    
+        $(".mutarselect-add").click(function( event ){
+                event.preventDefault();
+                
+                //alert($(this).parent(".mutarselect").attr("id"));
+                var father = $(this).parent(selector).attr("id");
+                //var positionReal = $(this).parent(".mutarselect").offset();
+                //
+                $("#" + father + " .mutarselect-rm" ).remove();
+                
+                $(this).parent(".mutarselect").hide();
+                $("<input type='text' placeholder='nuevo valor' autofocus autocomplete=off' class='mutarselect-input " + father +"' >").insertAfter( $($(this).parent(".mutarselect")) );
+        });    
+   
+           
+        $("form").on("keypress", ".mutarselect-input",function( event ){
+            if ( event.keyCode == '13' ){
+                event.preventDefault();
+
+                $(this).prev(".mutarselect").prepend("<option selected=\"selected\" value='" + $(this).val()  + "' class='mutarselect-rm'>" + $(this).val() + "</option>");
+                $(this).prev(".mutarselect").show();
+                $(this).remove();
+                
+            }
+        });
+
+        //return this;
+
+    };
+}( jQuery ));
 
-
-    $(".mutarselect-add").click(function( event ){
-        event.preventDefault();
-
-        //alert($(this).parent(".mutarselect").attr("id"));
-        var father = $(this).parent(".mutarselect").attr("id");
-        //var positionReal = $(this).parent(".mutarselect").offset();
-        //
-        $(this).parent(".mutarselect").hide();
-        $("<input type='text' placeholder='nuevo valor' autofocus autocomplete=off style='border:none' class='mutarselect-input " + father +"' >").insertAfter( $($(this).parent(".mutarselect")) );
-
-
-    });
-
-    $("form").on("keypress", ".mutarselect-input",function( event ){
-        
-        if ( event.keyCode == '13' ){
-            event.preventDefault();
-
-            $(this).prev(".mutarselect").prepend("<option value='" + $(this).val()  + "' class='mutarselect-rm'>" + $(this).val() + "</option>");
-            $(this).prev(".mutarselect").show();
-            $(this).remove();
-        
-        }
-    });
-
-}
-
-
-$(document).ready(function(){
-        MutarSelect();
-
-});
-- 
2.0.0