18041 sujets

Questions générales et questions de débutants

Iframe - jascript, chargement après submit.

Bonjour,

Je ne suis pas vraiment débutant en développement, mais je ne sais pas ou peut aller mon problème...alors je post ici.

Voila ! Je suis sur la création d'un site...assez basique. Sur celui-ci, en page d’accueil j'ai une "vidéo du moment". En dessous de cette vidéo j'ai un champs "Laissez un commentaire", et juste en dessous les commentaires. Lorsque que qqun clic sur "Laisser un commentaire", je fais appel a une fonction javaS. Voici son code :


 function commentaires()
{
	
	document.getElementById("commentaireszone").innerHTML = "<iframe src='test.php' SCROLLING='NO' NORESIZE width='465px' height='277px' style='border:0;  border-radius: 7px; -moz-border-radius: 7px; -border-top-left-radius: 7px;'>"

}


Je charge donc dans une iframe une page qui s'appellle test.php (Je sais que bcp sont anti frame...alors bon...).

Le problème est que lorsque je clique sur Publier, après mes différents input...et bien je voudrais qu'il recharge la page d'accueil...index.php...Mais il la charge dans l'iframe....
Que faire...??

Dites moi si ça manque de précision...et si vous pouvez m'aider ça serait top méga cool !! Smiley ravi

Merci d'avance !
Salut,

A priori, tu ne peux pas recharger la page "parente" depuis l'iframe. C'est une page complètement différente et séparée de la page qui l'appelle, et elle n'est même pas "consciente" de la présence d'une page parente.

Par contre, tu pourrais faire la même chose assez facilement sans iframe, en postant ton formulaire via javascript...
C'est vrai, tu as raison, c'est une sacrée idée.. le pb qui se pose c'est que je ne me vois pas mettre en InnerHTML tout ce code : 


<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-15" />

<style type="text/css">

div,td,th {
	font-family: "antipasto",Verdana, Geneva, sans-serif;
	font-size: 17px;
	color: #FFF;
}

a:link {
	color: #FFF;
	font-weight: bold;
	text-decoration: none;
}
a:visited {
	text-decoration: none;
	color:#FFF;
	text-shadow: white 1.6px -1.6px 0.1em;
	
}
a:hover {
	text-decoration: none;
	text-shadow:0px 0px 2px #FFF;
}
a:active {
	text-decoration: none;
}
@font-face 
{
	font-family: "antipasto";
	src: url('Antipasto.ttf');
}
@font-face
{
  font-family: 'antipasto';
  src: url('Antipasto.eot');
} 
@font-face
{
  font-family: 'antipasto';
  src: url('Antipasto.otf') format("opentype");
}

textarea 
{
resize:none;
}

</style>
<script language="javascript">

// JavaScript Document

function btnimg(btn,typ1,typ2)
{
var ns=btn.src;
var ns2;
ns2=ns.replace(typ1,typ2);
btn.src=ns2;

}

function publier()
{
	window.location.href="index.php";
}
</script>
</head>

<body style="margin-top:0; margin-left:0; margin-right:0; margin-bottom:0;" >
	<div style="margin: 0; border: 0; background-color: #142b4b" >
		<FORM name=ajoutcom action="" method="post">
		<table style='' width='440px' height='30px' >
			<tr>
				<td>
				Tous les champs marqués * sont obligatoires
				</td>
			
			</tr>
		</table>	
		<table  width='440px' style="border: 0;">
			<tr height='30px'>
				<td width='35%'>
				Pseudo *  
				</td>
				<td >
				Adresse Mail * </span><span style='font-size: 14px;'> (ne sera pas affichée)</span>
				</td>
			</tr>
			<tr height='30px'>
				<td width='35%'>
					<input  style='background-color:#FFFFFF' type='text'  name='pseudo' height='80' size='19px' maxlength='40'   value=''>
				</td>
				<td >
					<input  style='background-color:#FFFFFF' type='text'  name='mail' height='80' size='38px' maxlength='100'   value=''>
				</td>
			</tr>
		</table>
		<table  width='440px' height='100px'>
			<tr height='30px'>
				<td  >
				Votre Commentaire * 
				</td>
			</tr>
			<tr  >
				<td >
					<textarea cols='50' rows='4' NORESIZE > </textarea>
				</td>
			</tr>
		</table >
		</FORM>
		<table style='border: 0;' width='440px' height='50px'>
			<tr>
				<td align="right" style="border:0;">
					<a href="javascript:publier()"><img style="padding-top: 2px; padding-bottom:0; align:right; border:0;" width="30%"  src="images/publier_0.png" onmouseover="javascript:btnimg(this,'_0','_1')" onmouseout="javascript:btnimg(this,'_1','_0')" ></a>
				</td>
			</tr>
		</table>
	</div>
</body>


Alors c'est ça qui me pose pb....mais dit moi si tu as des idées...de comment faire !
merci Smiley murf
Bonjour,

En debutant j'aurais mis ce formulaire directement dans la page en display:none;

Ensuite avec un bout de js sur un lien(genre "index.php?ajoutcom" 
function showhide(formulaire) {
	var el = document.getElementsByName(formulaire);
	el.style.display = (el.style.display != 'none' ? 'none' : 'block' );
}
.
[code]<a href="index.php?ajoutcom" onclick="showhide('ajoutcom');return false;">ajouter commentaire</a>[code]

Il y aussi des possibilité en AJAX , mais il ne faut alors chargé que le formulaire et pas une page complete.

Dans les 2 cas (et ton iframe), cela repose sur javascript, le principe d'utiliser un lien pour declancher la commande javascript, peut permettre de recharger la page si js est désactivé, coté serveur, il reste a testé si il y a une requete et affiché ou non ce formulaire.

C'est en grosse ligne et pas une solution toute crue Smiley smile

GC
La on tiens quelque chose !! vraiment !! ^^
Je vais regarder ça cette aprem....merci bcp en tout cas ! Réponse rapide, et efficace !

je reviens vers vous si besoin,....ou ....le mieux....quand c'est fait !!! ^^

Merci ! Smiley langue
Bon ! j'ai réussi avec du js qui passe un hidden en block et vice et versa !! donc merci bcp !!! c'est top !
Sujet clos
Aller à