Foros del Web » Programando para Internet » Javascript »

Checkbox "embedido" en JavaScript

Estas en el tema de Checkbox "embedido" en JavaScript en el foro de Javascript en Foros del Web. Hola amigos Seguramente ya han visto ustedes los script que hay por toda la red donde se crean "arboles" tipo explorer de windows, Pues resulta ...
  #1 (permalink)  
Antiguo 06/04/2005, 15:54
Avatar de locojars  
Fecha de Ingreso: mayo-2002
Mensajes: 265
Antigüedad: 22 años
Puntos: 4
Checkbox "embedido" en JavaScript

Hola amigos
Seguramente ya han visto ustedes los script que hay por toda la red donde se crean "arboles" tipo explorer de windows,

Pues resulta que necesito poner un checkbox junto a cada uno de los items que crea. he probado utilizando el metodo documento.write pero solo me crea 1 solo checkbox y lo hace arriba del arbol, lo cual no me sirve y que yo necesito uno junto a cada item.

De que oforma puedo hacer eso???

El árbol que estoy utlizando es el siguiente

dTree 2.05 | www.destroydrop.com/javascripts/tree/

Espero puedan ayudarme.

Saludos.
JARS

Última edición por KarlanKas; 07/04/2005 a las 02:14 Razón: Estaba mal la URL
  #2 (permalink)  
Antiguo 25/02/2008, 09:37
 
Fecha de Ingreso: febrero-2008
Mensajes: 1
Antigüedad: 16 años, 2 meses
Puntos: 0
Re: Checkbox "embedido" en JavaScript

Aitor Solozabal Merino
Aqui esta una modificación simple encontrada en la WEB para hacer lo que tú quieres.
Here is a simple modification of dtree.js found on the web to do what you want

dtree.js modification --> dtreecheckbox.js

Reemplazar estas lineas de código en la función dentro del fichero javscript dTree.js
Replace these code lines in dTree.prototype.node = function(node, nodeId) funtion inside the javascript dtree.js file

//str += '<img id="i' + this.obj + nodeId + '" src="' + ((node._io) ? node.iconOpen : node.icon) + '" alt="" />';
str += node.title + '<img id="i' + this.obj + nodeId + '" src="' + ((node._io) ? node.iconOpen : node.icon) + '" alt="" />';


//if (node.title) str += ' title="' + node.title + '"';
if (node.target) str += ' target="' + node.target + '"';


un formulario de ejemplo para llamar a un programa que muestra un arbol dTree con las cajas de selección tipo checkbox
sample form to call a program to show a dtree with check box selection:

form_to_call_treeview_checkbox.php

<?php

?>
<table>
<tr>
<td>
<FORM name = 'form1' method = 'POST' action = ''>
<input type=text name=valor>
</td>
<td>
<input type=button name=open_popup ONCLICK="window.open('treeview_checkbox.php', 'popuppage', 'scrollbars=yes,resizable=yes,menubar=yes,width=40 0,height=600'); " value=" View ">
</td>
</tr>
<tr>
<td>
<INPUT TYPE=SUBMIT VALUE=OK>
</td></tr>
</table>

programa que muestra un arbol dtree con checkbox
program to show a dtree with checkbox:
treeview_checkbox.php
<?php
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Catalog Tree</title>

<link rel="StyleSheet" href="dtree.css" type="text/css" />
<script type="text/javascript" src="dtreecheckbox.js"></script>

</head>

<body>
<div class="dtree"><FORM>
<p><a href="javascript: d.openAll();">open all</a> | <a href="javascript: d.closeAll();">close all</a></p>
<?
function send_query( $db, $link, $sql ) {
$result = false;
if ($GLOBALS['MYSQLPHPEXTENSION']=="mysqli"){
if ( mysqli_select_db( $link,$db) ) {
$result = mysqli_query( $link,$sql );
if ( mysqli_errno( $link ) ) {
echo "MySQL error " . mysqli_errno( $link ) . ": " . mysqli_error( $link ) . "\n<br>When executing:<br>\n$sql\n<br>";
}
} else {
echo "MySQL error " . mysqli_errno( $link ) . ": " . mysqli_error( $link ) . "\n<br>When selecting database $db\n<br>";
}
}else{
if ( mysql_select_db( $db,$link) ) {
$result = mysql_query( $sql ,$link);
if ( mysql_errno( $link ) ) {
echo "MySQL error " . mysql_errno( $link ) . ": " . mysql_error( $link ) . "\n<br>When executing:<br>\n$sql\n<br>";
}
} else {
echo "MySQL error " . mysql_errno( $link ) . ": " . mysql_error( $link ) . "\n<br>When selecting database $db\n<br>";
}
}
return $result;
} //end function send_query
function fill_the_tree( $result) {
if ( $result ) {
if ($GLOBALS['MYSQLPHPEXTENSION']=="mysqli"){
while ( $row = mysqli_fetch_assoc( $result ) ) {
$campo = 1;
while ( list( $k, $v ) = each( $row ) ) {
if ( $campo == 1 ) {
$treeview_cod = $v;
}
if ( $campo == 2 ) {
$treeview_name = $v;
}
if ( $campo == 3 ) {
$treeview_desc = $v;
If ($treeview_desc=="folder") {
$treeview_url="";
}else{
$treeview_url=$treeview_desc.".url";// or .php or .html
}
}
if ( $campo == 4 ) {
$treeview_parent_cod = $v;
}
$campo++;
} ;
// rellena el arbol con cada fila que se extrae de la tabla tab_treeview
// Node(id, pid, name, url, title, target, icon, iconOpen, open)
?>
d.add(<?= $treeview_cod;?>,<?= $treeview_parent_cod;?>,'<?= $treeview_name;?>','<?= $treeview_url;?>','<?= $treeview_desc;?>');
<?php
}
mysqli_free_result( $result );
}else{
while ( $row = mysql_fetch_assoc( $result ) ) {
$campo = 1;
while ( list( $k, $v ) = each( $row ) ) {
if ( $campo == 1 ) {
$treeview_cod = $v;
}
if ( $campo == 2 ) {
$treeview_name = $v;
}
if ( $campo == 3 ) {
$treeview_desc = $v;
If ($treeview_desc=="folder") {
$treeview_url="";
}else{
$treeview_url=$treeview_desc.".url";// or .php or .html
}
}
if ( $campo == 4 ) {
$treeview_parent_cod = $v;
}
$campo++;
} ;
// rellena el arbol con cada fila que se extrae de la tabla tab_treeview
// Node(id, pid, name, url, title, target, icon, iconOpen, open)
//echo "d.add(" . $categories['categories_id'] . "," . $categories['parent_id'] . ",'" . addslashes($categories['categories_name']) . "','', '<input type=checkbox name=categories value=" . $categories['categories_id'] . ">');\n"; //,," . $categories['categories_id'] . ",,,); \n";

echo "d.add(" . $treeview_cod . "," . $treeview_parent_cod . ",'" . addslashes($treeview_name) . "','', '<input type=checkbox name=nodes value=" . $treeview_cod . ">');\n"; //,," . $treeview_cod . ",,,); \n";
}
mysql_free_result( $result );
}
}
} //end function fill_the_tree
echo "<script type='text/javascript'>
<!--

d = new dTree('d'); \n
d.add(0,-1,'Datafile Treeview','','');\n";

$MYSQLPHPEXTENSION="mysql"; // "mysqli"
$PASSWORD = "lbsb2vb"; // ""
$HOST = "localhost"; // "localhost"
$USER = "root"; // "aitorsol"
$DATABASE = "test"; // "aitorsol_es_db"
$TABLE = "tab_treeview"; // "tab_treeview"
if ($GLOBALS['MYSQLPHPEXTENSION']=="mysqli"){
$LINK = mysqli_connect( $HOST, $USER, $PASSWORD, $DATABASE ) or die ( "No se ha conectado" );
}else{
$LINK = mysql_connect( $HOST, $USER, $PASSWORD, $DATABASE ) or die ( "No se ha conectado" );
}
$QUERY = "select * from `" . $DATABASE . "` . `" . $TABLE . "` limit 0, 5000";
fill_the_tree( send_query( $DATABASE, $LINK, $QUERY ));

?>
document.write(d);

//-->
</script>
<INPUT TYPE="BUTTON" onClick="cycleCheckboxes(this.form)" VALUE="OK">
</form>
<script type='text/javascript'>
<!--
function cycleCheckboxes(what) {

window.opener.document.form1.valor.value="";
for (var i = 0; i<what.elements.length; i++) {
if ((what.elements[i].name.indexOf('nodes') >
-1)) {
if (what.elements[i].checked) {
window.opener.document.form1.valor.value += what.elements[i].value + ',';
}
}
}
window.close();
}
//-->
</script>
</div>
</body>

</html>


un guión sql para crear en una base de datos "test" mysql con la tabla y datos que son necesarios por la utilidad de ejemplo.
a sql script to create in a mysql "test" database a table and data needed by the sample utility

USE 'test'

DROP TABLE IF EXISTS `tab_treeview`;
CREATE TABLE `tab_treeview` (
`treeview_cod` smallint(5) NOT NULL AUTO_INCREMENT,
`treeview_name` char(25) NOT NULL DEFAULT '',
`treeview_desc` char(25) NOT NULL DEFAULT '',
`treeview_parent_cod` smallint(5) NOT NULL DEFAULT '0',
PRIMARY KEY (`treeview_cod`)
) ENGINE=MyISAM;

INSERT INTO `tab_treeview` VALUES
(1,'root','expediente',0),
(2,'parent1','expediente',1),
(3,'parent2','expediente',1),
(4,'parent3','expediente',1),
(5,'child1','carpeta',2),
(6,'child2','carpeta',2),
(7,'grandchild1','documento',5),
(8,'grandchild2','documento',5),
(9,'child3','carpeta',4),
(10,'child4','documento',4),
(11,'grandchild3','subcarpeta',9),
(12,'grandgrandchild1','documento',11),
(13,'grandgrandchild2','documento',11);
  #3 (permalink)  
Antiguo 25/02/2008, 09:51
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 22 años, 2 meses
Puntos: 772
Re: Checkbox "embedido" en JavaScript

Hola aitorsol. Bienvenido al foro.

La pregunta inicial es de hace casi 3 años. Por favor, no reviváis temas tan antiguos.

Saludos,
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.
Tema Cerrado




La zona horaria es GMT -6. Ahora son las 18:12.