al click apri div e caricaci un php

[Phunx20]

buondì,
sono nuovissimo di javascript, ciò che vorrei è avere una lista di nomi, facendo click su ognuno, sotto al nome dovrebbe aprirsi un div nel quale venga caricata una pagina php.

Credo sia una cosa semplice per voi che ne sapete, per me purtroppo è un po' arabo..

ciò che ho appezzato finora è (con jQuery);

var state = 'none';

function show(show_id)
{
	var ss= document.getElementById(show_id);
	var len= ss.options.length;
	var str="";
	var j=0;
	for(var i=0;i<len;i++){		
		if(ss.options[i].selected == true)
		{			
		if(j == 0)
			str= ss.options[i].value;
		else
			str += '|' + ss.options[i].value;
		j++;
		}
	}
	return str;
}
function showhide(id, page, form, append, data) {

if (state == 'block') { 
state = 'none'; 
} 
else { 
state = 'block'; 
	var veri = '';
	if( typeof(data) == "string")
		veri = data;
	else 
		veri = $(form).serialize();
	$.ajax({
   type: "POST",
   url: page,
   data: veri,
   error: function(html)
   {
   		alert("Errore..");
   },
   success: function(html)
   {
    	if( typeof(append) == "boolean")
			$(id).append(html);
		else
			$(id).html(html);
   }
  });
} 
if (document.all) { //IS IE 4 or 5 (or 6 beta) 
eval( "document.all." + id + ".style.display = state"); 
} 
if (document.layers) { //IS NETSCAPE 4 or below 
document.layers[id].display = state; 
} 
if (document.getElementById &&!document.all) { 
hza = document.getElementById(id); 
hza.style.display = state; 
} 
}

richiamato poi nella pagina con:

<div style="width:100%; vertical-align:middle; border:1px solid #09C; background-color:#CCC; cursor:pointer;" >
<div id="test<?php echo $customers['customer_id'] ?>" onClick="showhide('#responso<?php echo $customers['customer_id'] ?>', 'customers_details.php', form_<?php echo $customers['customer_id'] ?>, null, null);"><?php echo $customers['customers_name']; ?> 
<form id="form_<?php echo $customers['customer_id'] ?>">
<input type="hidden" name="customer_id" value="<?php echo $customers['customer_id'] ?>">
</form>
</div>
<div style="display: none;" id="responso<?php echo $customers['customer_id'] ?>"></div>
</div>

quello che mi serve è passare un unico dato al mio file php: il $customers['customer_id'], io ho trovato come farlo con un form, ma se ci fosse un qualunque altro modo che mi eviti righe di codice inutili tanto meglio!

Grazie!

[Phunx20]

ho trovato l'effetto che mi serve:
http://javascript.html.it/demo/javas...06/esempio.htm

ma qui i contenuti sono già caricati tutti all'interno della pagina, a me serve caricare i contenuti di ogni singolo blocco all'espansione. Il problema è che avrò almeno un centinaio di blocchi da espandere, se li carico tutti quanti al caricamento della pagina non finisce più.

Qualcuno mi sa aiutare ad includere il load di un file php esterno?

[manurat]

Secondo me innanzitutto dovresti modificare il codice degli input aggiungendo una classe, es "customer_id" e, poichè da quello che ho capito avrai multipli input di questo tipo ognuno dovrà avere un name diverso, perciò verrebbe una cosa tipo questa:

<input type="hidden" class="customer_id" name="customer_id<?php echo $customers['customer_id'] ?>" value="<?php echo $customers['customer_id'] ?>">

Poi dovrebbe essere sufficiente
- recuperare solo il valore dell'input che ha lo stesso id dell'elemento su cui avviene il click
- passare via ajax solo tale valore alla tua pagina php
- riempire il div "responso" corrispondente con la risposta ajax
- aprire il div responso corrispondente con un semplice .show() di jquery.

A questo proposito però, se vuoi come hai detto usare jquery potresti, visto che hai già incluso la libreria , semplificare molto il codice. (La classe che ti ho consigliato di associare agli input servirebbe proprio a jquery per associare l'evento a tutti gli input della tua pagina con quella medesima classe.)
Spero di aver interpretato correttamente la tua richiesta, facci sapere...