lunes, 31 de diciembre de 2012

Objetos dinamicos con javascript

Por un proyecto el cual no viene al caso me toco programar un formulario dinámico  dado que si el usuario seleccionaba una opción las demás se bloquearan, como algunos campos venían directamente de la base de datos, y era necesario bloquearlos les puse un prefijo y con una expresión regular de javascript los obtuve recorriendo los nodos del formulario con un for, algo así

En el formulario tengo algo como:


                       
<?php for ($i=0; $i<count($productos); ++$i) {?>
                       
<label class="checkbox">
<input type="checkbox" 
       value="<?php echo $productos[$i]["id_producto"];?>" 
       id="chk_pro_<?php echo str_replace(" ", "_", $productos[$i]["nombre_produ"]);?>" 
       name="chk_pro_<?php echo str_replace(" ", "_", $productos[$i]["nombre_produ"]);?>">
       <?php echo $productos[$i]["nombre_produ"];?>
</label>
<?php }?>


Mientras que en el javascript:


for(i=0; i<document.forms[0].length;++i){
 var chk_pro_campo= new RegExp(/^chk_pro_\w+$/); 

        if(chk_pro_campo.test(document.forms[0].elements[i].name)){

            chk_objetos[i]=document.forms[0].elements[i].name;

        } 

Después puedo recorrer el array chk_objetos y hacer lo necesite con él y sus elementos, como por ejemplo bloquearlos a elección.


function chk_buscar(obj){
var chk_buscar = document.getElementById(obj.id);
var id=chk_buscar.id;

if(chk_buscar.checked){
         document.getElementById(input_buscar).readOnly=false;

        /*Recorrer el formulario de elementos, buscar los elementos que tengan el

        patrón al igual que en el php, activar o desactivar según criterios*/
    
         cadena='';

         for(i=1;i<chk_objetos.length; ++i){

             name=chk_objetos[i];

             ob=document.getElementById(name)

             ob.disabled=true;

         }



else

        {

        document.getElementById(input_buscar).readOnly=true;

        for(i=1;i<chk_objetos.length; ++i){

             name=chk_objetos[i];

             ob=document.getElementById(name)

             ob.disabled=false;

             }

        }
}
Bueno, eso es todo feliz año 2013.

No hay comentarios:

Publicar un comentario