Foros del Web » Programando para Internet » Javascript »

[SOLUCIONADO] javascript: buscar el siguiente numero mayor de una lista

Estas en el tema de javascript: buscar el siguiente numero mayor de una lista en el foro de Javascript en Foros del Web. Hola buenas, gracias de antemano . Estoy intentando hacer una agenda para mi web en la que los eventos aparecen en una lista , y ...
  #1 (permalink)  
Antiguo 21/07/2013, 02:45
 
Fecha de Ingreso: julio-2013
Mensajes: 34
Antigüedad: 10 años, 9 meses
Puntos: 2
javascript: buscar el siguiente numero mayor de una lista

Hola buenas, gracias de antemano .
Estoy intentando hacer una agenda para mi web en la que los eventos aparecen en una lista , y me gustaría que al cargar el documento el evento mas cercano a la fecha del usuario cambiase su class a active. Para ello tengo marcada cada etiqueta de la lista con la id="fecha del evento" en este formato (20130817), y lo que me gustaría hacer es buscar entre las id's la fecha de hoy y si no la encuentra que marque el siguiente numero mas grande y si hubiera 2 iguales que se quede con el primero y les cambie el class a "active".

<li id="20130817" ></li>
<li id="20130818" ></li>
<li id="20130820" ></li>
<li id="20130821" ></li>
<li id="20130823" ></li>
<li id="20130828" ></li>
<li id="20130829" ></li>
<li id="20130830" ></li>
<li id="20130831" ></li>
no tengo ni idea de por donde empezar a ver si alguien me ilumina.
  #2 (permalink)  
Antiguo 21/07/2013, 03:15
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años
Puntos: 1284
Respuesta: javascript: buscar el siguiente numero mayor de una lista

Hola:

En principio, los id no pueden empezar por un número... debe ser por una letra, o tal vez un guión bajo "_" (cosa de la que no estoy muy seguro)...

Tratándose de una lista podrías consultar la colección de tags "li" del elemento padre (ol o ul).getElementsByTagName("li")... pero por lo que veo debes usar algún lenguaje en el servidor, por lo que supongo que sería más fácil y accesible.

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #3 (permalink)  
Antiguo 21/07/2013, 05:16
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 8 meses
Puntos: 2114
Respuesta: javascript: buscar el siguiente numero mayor de una lista

Cita:
Iniciado por caricatos Ver Mensaje
En principio, los id no pueden empezar por un número... debe ser por una letra, o tal vez un guión bajo "_" (cosa de la que no estoy muy seguro)...
Si. Letras, guiones bajos (_) o guiones normales (-).

Aunque como viene siendo habitual, en el burdel de HTML5 son más permisivos y sólo dicen que el identificador debe de contener al menos un carácter y no contener espacios. Todo lo demás, da igual. Hasta signos de puntuación se podrían usar.
  #4 (permalink)  
Antiguo 21/07/2013, 06:04
 
Fecha de Ingreso: julio-2013
Mensajes: 34
Antigüedad: 10 años, 9 meses
Puntos: 2
Respuesta: javascript: buscar el siguiente numero mayor de una lista

si tienen razón en html4.01 no se puede comenzar id con nÚmeros y en html5 no es recomendable hacerlo , gracias por el dato PERO ese no era mi cuestión.
por favor olviden la pregunta de arriba. esta es mi pregunta.

Hola buenas, gracias de antemano .
Estoy intentando hacer una agenda para mi web en la que los eventos aparecen en una lista , y me gustaría que al cargar el documento el evento mas cercano a la fecha del usuario cambiase su class a active. Para ello tengo marcada cada etiqueta de la lista con el name="fecha del evento" en este formato (20130817), y lo que me gustaría hacer es buscar entre los nombres de los <li> la fecha de hoy y si no la encuentra que marque el siguiente numero mas grande y si hubiera 2 iguales que se quede con el primero y les cambie el class a "active".

<li name="20130817" ></li>
<li name="20130818" ></li>
<li name="20130820" ></li>
<li name="20130821" ></li>
<li name="20130823" ></li>
<li name="20130828" ></li>
<li name="20130829" ></li>
<li name="20130830" ></li>
<li name="20130831" ></li>
no tengo ni idea de por donde empezar a ver si alguien me ilumina.

Última edición por zerokilled; 21/07/2013 a las 07:13
  #5 (permalink)  
Antiguo 21/07/2013, 06:32
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 8 meses
Puntos: 2114
Respuesta: javascript: buscar el siguiente numero mayor de una lista

Los elementos de las listas no poseen ningún atributo name: http://www.w3.org/TR/html4/index/attributes.html

Puedes usar identificador, simplemente ponle que empiece por una guión bajo.

Yo creo que lo ideal es lo que comenta caricatos, de hacerlo mediante algún lenguaje de servidor. ¿Por qué quieres hacerlo con JavaScript?

Cuando publiques código intenta usar highlight o code.

Por cierto, bienvenido al foro.
  #6 (permalink)  
Antiguo 21/07/2013, 07:16
 
Fecha de Ingreso: julio-2013
Mensajes: 34
Antigüedad: 10 años, 9 meses
Puntos: 2
Respuesta: javascript: buscar el siguiente numero mayor de una lista

Joder no doy pie con bola tampoco puedo usar name en <li> , por lo que veo si que pudo usar title="20120919" .O tampoco puedo poner números en title?

Me pareció que javascript podría hacer lo que yo quiero sin problemas.
  #7 (permalink)  
Antiguo 21/07/2013, 10:32
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años
Puntos: 1284
Respuesta: javascript: buscar el siguiente numero mayor de una lista

Hola:

No entiendo el problema con poner una letra delante del número; al final en vez de obtener el número directamente debes usar substr(1)... supongo que algo así deberías hacer para discriminar el año del mes y del día... y sigue valiendo la opción de leer la colección de elementos li.

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #8 (permalink)  
Antiguo 23/07/2013, 16:58
 
Fecha de Ingreso: julio-2013
Mensajes: 34
Antigüedad: 10 años, 9 meses
Puntos: 2
Respuesta: javascript: buscar el siguiente numero mayor de una lista

Bueno al final lo solucioné de la manera mas compleja posible buscándome la vida como pude , bueno os pongo la solución que le di , que es capaz de crearle una gran jaqueca al mismo macgiver.
la solución es muy especifica para mi caso , que es joomla 2.5 con el componente jevents + modulo last_events. y una librería juery llamada sly (es un carrusel)


el tema es que tengo una agenda en jevents que se cargaba en una tabla , ice que se cargara en una lista , a demás quería que cunado hicieses click en <li> cargara el enlace correspondiente así que me puse con la plantilla lisent_body.php de jevents y cambie la linea:
Código HTML:
		if( $event_day_month_year <> $chdate ){
			$date =JEventsHTML::getDateFormat( $row->yup(), $row->mup(), $row->dup(), 1 );
						
			
		}

		echo '<li   id="_'.$row->ev_id().'"  class="'.$row->uid().'" ><div class="bigday"><script> 
<-------- aquí defino el id de la lista con la id del evento de jevents con un guión bajo delante por el tema de que las id's no deben comenzar números y el class con otra id que tiene jevents que esta cifrada o en hexadecimal o algo raro.



Código HTML:

$(".'.$row->uid().'").click(function(){$("#con").fadeOut("slow").load("'.$row->viewDetailLink($row->yup(),$row->mup(),$row->dup(),false).' #detalleframe").fadeIn("slow");});
</script> 
<----------- aquí le digo k al hacer click en la classe codificada #con se pire a dormir con un fundido y cargé el enlace en #con despertando de nuevo ademas de la url de destino que la genero con php de la base de datos de jevents
solo quiero la división con el id detalleframe y así se lo hago saber.
El tema es que tengo que generar este código tantas veces como lineas tenga la lista .

Se que se puede hacer de una vez pero no me funcionaba (la consola de errores se volvía loca )



bueno ya tenia puesto el carrusel que bonito y le hacia click y cargaba el enlace en un div con id #con si recargar.



Ahora viene lo chungo el carrusel sly que integré en mi sitio definía el <li class="active" > como el primer objeto a mostrar en el slide.

Entonces publiqué esta pregunta en el foro para ver si podía hacer un script que capturara la fecha de hoy la comprase con la id de los <li> y cambiase la clase active
al mas reciente en el futuro

pronto me di cuenta que de poco me valdría.

El Carrusel sly que integré en mi sitio definía la posición inicial
con una opción en el archivo horizontal.js que decía algo así como

Startat ="2"

y ese "2" nada tenia que ver con la id mas bien era la posición de la linea dentro de la lista.


joder que problema....


entonces en la web de jevents vi un modulo que mostraba los eventos mas cercanos lo baje lo instalé lo configuré para que mostrara en evento mas cercano en el futuro
y le di el estilo display:none; (chapuzas mías).
Luego modifique el fichero de la platilla default lastet.php (o algo así)
ni corto ni perezoso copié dentro todo el contenido del archivo horizontal.js que era donde estaba la opción de startat y sumé un un par de lineas. (ahora las comento)

Código HTML:
<script>





jQuery(function($){
	"use strict";

	// -------------------------------------------------------------
	//   Basic Navigation
	// -------------------------------------------------------------
	(function () {
		var $frame  = $("#basic");
		var $slidee = $frame.children("ul").eq(0);
		var $wrap   = $frame.parent();
		var $foobar = $("li").index( $("#_'.$dayEvent->ev_id().'")  )
<----------------; ////// pues nada, aquí metí la var foobar para que me diera el index de ev_id que es la id que tenían las li en cuestión ojo al guión de delante (que esto lo aprendí aquí) .

Código HTML:
		// Call Sly on frame
		$frame.sly({
			horizontal: 2,
			itemNav: "basic",
			smart: 1,
			activateOn: "click", 
			mouseDragging: 1,
			touchDragging: 1,
			releaseSwing: 1,
			startAt: $foobar -17 ,
<-----------///////////
y aqui le pongo la var y - 17 .-¿Por Que? pues ne principio no lo savia luego me di cuenta que contaba todos los li de mi html no sabia por que y lo solucioné restando.
Aun que ahora viendo el código aquí ya veo el problema var "$foobar = $("li").index" le digo que me de en index basándose en todos los li tendría que definir también la id del objeto que contiene la lista

y así lo solucione.... Si alguien necesita algo parecido que lo haga de otra manera , seguro que es mejor.

Última edición por osobuco; 23/07/2013 a las 17:23

Etiquetas: lista, mayor, numero, siguiente
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 10:08.