Foros del Web » Programando para Internet » Javascript »

Actualización de meses en select

Estas en el tema de Actualización de meses en select en el foro de Javascript en Foros del Web. Estimados, junto con saludar y agradecer la gran ayuda que dan en este foro... solicito su ayuda a resolver un asunto... ocurre que mediante una ...
  #1 (permalink)  
Antiguo 24/07/2012, 11:14
 
Fecha de Ingreso: diciembre-2010
Mensajes: 5
Antigüedad: 13 años, 4 meses
Puntos: 0
Actualización de meses en select

Estimados, junto con saludar y agradecer la gran ayuda que dan en este foro... solicito su ayuda a resolver un asunto...

ocurre que mediante una imagen/boton, llamo a una funcion javascript que agrega 2 textbox, un select y una imagen/boton de borrado de estas mismas, por fila, lo que ocurre es que el select contiene 3 opciones, 3 dias asignados directamente, el mes siguiente al actual y el año correspondiente, al ir agregando filas no hay problema, pero al eliminar y agregar una nueva es donde fallo porque el mes que muestra es el siguiente y no el mismo borrado... me explico con un ejemplo:

Desde ya muchas gracias

al agregar...
fila 1:
select: 05/08/2012
15/08/2012
25/08/2012
fila 2:
select: 05/09/2012
15/09/2012
25/09/2012

al eliminar...
fila 1:
select: 05/08/2012
15/08/2012
25/08/2012

al agregar nuevamente...
fila 1:
select: 05/08/2012
15/08/2012
25/08/2012
fila 2:
select: 05/10/2012
15/10/2012
25/10/2012

quedando asi...
fila 1:
select: 05/08/2012
15/08/2012
25/08/2012
fila 2:
select: 05/10/2012
15/10/2012
25/10/2012

adjunto el codigo de la pagina de prueba

Código:
<html>
    <head>
         <script type="text/javascript" src="jquery-1.7.2.js"></script>
    </head>
    <body>
   <img src="img/add.png" title="Agregar" id="agregarCh" onClick="agregarCheque()"/>
<table width="450px" cellpadding="0" cellspacing="0" id="detalle" class="detCh">

</table>
        
               
    </body>
<script lenguage="javascript">
var me = "";
var posicionCampo = 0;
var x = 0;
var FechaActual = new Date();
var m = parseInt(FechaActual.getMonth()) + 2;
var ano = FechaActual.getFullYear();

function agregarCheque(){
 
    for(x; x<=posicionCampo ;x++){
        if(m>12){
            m=1;
            ano++;
        }
        if(m<10){
                me = "0"+m;
                ano;
        }else{
                me = m
                ano;
        }
        m++;
    }
      
    nuevaFila = document.getElementById("detalle").insertRow(-1);
    nuevaFila.id=posicionCampo;
   
  /*  ++nCuota;
    nuevaCelda=nuevaFila.insertCell(-1);
    nuevaCelda.innerHTML="<td><input type='hidden' name='"+nuevaFila.id+"' id='"+nuevaFila.id+"'></td>";
  */
    nuevaCelda=nuevaFila.insertCell(-1);
    nuevaCelda.innerHTML="<td><center><input type='text' width=25 name='ncheque"+nuevaFila.id+"' id='ncheque"+nuevaFila.id+"' class='ncheques' ></center></td>";

    nuevaCelda=nuevaFila.insertCell(-1);
    nuevaCelda.innerHTML="<td><center>$<input type='text' size='10' name='importe"+nuevaFila.id+"' id='importe"+nuevaFila.id+"' class='nimportes'></center></td>";
    
    nuevaCelda=nuevaFila.insertCell(-1);
    nuevaCelda.innerHTML="<td><center><select name='fec1"+nuevaFila.id+"' id='fec1' class='select_fecha'><OPTION VALUE='05/"+me+"/"+ano+"'>05/"+me+"/"+ano+"</OPTION><OPTION VALUE='15/"+me+"/"+ano+"'>15/"+me+"/"+ano+"</OPTION><OPTION VALUE='25/"+me+"/"+ano+"'>25/"+me+"/"+ano+"</OPTION></select></center></td>";
        
    nuevaCelda=nuevaFila.insertCell(-1);
    nuevaCelda.innerHTML="<td><a href='#' onclick='eliminarCheque(this)'><img src='img/del.png' title='Eliminar' class='delCols'/></a></td>";
    
    posicionCampo++;
    //contador++;
    //<input type='button' value='Eliminar' onclick='eliminarCheque(this)'>
    
 
}

function eliminarCheque(obj){
    
    var oTr = obj;
    while(oTr.nodeName.toLowerCase()!='tr'){
    oTr=oTr.parentNode;

    }
    var root = oTr.parentNode;
    root.removeChild(oTr);
    
}
</script>
Sino alguna forma de realizar la misma acción, con jquery u otro elemento, :D

Última edición por JanoxOne; 25/07/2012 a las 15:22 Razón: edición de solicitud
  #2 (permalink)  
Antiguo 26/07/2012, 14:35
 
Fecha de Ingreso: diciembre-2010
Mensajes: 5
Antigüedad: 13 años, 4 meses
Puntos: 0
Respuesta: Actualización de meses en select

alguna ideaita? :(
  #3 (permalink)  
Antiguo 26/07/2012, 16:31
Avatar de Dradi7  
Fecha de Ingreso: junio-2008
Ubicación: Peru - Lima
Mensajes: 1.518
Antigüedad: 15 años, 10 meses
Puntos: 220
Respuesta: Actualización de meses en select

Mira solo tienes que agregar algunas cosas en tu script, no es la gran cosa pero cumple con lo que quieres

Código HTML:
Ver original
  1.     <head>
  2.          <script type="text/javascript" src="jquery-1.7.2.js"></script>
  3.     </head>
  4.     <body>
  5.    <img src="img/add.png" title="Agregar" id="agregarCh" onClick="agregarCheque()"/>
  6. <table width="450px" cellpadding="0" cellspacing="0" id="detalle" class="detCh">
  7.  
  8.        
  9.                
  10.     </body>

Código Javascript:
Ver original
  1. <script lenguage="javascript">
  2. var me = "";
  3. var posicionCampo = 0;
  4. var x = 0;
  5. var FechaActual = new Date();
  6. var m = parseInt(FechaActual.getMonth()) + 2;
  7. var ano = FechaActual.getFullYear();
  8. var temp = new Array();
  9.  
  10. function agregarCheque(){
  11.  
  12.     var _a = 0;
  13.     var _m = 0;
  14.     var _id = 0;
  15.     var _ins = -1;
  16.    
  17.     if(temp.length == 0){
  18.        
  19.         if(m>12)
  20.         {
  21.             m=1;
  22.             ano++;
  23.         }
  24.        
  25.         me = m<10 ? "0"+ m : m;
  26.  
  27.         m++;
  28.        
  29.         _a = ano;
  30.         _m = m-1;
  31.         _id = posicionCampo;
  32.        
  33.     }else{
  34.    
  35.         _a = temp[0][0];
  36.         _m = temp[0][1];
  37.         _id = temp[0][2];
  38.         console.log(root);
  39.        
  40.         var _encontro = false;
  41.         for (var i = 0; i < root.childNodes.length; i++) {
  42.           if (root.childNodes.item(i).id > _id) {
  43.             _encontro = true;
  44.             _ins = i;
  45.             break;
  46.           }
  47.         }
  48.        
  49.         if(!_encontro)_ins=0;
  50.        
  51.         me = _m<10 ? "0"+ _m : _m;
  52.        
  53.         temp.splice(0,1);
  54.     }
  55.      
  56.     nuevaFila = document.getElementById("detalle").insertRow(_ins);
  57.     nuevaFila.id=_id;
  58.     nuevaFila.setAttribute("data-anyo", _a);
  59.     nuevaFila.setAttribute("data-mes", _m);
  60.    
  61.   /*  ++nCuota;
  62.     nuevaCelda=nuevaFila.insertCell(-1);
  63.     nuevaCelda.innerHTML="<td><input type='hidden' name='"+nuevaFila.id+"' id='"+nuevaFila.id+"'></td>";
  64.   */
  65.     nuevaCelda=nuevaFila.insertCell(-1);
  66.     nuevaCelda.innerHTML="<td><center><input type='text' width=25 name='ncheque"+nuevaFila.id+"' id='ncheque"+nuevaFila.id+"' class='ncheques' ></center></td>";
  67.  
  68.     nuevaCelda=nuevaFila.insertCell(-1);
  69.     nuevaCelda.innerHTML="<td><center>$<input type='text' size='10' name='importe"+nuevaFila.id+"' id='importe"+nuevaFila.id+"' class='nimportes'></center></td>";
  70.    
  71.     nuevaCelda=nuevaFila.insertCell(-1);
  72.     nuevaCelda.innerHTML="<td><center><select name='fec1"+nuevaFila.id+"' id='fec1' class='select_fecha'><OPTION VALUE='05/"+me+"/"+_a+"'>05/"+me+"/"+_a+"</OPTION><OPTION VALUE='15/"+me+"/"+_a+"'>15/"+me+"/"+_a+"</OPTION><OPTION VALUE='25/"+me+"/"+_a+"'>25/"+me+"/"+_a+"</OPTION></select></center></td>";
  73.        
  74.     nuevaCelda=nuevaFila.insertCell(-1);
  75.     nuevaCelda.innerHTML="<td><a href='#' onclick='eliminarCheque(this)'><img src='img/del.png' title='Eliminar' class='delCols'/></a></td>";
  76.    
  77.     //contador++;
  78.     //<input type='button' value='Eliminar' onclick='eliminarCheque(this)'>
  79.    
  80.     if(temp.length==0)posicionCampo++;
  81.  
  82. }
  83. var root = null;
  84. function eliminarCheque(obj){
  85.    
  86.     var oTr = obj;
  87.     while(oTr.nodeName.toLowerCase()!='tr'){
  88.     oTr=oTr.parentNode;
  89.  
  90.     }
  91.     root = oTr.parentNode;
  92.     var _anyo = oTr.getAttribute("data-anyo");
  93.     var _mes = oTr.getAttribute("data-mes");
  94.     var _id = oTr.getAttribute("id");
  95.     temp.push([_anyo,_mes, _id]);
  96.     root.removeChild(oTr);
  97.    
  98. }
  99. </script>
__________________
La clave de todo triunfador es eliminar todas sus excusas y sus limitaciones
  #4 (permalink)  
Antiguo 30/07/2012, 07:32
 
Fecha de Ingreso: diciembre-2010
Mensajes: 5
Antigüedad: 13 años, 4 meses
Puntos: 0
Respuesta: Actualización de meses en select

Dradi7 gracias por tu tiempo y respuesta, es una gran ayuda, me estaba partiendo la cabeza tratando de hacerlo xD ... un abrazo y nuevamente gracias.

Etiquetas: funcion, html, input, js, meses, select, botones
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 19:36.