Foros del Web » Programando para Internet » Javascript »

Imput Text imposible poner espacios entre palabras

Estas en el tema de Imput Text imposible poner espacios entre palabras en el foro de Javascript en Foros del Web. Como estan? tengo un problema me es imposible poner un espacio entre palabras en un imput de texto Por ejemplo #10214 Mamadera No me deja ...
  #1 (permalink)  
Antiguo 18/09/2012, 20:35
 
Fecha de Ingreso: septiembre-2012
Ubicación: Argentina
Mensajes: 43
Antigüedad: 11 años, 7 meses
Puntos: 0
Imput Text imposible poner espacios entre palabras

Como estan? tengo un problema
me es imposible poner un espacio entre palabras en un imput de texto

Por ejemplo
#10214 Mamadera
No me deja hacer el espacio me obliga a escribirlo junto.

Pegue en un html nuevo el codigo y ahí si me deja
desde la base de datos tambien puedo.

Código PHP:
<?php

$cnx
mysql_connect('localhost','root','saracatunga') or die(mysql_error());
mysql_select_db("arrorro",$cnx);
$consulta"SELECT * FROM chupetesytetinas";
$resultado mysql_query($consulta$cnx);
?>
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
	<title>Arrorro Mi Sol</title>
	<link rel="stylesheet" href="style.css" type="text/css" />
    <link rel="stylesheet" href="fuentes.css" type="text/css" />
    <link rel="stylesheet" href="galleriffic-4.css" type="text/css" />
    <link rel="stylesheet" type="text/css" href="css/chromestyle.css" />
    
    <script type="text/javascript" src="js/chrome.js">

</script>
    
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript" src="js/jquery.galleriffic.js"></script>

<script type="text/javascript" src="js/jquery.history.js"></script>
    <script type="text/javascript" src="js/jquery.opacityrollover.js"></script>
    
		<script type="text/javascript">
			document.write('<style>.noscript { display: none; }</style>');
		</script>         
</head>
         <!-- Empieza el Body -->
<body>

	<div id="wrapper">
	
		<div id="header">
            
			<div id="navegacion">
				<ul class="menu">
					<li><a href="quienes_somos.html" class="active">QUIENES SOMOS</a></li>
					<li><a href="kits_armados.html" rel="dropmenu1">KITS ARMADOS</a></li>
					<li><a href="catalogo.html">CATALOGO</a></li>
					<li><a href="servicios_a_empresas.html">SERVICIOS A EMPRESAS</a></li>
                    <li><a href="contacto.html">CONTACTO</a></li>   
				</ul>
			</div>
                                               
<div id="dropmenu1" class="dropmenudiv">
<a href="http://www.dynamicdrive.com/">#1 la delicia de los pibes</a>
<a href="http://www.cssdrive.com">CSS Drive</a>
<a href="http://www.javascriptkit.com">JavaScript Kit</a>
<a href="http://www.codingforums.com">Coding Forums</a>
<a href="http://www.javascriptkit.com/jsref/">JavaScript Reference</a>
</div>

<script type="text/javascript">

cssdropdown.startchrome("navegacion")

</script>		
		
		</div>
		
      <div id="content-contenedor">
        <div id="contenido">
        			<div id="titulomayor"><h1>CHUPETES Y TETINAS</h1></div>
                    <div id="volvercatalogo1"><h2><a href="catalogo.html">Volver atrás al catálogo | </a></h2></div>
				<div id="entitular"><h4>- Clicke&aacute; en cada miniatura para verla en grande a la derecha:</h4></div>
                
                
		  <div id="gallery" class="content">
					<div id="controls" class="controls"></div>
                <div class="slideshow-container">
					<div id="loading" class="loader"></div>
                <div id="slideshow" class="slideshow"></div>
                </div>
			  <div id="caption" class="caption-container"></div>
          </div>
				<div id="thumbs" class="navigation">
					<ul class="thumbs noscript"> 
Código PHP:
<?php 
    
while($fila mysql_fetch_array($resultado)){
        echo 
"<li>";
echo 
'<a class="thumb" href="500x500 CHUPETES Y TETINAS/'.$fila['NOMBRE FOTO'].'" title="'.$fila['DESCRIPCION'].'">';
echo 
'<img src="500x500 CHUPETES Y TETINAS/'.$fila['NOMBRE MINIATURA'].'" alt="Title #0" /></a>';
echo 
'<div class="caption">'.$fila['DESCRIPCION'].'</div>';
         echo
' </li>';
    }

            
?>
Código HTML:
 </ul>   
     </div>    
			

				<div style="clear: both;"></div> 
          
</div><br/>
      </div>
      <div id="falsofooter"><br />
<h2><a href="catalogo.html">Volver atrás al catálogo | </a></h2>
		</div>
        
        <div id="footer">
<div id="info1_footer"><h3>(+54 011) 4901-7148 / (+54 011) 15-6283-6890</h3></div>
<div id="info2_footer"><h3>[email protected]</h3></div>
<div id="info3_footer"><h3>Arrorro Mi Sol</h3></div>
        		  <div style="clear: left; float: left; padding-top: 0px;">
					<a href="#addImage" id="addImageLink">Insert Image into Position 5</a>
					<br />
					<a href="#removeImageByIndex" id="removeImageByIndexLink">Remove Image at Position 5</a>
					<br />
					<a href="#removeImageByHash" id="removeImageByHashLink">Remove the Lizard Image (by its hash value 'lizard')</a>
		  </div> 

        </div>
	
	</div>
    
		<script type="text/javascript">
			jQuery(document).ready(function($) {
		$('div.navigation').css({'width' : '243px', 'float' : 'left', 'margin-left' : '15px'}); 
				$('div.content').css('display', 'block');

				var onMouseOutOpacity = 0.80;
				$('#thumbs ul.thumbs li').opacityrollover({
					mouseOutOpacity:   onMouseOutOpacity,
					mouseOverOpacity:  1.0,
					fadeSpeed:         'fast',
					exemptionSelector: '.selected'
				});

				var gallery = $('#thumbs').galleriffic({
					delay:                     1000, //el original es 2500
					numThumbs:                 12, //el original es 15
					preloadAhead:              12, //original 10
					enableTopPager:            true,
					enableBottomPager:         true,
					maxPagesToShow:            7,
					imageContainerSel:         '#slideshow',
					controlsContainerSel:      '#controls',
					captionContainerSel:       '#caption',
					loadingContainerSel:       '#loading',
					renderSSControls:          true,
					renderNavControls:         true,
					playLinkText:              'INICIAR PRESENTACION',
					pauseLinkText:             'PAUSAR PRESENTACION',
					prevLinkText:              '&lsaquo; ANTERIOR ART.',
					nextLinkText:              'SIGUIENTE ART. &rsaquo;',
					nextPageLinkText:          'SIGUIENTE &rsaquo;',
					prevPageLinkText:          '&lsaquo; ANTERIOR',
					enableHistory:             true,
					autoStart:                 false,
					syncTransitions:           true,
					defaultTransitionDuration: 900, //original 900
					onSlideChange:             function(prevIndex, nextIndex) {
						this.find('ul.thumbs').children()
							.eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()
							.eq(nextIndex).fadeTo('fast', 1.0);
					},

					onPageTransitionOut:       function(callback) {
						this.fadeTo('fast', 0.0, callback);
					},
					onPageTransitionIn:        function() {
						this.fadeTo('fast', 1.0);
					}
				});
		

					if(hash) {
						$.galleriffic.gotoImage(hash);
					} else {
						gallery.gotoIndex(0);
					}
				}
				$.historyInit(pageload, "advanced.html");
				$("a[rel='history']").live('click', function() {
					if (e.button != 0) return true;
					var hash = this.href;
					hash = hash.replace(/^.*#/, '');
					$.historyLoad(hash);

					return false;
				});
Código PHP:
<?php
$categoria 
=  $_GET['seccion'];
if( isset(
$_GET['foto']) ){
    
//in caso que sea tal, in caso que sea tal
    //para poder cargarle sus estilos correspondientes segun los html mios q uso muchos estilos
$rutamaxi $_GET['foto'];

    }else{
        
$rutamaxi="BLANK.jpg";
    }    
    
?>                
                
<?php $maxi="11911 MOISES DE VIAJE.jpg"?>
<?php $mini
="MINI 11109.jpg"?>
      
    <?php echo "$('#addImageLink').click(function(e) {";?>
                 <?php echo "  gallery.insertImage('<li>";?>                                                                                            <?php echo "\\"?>
<?php 
echo '<a class="thumb" href="500x500 CHUPETES Y TETINAS/'; echo $rutamaxi; echo '"title="Dynamically';?>                          <?php echo '/Added Image">\\'?>
<?php 
echo '<img src="500x500 CHUPETES Y TETINAS/'; echo $mini; echo'"\\'?>
<?php 
echo 'alt="Dynamically Added Image" />\\'?>
                        <?php echo    "</a>"?>                                                                                                        <?php echo "\\"?>
                        <?php echo'    <div class="caption">#11911 MOISES DE VIAJE'?>                                                                        <?php echo "\\"?>
                            <?php echo"</div>";?>                                                                                                        <?php echo "\\"?>
                        <?php echo"</li>', 1);";?>
                    
                    <?php echo"e.preventDefault();";?>
                <?php echo"});";?>
[HTML]


$('#removeImageByIndexLink').click(function(e) {
if (!gallery.removeImageByIndex(5))
alert('There is no longer an image at position 5 to remove!');

e.preventDefault();
});

$('#removeImageByHashLink').click(function(e) {
if (!gallery.removeImageByHash('lizard'))
alert('The lizard image has already been removed!');

e.preventDefault();
});

});
</script>
Código HTML:
<!-- ALTA DE FOTOS -->

<form action="producto_altas.php" method="post" enctype="multipart/form-data" name="form1" id="form1">
  <table width="450" border="1" align="center" cellpadding="2" cellspacing="2">
    <tr>
      <td colspan="2" align="right" bgcolor="#FFFFFF"><strong>Altas de Productos</strong></td>
    </tr>
    <tr>
      <td align="right"><strong>Foto</strong></td>
      <td><label>
        <input type="file" name="Foto" id="Foto" />
      </label></td>
    </tr>
    <tr>
      <td align="right"><strong>Miniatura</strong></td>
      <td><label>
        <input type="file" name="Miniatura" id="Miniatura" />
      </label></td>
    </tr>
    <tr>
      <td width="151" align="right"><strong>Descripcion</strong></td>
      <td width="279"><label>
        <input type="text" name="Descripcion" id="Descripcion" />
      </label></td>
    </tr>
    <tr>
      <td colspan="2" align="right" bgcolor="#FFFFFF"><label>
        <input type="submit" name="button" id="button" value="Submit" />
      </label></td>
    </tr>
  </table>
</form>
          
</body>
</html> 
Ustedes creen que el CSS tiene algo que ver?
Les pido ayuda
  #2 (permalink)  
Antiguo 18/09/2012, 21:57
 
Fecha de Ingreso: septiembre-2012
Ubicación: Argentina
Mensajes: 43
Antigüedad: 11 años, 7 meses
Puntos: 0
Respuesta: Imput Text imposible poner espacios entre palabras

Haciendo prueba y error, descubrí el error.

El problema está en que la galeria en javascript de la GALLERIFFIC está acaparando la atencion de mi teclado, no se si se le dice "focus" o cómo.

Al apretar ESPACIO, no me muestra el espacio sino que se mueve a la proxima foto, porque tiene la atencion sobre la GALLERIFIC.



Alguno conoce que codigo debo escribir para que cuando presiono en el imput, pierda el focus sobre la galeria??
  #3 (permalink)  
Antiguo 18/09/2012, 22:00
Avatar de NSD
NSD
Colaborador
 
Fecha de Ingreso: mayo-2012
Ubicación: Somewhere
Mensajes: 1.332
Antigüedad: 11 años, 11 meses
Puntos: 320
Respuesta: Imput Text imposible poner espacios entre palabras

buenas bienvenido al foro,
Cita:
Ustedes creen que el CSS tiene algo que ver?
no tiene na que ver salvo que tu problema sea que la web se vea fea.

pfffff pusiste codigo a mansalva, viendolo asi se hace muy dificil encontar un error, si ya lo tienes en un server pon un link asi lo vemos funcionando.

bien, por otro lado tienes muchos .js externos, es posible que tengas un conflicto entre ellos y alguno este aplicando una mascara a tu input.
ve quitando uno por uno hasta que puedas escribir luego agrega los demas e identifica que archivo js es el que origina el problema. cuando lo tengas dime cual es y cual es su fuente (sitio del autor o sino pega el codigo) y lo revisamos.

nota: a simple vista es un problema de js, pero sigamos estudiandolo y que algun admin mueva el tema despues si lo cree conveniente.


EDITO: comentamos juntos por lo que no vi tu segundo comentario, publica las fuentes de ese script y lo reviso.
__________________
Maratón de desafíos PHP Junio - Agosto 2015 en FDW | Reglamento - Desafios
  #4 (permalink)  
Antiguo 18/09/2012, 22:04
Avatar de NSD
NSD
Colaborador
 
Fecha de Ingreso: mayo-2012
Ubicación: Somewhere
Mensajes: 1.332
Antigüedad: 11 años, 11 meses
Puntos: 320
Respuesta: Imput Text imposible poner espacios entre palabras

ya lo he revisado, cambia esta linea:

enableKeyboardNavigation: true, // Specifies whether keyboard navigation is enabled

por esta:

enableKeyboardNavigation: false, // Specifies whether keyboard navigation is enabled

saludos

EDITO: otra posibilidad para no perder el uso del teclado es eliminar en el archivo jquery.galleriffic.js las lineas:
Cita:
case 32: // space
gallery.next();
e.preventDefault();
break;
que estan en el renglon 938, con eso deberia andar.
__________________
Maratón de desafíos PHP Junio - Agosto 2015 en FDW | Reglamento - Desafios

Última edición por NSD; 18/09/2012 a las 22:10
  #5 (permalink)  
Antiguo 18/09/2012, 22:17
 
Fecha de Ingreso: septiembre-2012
Ubicación: Argentina
Mensajes: 43
Antigüedad: 11 años, 7 meses
Puntos: 0
Respuesta: Imput Text imposible poner espacios entre palabras

Gracias señor, su respuesta funciona y le agradezco mucho.

Por simple curiosidad, hay alguna forma de hacer que se pierda el focus al clickear en el imput?

ya que navegando por internet, he dado con este codigo

<form name="myform2">
<input type="text" name="mytextfield2">
<input type="button" name="mybutton" value="Set Focus" OnClick="document.myform2.mytextfield2.focus();">
</form>

y adaptado a mi formulario , he escrito esto pero no me ha funcionado, no pierde el focus,

<input type="text" name="Descripcion" id="Descripcion" value="Set Focus" OnClick="document.form1.Descripcion.focus();" />

(porque el form se llama form1 y este imput se llama Descripcion)
tambien probe reemplazando 'document' por el nombre de mi archivo en cuestion, y nada

Esto es por simple curiosidad. Muchisimas gracias!
  #6 (permalink)  
Antiguo 18/09/2012, 22:24
Avatar de NSD
NSD
Colaborador
 
Fecha de Ingreso: mayo-2012
Ubicación: Somewhere
Mensajes: 1.332
Antigüedad: 11 años, 11 meses
Puntos: 320
Respuesta: Imput Text imposible poner espacios entre palabras

el focus es el foco del elemento, se gana cuando se hace click sobre el o cuando se pasa el mouse por arriba en algunos casos (similar a active) la libreria que usas esta constantemente capturando el foco para usar el teclado, por lo que de poco te valdra ese codigo. habria que estudiar a fondo la libreria para modificar eso (ya estoy con sueño y eso te lo dejo a ti jeje)
prueba con:
Código HTML:
Ver original
  1. <input type="text" name="Descripcion" id="Descripcion" onClick="$('#Descripcion').focus();" />
pero no tengas muchas esperanzas.
saludos.
__________________
Maratón de desafíos PHP Junio - Agosto 2015 en FDW | Reglamento - Desafios
  #7 (permalink)  
Antiguo 19/09/2012, 10:50
 
Fecha de Ingreso: septiembre-2012
Ubicación: Argentina
Mensajes: 43
Antigüedad: 11 años, 7 meses
Puntos: 0
Respuesta: Imput Text imposible poner espacios entre palabras

Excelentes aportes. Muy agradecido.
Doy por cerrado este tema

Etiquetas: formulario, imput, txt
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 13:10.