Quiero controlar esta funcion por evento.

SirDuque · #1 (**permalink**) 11/02/2011, 05:19

Hola chicos, tengo una funcion que saque de una pagina, como usa Jquery no entiendo ni H.
Esta crea lo que le pida, al hacer click en X lugar, actualmente estoy creando mas y mas campos.
Lo que me gustaria que en ves de hacer click fuece con un evento, onFocus=
haci cuando genera un campo nuevo, y altaveo cuando hace focus en el campo recien creado crea otro para continuar.

Bueno esto es el codigo:

Código Javascript:

Ver originaljQuery.fn.generaNuevosCampos = function(indice){
        $(this).each(function(){
            elem = $(this);
            elem.data("indice",indice);
            
            elem.click(function(e){
                e.preventDefault();
                elem = $(this);
                indice = elem.data("indice");
                var nextindice;
                var tilde;
                tilde="'";
                nextindice= indice + 1;
      texto_insertar =' Ak genero lo que quiero, lo borre por que es mucho';
                indice ++;
                elem.data("indice",indice);
                nuevo_campo = $(texto_insertar);
                elem.before(nuevo_campo);
            });
        });
        return this;
    }
    $(document).ready(function(){
        $("#mascampos").generaNuevosCampos(2);
        });

en el HTML tengo esto:

Código HTML:

Ver original<?php
session_start();
if(!isset($_SESSION['opera']))header("location: ../login.php");
?>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=latin1" />
<!-- Inicio de Scripts -->
<script type="text/javascript" src="./venta/ajax_framework.js"></script>
<script src="shortcuts.js" type="text/javascript"></script>
<script src="jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="newcam.js" type="text/ecmascript"></script>
<script language="javascript" src="script.js"></script>
<!-- Fin Scripts inicio Style Maestro -->
<link rel="stylesheet" href="css/style.css" type="text/css" />
<style type="text/css">
<!--
a:link {
    text-decoration: none;
}
a:visited {
    text-decoration: none;
}
a:hover {
    text-decoration: none;
}
a:active {
    text-decoration: none;
}
-->
</style></head>
 
<BODY style="background-color: transparent;"  >
<form action="venta_.php" name="venta" method="post">
<div align="center">
  <table width="830" border="1">
  <tr class="fuentea">
    <td width="844"><input type="hidden" name="fechora" value="<?php    
    date_default_timezone_set('America/Argentina/Buenos_Aires');
    $hora=date("Y-m-d H:i:s");
    echo $hora; ?>">F/Pago
      :
      <select name="fp" id="fp">
        <option value="0" selected="selected"><strong>C/C</strong></option>
        <option value="1">EF</option>
      </select>
      <br />
      <br />
      Socio N&ordm;:
      <input name="socio" id="socio" type="text" onKeyUp="javascript:autosuggest()" autocomplete="off"/>
      <div id="results"> </div>    Nombre y Apellido: 
      <input type="text" name="nombre" id="nombre" size="45" readonly/>
      <br />
      </label>
      <table width="100%">
        <tr>
          <td width="8%"><div align="left">Cant.</div></td>
          <td width="15%"><div align="center">C&oacute;digo</div></td>
          <td width="53%"><div align="center">Descripci&oacute;n del producto</div></td>
          <td width="13%"><div align="right">P./Unidad</div></td>
          <td width="11%"><div align="center">Total</div></td>
        </tr>
        <table width="100%">
 
 
    <tr>
    <td><a onClick="id1.value='';subt1.value='0';can1.value='';cod1.value='';des1.value='';uni1.value='0';ppp1.value='';totalll(); document.venta.can1.removeAttribute('readonly' , 'readonly' , false);document.venta.cod1.removeAttribute('readonly' , 'readonly' , false);document.venta.can1.focus()"href="#" class="fuentea" >(-) </a>
    <input type="text" name="can1"  id="can1" size="2" maxlength="2" autocomplete="off" onFocus="nextfield ='cod1';" onKeyPress="return numbersonly(this, event)"/>    
    </td><td>
    <input name="cod1" type="text" id="cod1" size="14" maxlength="13" autocomplete="off"  onKeyDown="buscar(this);return numbersonly(this, event)" onFocus="nextfield ='des1';"/>
    </td><td>
    <input name="des1" type="text" id="des1" size="55" maxlength="50" autocomplete="off" onFocus="nextfield ='can2';completar(cod1,uni1,des1,id1,ppp1);document.venta.can1.setAttribute('readonly' , 'readonly' , false);document.venta.cod1.setAttribute('readonly' , 'readonly' , false);sumar(can1,uni1,subt1); totalll(); jump(can2);" readonly="readonly"/> 
    <input type="hidden" name="ppp1" id="ppp1"/><input type="hidden" name="id1" id="id1" /><input type="hidden" name="filas" id="filas" value="1" />
    </td><td>
    <input name="uni1" type="text" id="uni1" size="6" maxlength="4" autocomplete="off" value="0" readonly="readonly"/>
    </td><td>
    <input name="subt1" type="text" id="subt1" value="0" size="6" maxlength="5" readonly="readonly" autocomplete="off"/>
    </td></tr>
     <tr id="mascampos"><a href="#">CLIC AQUI PARA CREAR MAS CAMPOS</a></tr>
     <tr>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td><input type="text" name="total5" id="total5" size="6" value="0" autocomplete="off" readonly="readonly"/></td>
  </tr>
</table>
      </table>
 
      <div align="right">
        <input type="reset" name="cancel" id="cancel" value="Cancelar" />
        <input type="submit" name="done" value="Emitir">
        <br />
      </div></td>
  </tr>
</table>
 
 
  <input type="text" onFocus="jQuery.fn.generaNuevosCampos;"> <br>
</div>
</form>
 
<p>&nbsp;</p>
 
</body>
</html>

Gracias por pegarle una ojeada ;)

JavierB · #2 (**permalink**) 11/02/2011, 05:42

Hola, SirDuque

Muevo tu tema al foro de Frameworks y Plugins Javascript desde Javascript.

Saludos,

SirDuque · #3 (**permalink**) 02/03/2011, 16:24

Antes de repostear prefiero revivir......

Chicos, utilizo esta funcion para generar una nueva fila de campos....
quiero agregar esta funcion a distintos campos, en especial en el evento onfocus. quiero que cada vez que agan onFocus en (name)"x"; "x1";"x2";"x3";"x4"..... y continua. Genere otra fila de campos.

Se entienede?.... bueno espero que alguien me pueda ayudar.!

SirDuque · #4 (**permalink**) 02/03/2011, 16:56

Solucion

Código HTML:

Ver original<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Documento sin t&iacute;tulo</title>
</head>
<script type="text/javascript" src="jquery-1.4.1.min.js"></script>
 
<script>
emails=0;
function agregar() {
    emails=emails+1;
    $("#campos").append('<li class="email'+emails+'"><input type="text" name="email[]" onFocus="agregar();" size="25" />&nbsp;&nbsp;<a href="#" onclick="javascript:borrar('+emails+');">Borrar</a></li>');
}
</script>
 
<body>
 
<div id="campos"></div>
<input type="button" name="button" onClick="agregar()"  onFocus=""value="agregar">
</body>
</html>

FUENTE