Discussion :

[humer2000]

Bonsoir

je galère avec mon code.
J'ai un formulaire d'une cinquantaine de lignes et chaque champ est mis à jour par juste passage de la souris
Mon problème est quand quand je suis à partir de la 25ième ligne, la mise à jour s'effectue mais je retourne au début de la page
Je souhaite mettre un code javascript pour rester sur le même champ quand je le modifie

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

<form id="Form_ID" name="Form_ID" method="POST" action="Shopa_Frm_init.asp?which=182&idfield=inspectionId&table=TB_INSPECTION&database=">

exemple d'une ligne

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
 
<tr bgcolor="white">
	<td class="ContentCustomer" width="100%"><span id="JumpHere_8861"></span>
	<input class="Custtxtfield" type="text" name="inspectiondetailLibelle_8861" size="50" value="Mécanosouduresd" onblur="__EVENTSPARAM('events_updateinspectionline','8861');">&nbsp;
	</td>
	<td class="tdfp">
	<select class="class="custselectfield"" name="inspectiondetailAvec_8861" size="1" onchange="__EVENTSPARAM('events_updateinspectionline','8861');">
	<option value=""></option>
	<option value="Oui" Selected>Oui</option>
	 <option value="Non" >Non</option>
	</select>
	</td>
 
						<td class="tdfp">
						<select class="custselectfield" name="inspectiondetailVerification_8861" size="1" onchange="__EVENTSPARAM('events_updateinspectionline','8861');">
							<option value=""></option>
							<option value="V." 	Selected			>V.</option>
							<option value="V.F" 		>V.F</option>
							<option value="E." 				>E.</option>
							<option value="Sans Objet" 	>Sans Objet</option>
						</select>
						</td>
 
						<td class="tdfp">
						<select class="custselectfield" name="inspectiondetailEtat_8861" size="1" onchange="__EVENTSPARAM('events_updateinspectionline','8861');">
							<option value=""></option>
							<option value="Bon Etat" 		Selected		>Bon Etat</option>
							<option value="Usure Faible" 		>Usure Faible</option>
							<option value="Usure Normale" 		>Usure Normale</option>
							<option value="Usure Avancée" 		>Usure Avancée</option>
							<option value="Mauvais Etat" 		>Mauvais Etat</option>
							<option value="Sans Objet" 				>Sans Objet</option>
						</select>
						</td>
 
						<td class="tdfp">
							<textarea name="inspectionObservation_8861" rows="2" cols="20" onblur="__EVENTSPARAM('events_updateinspectionline','8861');">sdsdqs dqsd
qdqsd qsdd</textarea>
						</td>
 
 
						<td class="tdfp" align="center"><input type="checkbox" class="Custsubmitbtn" name="contrevisite_8861" Value="Oui"  ></td>
						<td class="tdfp"><input style="text-align:center;" type="submit" class="submitbtn" value="Supprimer" onclick="__EVENTSPARAM('events_deleteinspectionline','8861');"></td>
					</tr>

et enfin

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
<input type="hidden" name="IsPageLoaded" value="1" />
<input type="hidden" id="Events_Name" name="Events_Name" value="" />
<input type="hidden" id="Param_Events" name="Param_Events" value="" />
<!--Customs States-->
</form>
 
 
 
<script language="javascript">    
    var $ = function (_Id){return document.getElementById(_Id);}
    var theForm = document.forms['Form_ID'];    
    if (!theForm) {theForm = document.Form_ID;}             
    var __SETVALUE = function(){for (var i=0; i<(arguments.length); i=i+2){$(arguments[i]).value=arguments[i+1];}}    
    var __EVENTS = function(_events_name){$('Events_Name').value=_events_name;theForm.submit();}   
    var __CONFIRM = function(_text){return confirm(_text);} 
    var __DOPOSTBACK = function(){for (var i=0; i<(arguments.length); i=i+2){$(arguments[i]).value=arguments[i+1];}theForm.submit();}
	var __TOGGLESHOWHIDE = function(_obj){$(_obj).style.display=='none'?$(_obj).style.display='block':$(_obj).style.display='none';}
	var __TOGGLEBETWEEN = function(_obj1,_obj2){$(_obj1).style.display='block';$(_obj2).style.display='none';}
	var __TOGGLEBETWEEN3 = function(_obj1,_obj2,_obj3){$(_obj1).style.display='block';$(_obj2).style.display='none';$(_obj3).style.display='none';}
	var __TOGGLEBETWEEN4 = function(_obj1,_obj2,_obj3,_obj4){$(_obj1).style.display='block';$(_obj2).style.display='none';$(_obj3).style.display='none';$(_obj4).style.display='none';}
	var __EVENTSPARAM = function(_events_name,_events_param){$('Events_Name').value=_events_name;$('Param_Events').value=_events_param;theForm.submit();}
	var __HIDDENLISTOJECT = function(){
	for (var i=1; i<(arguments.length); i=i+2){$(arguments[i]).checked='';$(arguments[i+1]).style.display='none';}
	for (var i=1; i<(arguments.length); i=i+2){$(arguments[i]).checked='';$(arguments[i]).disabled='disabled';}
 
		if($(arguments[0]).style.display!='none')
		{
			$(arguments[1]).disabled='';
		}
 
	}
 
 
	function textCounter(field,cntfield,maxlimit) {
		if (field.value.length > maxlimit) // if too long...trim it!
		field.value = field.value.substring(0, maxlimit);
		// otherwise, update 'characters left' counter
		else
		cntfield.value = maxlimit - field.value.length;
		}
 
	function updateLink(prodid) {
		document.getElementById("dispLink").href = "Shopa_addproduct_Init.asp?which="+prodid+"&idfield=catalogid&table=PRODUCTS&database=";
		}
 
	function updatecLink(contactid) {
		document.getElementById("dispcLink").href = "Shopa_displaycustomer_Init.asp?which="+contactid+"&idfield=contactid&table=CUSTOMERS&database=";
	  	}
 
	function updatedLink(docid) {
		document.getElementById("dispdLink").href = "Shopa_cms_Init.asp?frm_CurrentCatId=1&frm_CurrentDocId="+docid+"&Modal_Document=1&frm_doc_LangId=1";
	  	}
 
	function updatecatLink(categoryid) {
		document.getElementById("dispcatLink").href = "Shopa_frm_Init.asp?IsPageLoaded=1&which="+categoryid+"&idfield=categoryid&table=categories&database=";
	  	}
</script>
 
<script id="clientEventHandlersJS" language="javascript">
	<!--
	function MakeColor(ThisColor) {
		document.bgColor = ThisColor;
		}
	//-->
</script>
 
<script language="JavaScript">
	function SelectLink(id) 
		{
		window.opener.document.editform.emailfilename.value=id;
		self.close();
		}
</script>

Alors qu'est ce que je dois ajouter dans mon code JS ou html pour que je reste sur le même champ quand je le mets à jour

Merci
mika

[Invité]

Bonjour,

• HTMLElement.focus()

Cela dit.....

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

	var __EVENTSPARAM = function(...){...;theForm.submit();}

• theForm.submit() : tu soumets le formulaire de façon "classique" (action de la balise <form>)
• -> il y a donc rechargement de la page (ce qui explique le retour "en début/haut" de page)

Pour un traitement SANS rechargement de la page, il faut utiliser Ajax :

• on ne soumet pas le formulaire (de façon "classique")
• mais on envoie les données, via un script Ajax, à un fichier externe (PHP), qui va faire le traitement et renvoyer le résultat au script JS