8791 sujets

Développement web côté serveur, CMS

[Résolu] Récupérer contenu d'une div ?

Bonjour,

Pouvez-vous m'aider ?
Je suis face à un souci important.
Comment, par une variable php, récupérer le contenu d'une div ?
Un petit exemple simplissime pour encadrer ma question.

Dans la page html, j'ai :

<div="div1">test</div>




<?php
$ind=contenu de div1
?>


Je vous remercie d'avance pour vos réponses.
Bon weekend !
Modifié par jytest (23 Nov 2011 - 06:32)
Je crois que je n'ai pas été assez clair.
J'affine mon exemple :

<div id="tdi">test</div>




<?php
$ind=contenu de tdi
// idéalement, $ind devrait être égal à "test"
?>


J'ai même essayé cela :
$ind = "<script language='Javascript'> document.write('tdi'); </script>";
mais sans succès.

Comment faire ?
Modifié par jytest (19 Nov 2011 - 17:47)
Soit tu fais du PHP (méthode au dessus), soit tu ne fais pas de PHP mais du JS (innerHTML en JS ou .html() en jQuery).

Il faut faire un choix ...
Comment faire ?
A l'aide svp

Solution 1 :
Comment faire en javascript ?
jytest a écrit :
J'ai même essayé cela :
$ind = "<script language='Javascript'> document.write('tdi'); </script>";
mais sans succès




Solution 2 :
Jusqu'à preuve du contraire,
ceci ne fonctionne pas avec du contenu variable (provenant d'un code javascript)
kenor a écrit :
$string = "contenu de ta page";
$div = preg_replace('#.*<div="div1">(.*?)</div>.*#si','$1',$string);




Oubliant l'exemple,
je me tourne maintenant vers le code réel.
Sachant que je veux gérer en php (pour les Bases de données) :
comment faire pour récupérer le contenu de "idcategorie02" dans une variable en php?

Voici le code javascript :

// categorie02
function gocategorie02() {
	document.getElementById("loader02").style.display = "inline";
	getXhr();
	// On définit ce qu'on va faire quand on aura la réponse
	xhr.onreadystatechange = function() {
		// On ne fait quelquechose que si l'on a tout reçu et que le serveur est OK
		if (xhr.readyState == 4 && xhr.status == 200) {
			leselect = xhr.responseText;
			// On se sert de innerHTML pour rajouter les options à la liste
			document.getElementById('td03').innerHTML = leselect;
		}
	}
	// Ici on va voir comment faire du post	
	xhr.open("POST","php/ajaxcategorie03.php",true);
	// Ne ps oublier ç pour le post
	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
	// Ne ps oublier de poster les arguments
	// ici l'id de cat01
	sel = document.getElementById('categorie02');
	idcategorie02 = sel.options[sel.selectedIndex].value;
	xhr.send("ix="+idcategorie02);
	// Ouverture du tableau devis
	var selectValue = getSelectValue('categorie02');
	if (selectValue == "" || selectValue == "none") {
		hidden = 3;
	} else {
		hidden = 4;
	}
	document.getElementById("tr03").style.display = "";
	for (hidden; hidden<11; hidden++) {
		document.getElementById("tr0"+hidden).style.display = "none";
	}
	document.getElementById("loader02").style.display = "none";
}


Pour votre info, voici le contenu du fichier "php/ajaxcategorie03.php"

<?php
	require_once("connexionMysql.inc.php");
	echo "<select name='categorie03' id='categorie03' style='width:280px' onchange='gocategorie03()'>";
	if (isset($_REQUEST['ix'])) {
		$query = mysql_query("SELECT * FROM shop_categorie03".
			" WHERE parent=".$_REQUEST['ix'].
			" ORDER BY id");
        echo "<option value='none' ><span style='width:100%;' >-- Choisissez, svp ! --</span></option>";
		while ($back = mysql_fetch_assoc($query)) {	
			echo "<option value='".$back['id']."' ><span style='width:100%;' >".$back['libelle']."</span></option>";
		}
	}
	echo "</select>";
?>

Modifié par jytest (20 Nov 2011 - 10:50)
Salut,

tu n'as toujours pas expliqué ce que tu veux

parce que à la question

Comment, par une variable php, récupérer le contenu d'une div ?

réponse: c'est déjà fait dans ton code, $_REQUEST['ix'] étant une variable.

alors?

ton code marche pas?

si oui a quel niveau?

tu veux avoir accès a categorie02 dans la continuité du code qui appel ajax?

insères ta valeur dans un input de type hidden et soumet le formulaire associé. la page cible recevra la donnée( ton formulaire peut très bien pointé vers la même page que tu recharges ) ou continue avec d'autre appel ajax.

mais tu ne pourras pas récupérer directement du code modifié par le client dans le code serveur sans faire un appel au serveur... (sans rechargé la page oui grace a ajax, mais pas sans appel)
ça coule de sens. le serveur n'est pas voyant.
Je précise ce que je souhaite.
C'est récupérer dans la page principale "boutique00.php", le contenu de la variable $ind ou $_REQUEST['ix'] de "ajaxcategorie04.php" !
Cette valeur va me permettre ainsi d'accéder directement à une bdd
dont l'id sera justement cette valeur !
Je précise aussi que cet id n'est connu qu'après sélection de choix effectués dans les 4 listes liées dynamiques.
Aidez-moi, svp !
Quelque chose m'échappe.
Cela doit être évident pour vous.
J'ai tout relu un nombre certain de docs sur XMLHttpRequest, mais je n'ai toujours pas trouvé de solution !
Au secours !

Cela va être long, mais je vous mets tous les codes utiles au bon fonctionnement.
D'avance, je vous remercie pour l'attention portée à mon post !

Néanmoins tout ceci se trouve sur :
www.creaprint.be/new/boutique00.php

Voici "ajaxcategorie04.php"' :

<?php
	require_once("connexionMysql.inc.php");
	if (isset($_REQUEST['ix'])) {
		$query = mysql_query("SELECT * FROM shop_articles".
			" WHERE id=".$_REQUEST['ix']);
		while ($back = mysql_fetch_assoc($query)) {	
			$ind = $_REQUEST['ix'];
		}
	}
?>


Voici "ajaxcategorie03.php" :

<?php
	require_once("connexionMysql.inc.php");
	echo "<select name='categorie03' id='categorie03' style='width:280px;' onchange='gocategorie03()'>";
	if (isset($_REQUEST['ix'])) {
		$query = mysql_query("SELECT * FROM shop_categorie03".
			" WHERE parent=".$_REQUEST['ix'].
			" ORDER BY id");
        echo "<option value='none' ><span style='width:100%;' >-- Choisissez, svp ! --</span></option>";
		while ($back = mysql_fetch_assoc($query)) {	
			echo "<option value='".$back['id']."' ><span style='width:100%;' >".$back['libelle']."</span></option>";
		}
	}
	echo "</select>";
?>


Voici "ajaxcategorie02.php" :

<?php
	require_once("connexionMysql.inc.php");
	echo "<select name='categorie02' id='categorie02' style='width:280px;' onchange='gocategorie02()'>";
	if (isset($_REQUEST['ix'])) {
		$query = mysql_query("SELECT * FROM shop_categorie02".
			" WHERE parent=".$_REQUEST['ix'].
			" ORDER BY id");
        echo "<option value='none' ><span style='width:100%;' >-- Choisissez, svp ! --</span></option>";
		while ($back = mysql_fetch_assoc($query)) {	
			echo "<option value='".$back['id']."' ><span style='width:100%;' >".$back['libelle']."</span></option>";
		}
	}
	echo "</select>";
?>


Voici "ajaxcategorie01.php" :

<?php
	require_once("connexionMysql.inc.php");
	echo "<select name='categorie01' id='categorie01' style='width:280px;' onchange='gocategorie01()'>";
	if (isset($_REQUEST['ix'])) {
		$query = mysql_query("SELECT * FROM shop_categorie01".
			" WHERE parent=".$_REQUEST['ix'].
			" ORDER BY id");
        echo "<option value='none' ><span style='width:100%;' >-- Choisissez, svp ! --</span></option>";
		while ($back = mysql_fetch_assoc($query)) {	
			echo "<option value='".$back['id']."' ><span style='width:100%;' >".$back['libelle']."</span></option>";	
		}
	}
	echo "</select>";
?>


Voici toutes les fonctions javascript entre head et /head :

<script type="text/javascript">
<!--

// Retourne la valeur du select selectId
function getSelectValue(selectId) {
	// On récupère l'élément HTML <select>
	var selectElmt = document.getElementById(selectId);
	// Correspond au tableau des balises <option> du select
	selectElmt.options;
	selectElmt.selectIndex;
	// Correspond à l'index du tableau options qui est actuellement sélectionné
	return selectElmt.options[selectElmt.selectedIndex].value;
}

var xhr = null;
// XMLHttpRequest
function getXhr() {	
	if (window.XMLHttpRequest)
		//Firefox et autres
		xhr = new XMLHttpRequest();
	else 
		// Internet Explorer
		if(window.ActiveXObject) {
			try {
				xhr = new ActiveXObject("Msxml2.XMLHTTP");
			} catch(e) {
				xhr = new ActiveXObject("Microsoft.XMLHTTP");
			}
		} else {
			// XMLHttpRequest non supporté par le navigateur
			alert("Votre navigateur ne supporte pas l'objet XMLHTTPRequest...");
			xhr=false;
		}
}

// categorie00
function gocategorie00() {
	getXhr();
	// On définit ce qu'on va faire quand on aura la réponse
	xhr.onreadystatechange = function() {
		// On ne fait quelquechose que si l'on a tout reçu et que le serveur est OK
		if (xhr.readyState == 4 && xhr.status == 200) {
			document.getElementById("loader00").style.display = "none";
			leselect = xhr.responseText;
			// On se sert de innerHTML pour rajouter les options à la liste
			document.getElementById('td01').innerHTML = leselect;
		} else {
			document.getElementById("loader00").style.display = "inline";
		}
	}
	// Ici on va voir comment faire du post
	xhr.open("POST","php/ajaxcategorie01.php",true);
	// Ne ps oublier ç pour le post
	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
	// Ne ps oublier de poster les arguments
	// ici l'id de cat00
	sel = document.getElementById('categorie00');
	idcategorie00 = sel.options[sel.selectedIndex].value;
	xhr.send("ix="+idcategorie00);
	// Ouverture du tableau devis
	var selectValue = getSelectValue('categorie00');
	if (selectValue == "" || selectValue == "none") {
		hidden = 1;
	} else {
		hidden = 2;
	}
	document.getElementById("tr01").style.display = "";
	for (hidden; hidden<11; hidden++) {
		document.getElementById("tr0"+hidden).style.display = "none";
	}
}

// categorie01
function gocategorie01() {
	getXhr();
	// On définit ce qu'on va faire quand on aura la réponse
	xhr.onreadystatechange = function() {
		// On ne fait quelquechose que si l'on a tout reçu et que le serveur est OK
		if (xhr.readyState == 4 && xhr.status == 200) {
			document.getElementById("loader01").style.display = "none";
			leselect = xhr.responseText;
			// On se sert de innerHTML pour rajouter les options à la liste
			document.getElementById('td02').innerHTML = leselect;
		} else {
			document.getElementById("loader01").style.display = "inline";
		}
	}	
	// Ici on va voir comment faire du post
	xhr.open("POST","php/ajaxcategorie02.php",true);
	// Ne ps oublier ç pour le post
	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
	// Ne ps oublier de poster les arguments
	// ici l'id de cat01
	sel = document.getElementById('categorie01');
	idcategorie01 = sel.options[sel.selectedIndex].value;
	xhr.send("ix="+idcategorie01);
	// Ouverture du tableau devis
	var selectValue = getSelectValue('categorie01');
	if (selectValue == "" || selectValue == "none") {
		hidden = 2;
	} else {
		hidden = 3;
	}
	document.getElementById("tr02").style.display = "";
	for (hidden; hidden<11; hidden++) {
		document.getElementById("tr0"+hidden).style.display = "none";
	}
}

// categorie02
function gocategorie02() {
	getXhr();
	// On définit ce qu'on va faire quand on aura la réponse
	xhr.onreadystatechange = function() {
		// On ne fait quelquechose que si l'on a tout reçu et que le serveur est OK
		if (xhr.readyState == 4 && xhr.status == 200) {
			document.getElementById("loader02").style.display = "none";
			leselect = xhr.responseText;
			// On se sert de innerHTML pour rajouter les options à la liste
			document.getElementById('td03').innerHTML = leselect;
		} else {
			document.getElementById("loader02").style.display = "inline";
		}
	}
	// Ici on va voir comment faire du post	
	xhr.open("POST","php/ajaxcategorie03.php",true);
	// Ne ps oublier ç pour le post
	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
	// Ne ps oublier de poster les arguments
	// ici l'id de cat01
	sel = document.getElementById('categorie02');
	idcategorie02 = sel.options[sel.selectedIndex].value;
	xhr.send("ix="+idcategorie02);
	// Ouverture du tableau devis
	var selectValue = getSelectValue('categorie02');
	if (selectValue == "" || selectValue == "none") {
		hidden = 3;
	} else {
		hidden = 4;
	}
	document.getElementById("tr03").style.display = "";
	for (hidden; hidden<11; hidden++) {
		document.getElementById("tr0"+hidden).style.display = "none";
	}
}

// categorie03
function gocategorie03() {
	getXhr();
	// On définit ce qu'on va faire quand on aura la réponse
	xhr.onreadystatechange = function() {
		// On ne fait quelquechose que si l'on a tout reçu et que le serveur est OK
		if (xhr.readyState == 4 && xhr.status == 200) {
			document.getElementById("loader03").style.display = "none";
			leselect = xhr.responseText;
			// On se sert de innerHTML pour rajouter les options à la liste
			document.getElementById('td04').innerHTML = leselect;
		} else {
			document.getElementById("loader03").style.display = "inline";
		}
	}	
	// Ici on va voir comment faire du post
    xhr.open("POST","php/ajaxcategorie04.php",true);
	// Ne ps oublier ç pour le post
  	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
	// Ne ps oublier de poster les arguments
	// ici l'id de cat01
	sel = document.getElementById('categorie03');
	idcategorie03 = sel.options[sel.selectedIndex].value;
	xhr.send("ix="+idcategorie03);
	// Ouverture du tableau devis
	var selectValue = getSelectValue('categorie03');
	if (selectValue == "" || selectValue == "none") {
		hidden = 5;
	} else {
		hidden = 6;
	}
	document.getElementById("tr04").style.display = "";
	document.getElementById("tr05").style.display = "";
	document.getElementById("tr06").style.display = "";
	document.getElementById("tr07").style.display = "";
	document.getElementById("tr08").style.display = "";
	document.getElementById("tr09").style.display = "";
	document.getElementById("tr10").style.display = "";
	for (hidden=11; hidden<11; hidden++) {
		document.getElementById("tr0"+hidden).style.display = "none";
	}
}

-->
</script>


Voici la partie du html où se passe tout cela :

    <table id="tableoptions" border="0" cellspacing="0" style="vertical-align:middle;">
    	<tr>
        <td width="150"></td>
        <td width="280"></td>
        <td width="20"></td>
        </tr>
        
        <tr>
        <td colspan="3" style="padding:7px;" bgcolor="#0E72B5" class="blanc bold">Prix en ligne instantané</td>
        </tr>
        
        <tr>
        <td colspan="3" style="padding:7px;">
        Afin d'établir un devis,<br>veuillez choisir parmi toutes les options suivantes :</td>
        </tr>
        
        <tr id="tr00">
        <td width="150" style="padding:7px;">Document</td>
        <td width="280" id="td00">
        	<select name="categorie00" id="categorie00" style="width:280px;" onChange="gocategorie00();" >
            <option value="none">-- Choisissez, svp ! --</option>
            <?php
				require_once("php/connexionMysql.inc.php");
				$query = mysql_query("SELECT * FROM shop_categorie00 ORDER BY id");
				while ($back = mysql_fetch_assoc($query)) {
					echo "<option value='".$back['id']."' ><span style='width: 280px;' >".$back['libelle']."</span></option>";	
				}
			?>
            </select>
        </td>
        <td width="20">
            <span id="loader00" class="hidden"><img src="images/boutique/loader16.gif" alt="loading" /></span>
        </td>
        </tr>
        
        <tr id="tr01" style="display:none;">
        <td width="150" style="padding:7px;">Descriptif</td>
        <td width="280" id="td01">
<!--    <select name="categorie01" id="categorie01" style="width:280px;"></select>  -->     
		</td>
        <td width="20">
            <span id="loader01" class="hidden"><img src="images/boutique/loader16.gif" alt="loading" /></span>
        </td>
        </tr>
        
        <tr id="tr02" style="display:none;">
        <td width="150" style="padding:7px;">Format</td>
        <td width="280" id="td02">
<!--    <select name="categorie02" id="categorie02" style="width:280px;"></select>  -->     
        </td>
        <td width="20">
            <span id="loader02" class="hidden"><img src="images/boutique/loader16.gif" alt="loading" /></span>
        </td>
        </tr>
        
        <tr id="tr03" style="display:none;">
        <td width="150" style="padding:7px;">Papier</td>
        <td width="280" id="td03">
<!--    <select name="categorie03" id="categorie03" style="width:280px;"></select>  -->  
        </td>
        <td width="20">
            <span id="loader03" class="hidden"><img src="images/boutique/loader16.gif" alt="loading" /></span>
        </td>
        </tr>
        
    	<tr id="tr04" style="display:none;">
        <td width="150"></td>
        <td width="280"></td>
        <td width="20"></td>
        </tr>
        
        

<?php
	$ind = $_REQUEST['ix'];
	echo "ind = ".$ind;
?>



    	<tr id="tr05" style="display:none;">
        <td width="150"></td>
        <td width="280">
			<?php
            	echo "ind. ".$ind."<br/>";
            	echo "réf. ".$ref."<br/>";
				echo "com  ".$com."<br/>";
            ?>
        </td>
        <td width="20"></td>
        </tr>   
        
        
        <tr id="tr06" style="display:none;">
        <td width="150" style="padding:7px;">&nbsp;</td>
        <td width="280">
			<?php
            	echo "com. ".$com;
            ?></td>
        <td width="20"></td>
        </tr>
        
        <tr id="tr07" style="display:none;">
        <td width="150" style="padding:7px;">Prix d'impression</td>
        <td width="280" id="td04"><span class="c14 bold"><?php echo $pvht."€ HT"; ?></span><span class="c10"><?php echo "( ".$pvht."€ TTC)"; ?></span></td>
        <td width="20"></td>
        </tr>
        
    	<tr id="tr08" style="display:none;">
        <td width="150"></td>
        <td width="280"></td>
        <td width="20"></td>
        </tr>
        
        <tr id="tr09" style="display:none;">
        <td width="150" style="padding:7px;">&nbsp;</td>
        <td width="280" id="td05"><a href="panier.php">Ajouter au panier</a></td>
        <td width="20"></td>
        </tr>
        
        <tr id="tr10" style="display:none;">
        <td width="150" style="padding:7px;">&nbsp;</td>
        <td width="280" id="td05"><a href="panier.php">Ajouter au panier</a></td>
        <td width="20"></td>
        </tr>
        
        
    </table>

Modifié par jytest (22 Nov 2011 - 10:17)
Salut,

tu sais ce que j'ai dit dans l'autre post continue d'être vrai. j'avais tout dis.

tu n'as que 2 options.
- continuer dans le full ajax
- soumettre ta page a une nouvelle requete de page

le code php est executé au moment où ton serveur web appelle la page afin qu'il génére le html.

les appels ajax auront probablement lieu (et devrait être obligés ) aprés la génération totale
du code html de ta page.

le php de cette page ne redemarra pas. fait une croix sur cette idée.

et puis alors où est le problème?

ajaxcategorie04.php va te généré un id d'article.

le js lui récupèra cette valeur dans le xhr.responseText;
il suffit de faire un echo $ind à la fin de ajaxcategorie04.php.

de là tu veux mettre un un bouton ajouter au panier et inserer en base de données quand la personne clique dessus?

bon et bien
1/ nouvel appel d'un fichier ajax qui fait l'insert.

le principe est le même que entre ajaxcategorie02.php et ajaxcategorie03.php par exemple. a part que là l'utilisateur n'a pas à faire de choix tu récupères directement la valeur

http://www.commentcamarche.net/contents/javascript/jsvar.php3
a écrit :
citation du lien au dessus : "Lorsqu'une variable est déclarée sans le mot clé var, c'est-à-dire de façon implicite, elle est accessible de partout dans le script (n'importe quelle fonction du script peut faire appel à cette variable)"


et que tu vas peut-être passé plus d'un paramètre. l'article mais peut-être aussi l'id utilisateur ou je ne sais quoi.

evites par contre de transmettre des données comme le prix ou la devise. avec firebug par exemple tous les entrées et sortie d'appel ajax sont clairs comme le crystal.
en POST ce sera pareil aussi d'ailleurs.

2/ tu en as marre du full ajax bon et bien t au lieu de faire

select = xhr.responseText;
document.getElementById('td04').innerHTML = leselect;

tu fais ind = xhr.responseText;
document.getElementById('id_d_un_inpu_type_hidden).value = ind;

et paf tu as l'info dans un input hidden
et apres le bouton ajouter au panier fait une soumission du formualire associé a l'input.

dernier conseil si tu as le temps passe a un framework js.
Maintenant que je suis passé a jquery je ne voudrais pas revenir en arrière je te l'assure.

un simple exemple

js pur:

// Retourne la valeur du select selectId

function getSelectValue(selectId) {

	// On récupère l'élément HTML <select>

	var selectElmt = document.getElementById(selectId);

	// Correspond au tableau des balises <option> du select

	selectElmt.options;

	selectElmt.selectIndex;

	// Correspond à l'index du tableau options qui est actuellement sélectionné

	return selectElmt.options[selectElmt.selectedIndex].value;

}


jquery

$('#selectId').val();
Merci CPascal !
Merci pour le temps passé à m'expliquer !
Tout est maintenant est clair !
Tous mes soucis (même les futurs) sont maintenant résolus grâce à toi !
Encore merci !
Sujet clos
Aller à