i have ajax script for select some infomrations.
If the user selects a choice, a popup requesting permission for the user to overwrite the address component fields. The message should appear if the fields were empty.
I want to know how to do this confirmation popup?
HTML:
<html>
[..]
<div style="width:54.5%;float:right;">
<h2 class="basic"><fmt:message key="fiscalite.administration.listeRejets.label.proprietaire"/></h2>
<table border="1">
<tr style="height:20px;width:250px;border:0">
<td class="labelChamp" style="border:0">
<fmt:message key="fiscalite.administration.listeRejets.label.nomProprietaire"/>
<span class="champsObligatoire">*</span>
</td>
<td style="border:0">
<html:text property="rejet.immeuble.SCIProprietaire" size="40" maxlength="40" styleId="nomProprietaire" styleClass="champsBleu02" onkeyup="couleur(this)"/>
</td>
</tr>
<tr style="height:20px;border:0">
<td class="labelChamp" style="border:0">
<fmt:message key="fiscalite.administration.listeRejets.label.SIRENProprietaire"/>
<span class="champsObligatoire">*</span>
</td>
<td style="border:0">
<html:text property="rejet.SIRENProprietaire" styleId="siren" size="9" maxlength="9" styleClass="champsBleu03" tabindex="8" onkeyup="initFlagSelectionSiren();couleur(this);" />
<div id="autoCompletionListeProprietaireImmeuble" class="autocomplete" style="display:none;"></div>
</td>
</tr>
<tr style="border:0">
<td style="border:0"></td>
<td style="border:0">
<div style="display:none;" id="imageAttente" align="center" class="autocomplete"><img src="media/ajax/indicator_waitanim.gif" width="65"/></div>
</td>
</tr>
<tr style="height:20px;border:0">
<td class="labelChamp" style="border:0">
<fmt:message key="fiscalite.administration.listeRejets.label.numEtNomVoie"/>
<span class="champsObligatoire">*</span>
</td>
<td style="border:0">
<html:text property="rejet.voieProprietaire" styleId="adresse" size="32" maxlength="32" styleClass="champsBleu02" onkeyup="couleur(this)"/>
</td>
</tr>
<tr style="height:20px;border:0">
<td class="labelChamp" style="border:0">
<fmt:message key="fiscalite.administration.listeRejets.label.cPostalEtVille"/>
<span class="champsObligatoire">*</span>
</td>
<td style="border:0">
<html:text property="rejet.communeProprietaire" styleId="ville" size="32" maxlength="32" styleClass="champsBleu02" onkeyup="couleur(this)"/>
</td>
</tr>
</table>
</div>
</html>
My script
<script type="text/javascript">
var sirenSelectionne = false;
var objProprietaireAutoComp = null;
if(document.getElementById('siren') != null)
{
function majChampsSiren(el)
{
if(el.getElementsByTagName('span')[0] == null){
var siren = document.getElementById('siren');
if(el.getElementsByTagName('div')[0].id != "erreurSiren")
{
siren.value = el.getElementsByTagName('div')[0].firstChild.nodeValue;
var nomProprietaire = document.getElementById('nomProprietaire');
nomProprietaire.value = el.getElementsByTagName('div')[1].firstChild.nodeValue;
var adresse = document.getElementById('adresse');
adresse.value = el.getElementsByTagName('div')[2].firstChild.nodeValue;
var ville = document.getElementById('ville');
ville.value = el.getElementsByTagName('div')[3].firstChild.nodeValue;
sirenSelectionne = true;
}
else
{
sirenSelectionne = false;
fermerPopupProprietaire();
}
}
}
objProprietaireAutoComp = new Ajax.Autocompleter ('siren',
{
method: 'post',
paramName: 'autoCompletion',
indicator : 'imageAttente',
minChars: 4,
updateElement: majChampsSiren
});
}
–RESOLVED– THE FINAL RESULT
<script type="text/javascript">
//////////////////////////////////////
// Gestion de l'auto-complétion avec traitement en retour sur siren
var sirenSelectionne = false;
var objProprietaireAutoComp = null;
if(document.getElementById('siren') != null) {
function majChampsSiren(el) {
var siren = document.getElementById('siren');
var nomProprietaire = document.getElementById('nomProprietaire');
var adresse = document.getElementById('adresse');
var ville = document.getElementById('ville');
var message = 'Les champs:\n-Nom du propriétaire\n-Numéro et nom de voie\n-Code postal et Commune\nvont être remplacé par ceux du propriétaire sélectionné.\nConfirmez vous ce remplacemnt ?';
if(nomProprietaire.value !="" || adresse.value !="" || ville.value != "")
{
top.Dialog.confirm("<p class='corps12 coulBleu02'>" + message + "</p><br/>", {
id:'idPopupSIREN',
className: "bloquant",
width:200,
height:150,
buttonClass: "boutonbleu",
closable: true,
maximizable: false,
minimizable: false,
showEffectOptions: {duration:0.2},
hideEffectOptions: {duration:0.2},
destroyOnClose: true,
cancel:function(win) {},
ok:function(win)
{
if(el.getElementsByTagName('span')[0] == null)
{
if(el.getElementsByTagName('div')[0].id != "erreurSiren")
{
siren.value = el.getElementsByTagName('div')[0].firstChild.nodeValue;
nomProprietaire.value = el.getElementsByTagName('div')[1].firstChild.nodeValue;
adresse.value = el.getElementsByTagName('div')[2].firstChild.nodeValue;
ville.value = el.getElementsByTagName('div')[3].firstChild.nodeValue;
sirenSelectionne = true;
top.Windows.close('idPopupSIREN');
}
else
{
sirenSelectionne = false;
fermerPopupProprietaire();
}
}
},
zindex: 2000
});
}
else
{
if(el.getElementsByTagName('span')[0] == null)
{
if(el.getElementsByTagName('div')[0].id != "erreurSiren")
{
siren.value = el.getElementsByTagName('div')[0].firstChild.nodeValue;
nomProprietaire.value = el.getElementsByTagName('div')[1].firstChild.nodeValue;
adresse.value = el.getElementsByTagName('div')[2].firstChild.nodeValue;
ville.value = el.getElementsByTagName('div')[3].firstChild.nodeValue;
sirenSelectionne = true;
}
else
{
sirenSelectionne = false;
fermerPopupProprietaire();
}
}
}
}
objProprietaireAutoComp = new Ajax.Autocompleter ('siren',
'autoCompletionListeProprietaireImmeuble',
'ajax/ajaxAutocompleterProprietaireImmeuble.do',
{
method: 'post',
paramName: 'autoCompletion',
indicator : 'imageAttente',
minChars: 4,
updateElement: majChampsSiren
});
}
</script>
Use
confirm()function.