Tengo desplegables anidados, al pinchar en un botón añade filas (y sus dependientes) y al pulsar en otro elimina la fila que toca (y sus dependientes). El caso es que añade bien, pero al borrar si quiero borrar la fila 3 y las q dependen de ella, me borra la 3 y todas las que tenía por debajo. Debe ser porque se estén anidando los span, pero por más que lo miro no encuentro el fallo, podéis ayudarme?.
Con las siguientes 2 funciones añado las filas (patron, nanda, noc y nic, nic depende de las 3 anteriores, noc de las 2 y nanda de patrón sólamente).
Código:
function addPatron(str)
{
num_patron = parseInt(str)
while(document.getElementById(num_patron+1))
{
//alert(num_patron+"existe, probemos con "+(num_patron+1))
num_patron++
}
//alert(num_patron+" no existe")
var url="addPatron.php"
//url = url + str
xmlHttp.onreadystatechange=patronAdded
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}
function patronAdded()
{
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
var v = xmlHttp.responseText.split('#') //separas lo de antes del = y lo dedespués y se inserta en v[o] y v[1]
var i = v[0].split('*') //Separas lo que hay antes y después de cada "," insertándolo en posiciones del vector s
var t = v[1].split('*') //Separas lo que hay antes y después de cada "," insertándolo en posiciones del vector s
var sHTML = "<div class='Patron'><div class='PatronControl'>PATRON</div><select class='SelectPatron' name='patron"+(num_patron+1)+"' id='patron"+(num_patron+1)+"' onchange='nanda(this.value,this.id)'><option>Elige Patron</option>"
for (number in t) //recorremos todo el vector s con el iterador number
{
sHTML = sHTML + "<option value="+i[number]+">"
sHTML = sHTML + t[number]
sHTML = sHTML + "</option>"
}
sHTML = sHTML + "</select><div class='Puntuacion'>evaluación al ingreso: <select class='SelectForm' name='pa"+num_patron+"_in' style=' width:40px;'><option>0</option><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select></div><div class='Puntuacion'>evaluación al alta: <select class='SelectForm' name='pa"+num_patron+"_al' style=' width:40px;'><option>0</option><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select></div><div class='DeletePatron' id='"+(num_patron+1)+"' onclick='borrarPatron(this.id)'></div><div class='AddPatron' id='"+(num_patron+1)+"' onclick='addPatron(this.id)'></div></div>"
sHTML = sHTML + "<div class='Namda'><div class='NamdaControl'>NAMDA</div><span id='p"+(num_patron+1)+"_1'><select class='SelectPatron' name='nanda"+(num_patron+1)+"_1' id='nanda"+(num_patron+1)+"_1'></select><div class='Puntuacion'>evaluación al ingreso: <select class='SelectForm' name='na1_in' style=' width:40px;'><option>0</option><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select></div><div class='Puntuacion'>evaluación al alta: <select class='SelectForm' name='na1_al' style=' width:40px;'><option>0</option><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select></div></span><div class='DeleteNamda'></div><div class='AddNamda' id='"+(num_patron+1)+"_"+"1' onclick='addNanda(this.id)'></div></div>"
// sHTML = sHTML + (globalID+1)
// sHTML = sHTML + "'>"
sHTML = sHTML + "<div class='Noc'><div class='NocControl'>NOC</div><span id='p"+(num_patron+1)+"_1_1'><select class='SelectPatron' name='noc1' id='noc1'></select><div class='Puntuacion'>evaluación al ingreso: <select class='SelectForm' name='no1_in' style=' width:40px;'><option>0</option><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select></div><div class='Puntuacion'>evaluación al alta: <select class='SelectForm' name='no1_al' style=' width:40px;'><option>0</option><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select></div></span><div class='DeleteNoc'></div><div class='AddNoc'></div></div>"
sHTML = sHTML + "<div class='Nic'><div class='NicControl'>NIC</div><span id='p"+(num_patron+1)+"_1_1_1'><select class='SelectPatron' name='nic1' id='nic1'></select><div class='Puntuacion'><label><input type='checkbox' id='nic1_verbal' name='nic1_verbal' checked='checked' />verbal</label><label><input type='checkbox' id='nic1_escrito' name='nic1_escrito' />escrito</label><label><input type='checkbox' id='nic1_observado' name='nic1_observado' />observado</label></div></span><div class='DeleteNic'></div><div class='AddNic'></div></div><span id='nic"+(num_patron+1)+"_1_1_1'><span id='noc"+(num_patron+1)+"_1_1'><span id='nan"+(num_patron+1)+"_1'></span></span></span></span><span id='pat"+(num_patron+1)+"'>"
document.getElementById("pat"+num_patron).innerHTML=sHTML
num_patron = num_patron + 1
alert(num_patron)
}
}
Y aquí el código donde están los span para insertar
Código HTML:
<div class="LayoutPatron">
<div class="Patron">
<div class="PatronControl">PATRON</div>
<?php
$conexion=mysql_connect("","","") or die("Problemas en la conexion primera");
mysql_select_db("codigos_patrones",$conexion) or die("Problemas en la seleccion de la base de datos");
$result = mysql_query("SELECT * FROM `pattern`", $conexion);
mysql_close($conexion);
?>
<select class="SelectPatron" name="patron1" id="patron1" onchange="nanda(this.value,this.id)">
<option selected>Elige patrón</option>
<?php while ($r=mysql_fetch_array($result)) {
$id_patron1=$r['Id'];
$patron1=utf8_encode($r['Text']);?>
<option value="<?php echo $id_patron1;?>"><?php echo $patron1;?></option>
<?php } ?>
</select>
<div class="DeletePatron" id="1" onclick="borrarPatron(this.id)"></div>
<div class="AddPatron" id="1" onclick="addPatron(this.id)"></div>
</div>
<?php/* for($nan=1;$nan<=$postnan1;$nan++){ */?>
<div class="Namda">
<div class="NamdaControl">NAMDA</div>
<span id="p1_1">
<select class="SelectPatron" id="nanda1_1"></select>
</span>
<div class="DeleteNamda"></div>
<div class="AddNamda" id="1_1" onclick="addNanda(this.id)"></div>
</div>
<?php/* }*/ ?>
<!-- fin for de nanda -->
<div class="Noc">
<div class="NocControl">NOC</div>
<span id="p1_1_1">
<select class="SelectPatron"></select>
</span>
<div class="DeleteNoc"></div>
<div class="AddNoc" id="1_1_1" onclick="infoNoc(this.id)"></div>
</div>
<div class="Nic">
<div class="NicControl">NIC</div>
<span id="p1_1_1_1">
<select class="SelectPatron"></select>
</span>
<div class="DeleteNic"></div>
<div class="AddNic" id="1_1_1_1" ></div>
</div>
<span id=nic1_1_1_1> <!-- lugar donde añadiremos un nic entero al hacer click-->
</span>
<span id=noc1_1_1> <!-- lugar donde añadiremos un noc entero al hacer click-->
</span>
<span id=nan1_1> <!-- lugar donde añadiremos un nanda entero al hacer click-->
</span>
<span id=pat1> <!-- lugar donde añadiremos un patron entero al hacer click-->
</span>
</div>