Navigera till kontroll

Hej,

Jag har en sida med ett långt formulær. Før var gång man klickar på en kontroll så postar jag før att kunna uppdatera en annan kontroll. Nu vill jag att anvændaren skall hamna vid den kontroll han tryckte på.

Jag har kommit så långt att jag får tag på kontrollen. Jag trodde jag skulle komma undan med ett focus() på kontrollen men det gick inte. Fokus sætter den men sidan flyttas inte dit. Finns det någon bra løsning på detta? Kanske man kan få in ett anchor på något sætt och køra default.html#blabla

Tack på førhand

Richard

Hej!

Som du är inne på, är nog lösningen att placera ut ankare vid kontrollerna. Så om användaren klickar på en kontroll k, kanske du kan posta formuläret till default.html#k.

Red./ Exempel: spara koden nedan som riri.html

<script>

window.onload = function(){
  var elms = document.forms[0].elements;

  for (var i = 0; i < elms.length; ++i){
    elms[i].onclick = function(){
      this.form.action += '#' + this.name;
      this.form.submit();
    }
  }
}

</script>

<form method="post" action="riri.html">
<input type="submit">
<input name="a"><br>
<input name="b"><br>
<input name="c"><br>
<input name="d"><br>
<input name="e"><br>
<input name="f"><br>
<a name="g"></a>
<input name="g" value="g"><br>
<input name="h"><br>
<input name="i"><br>
<input name="j"><br>
<input name="k"><br>
<input name="l"><br>
<input name="m"><br>
<input name="n"><br>
<input name="o"><br>
<input name="p"><br>
<input name="q"><br>
<input name="r"><br>
<input name="s"><br>
<input name="t"><br>
<input name="u"><br>
<input name="v"><br>
<input name="x"><br>
<input name="y"><br>
<input name="z"><br>
<input name="aa"><br>
<input name="bb"><br>
<input name="cc"><br>
<input name="dd"><br>
<input name="ee"><br>
<input name="ff"><br>
<input name="gg"><br>
</form>

Mer dynamiskt ...

Hej,

Ok, men jag skulle behøva något mer dynamiskt. Så hær ser det ut:

function navigateToControl( controlId ){
	var objControl = document.getElementById( controlId );
	
	var objAnchor = document.createElement( "a" );
	STEG 1: Sætta ett namn på kontrollen
	STEG 2: Hær skulle jag vilja lægga till anchoren direkt efter 	kontroller, eller direkt føre
	STEG 3: Skriva till location med #och namnet man satt på a i steg 1	
}

Kan du hjælpa mig med att få till steg 2 hade jag varit vældigt tacksam! Resten borde ju vara ok att fixa men att lægga till en a direkt efter kontrollen var mindre lætt ... Det går væl?

Richard

Saken är ju den att, den HTML du lägger till i steg två ovan kommer att försvinna när formuläret postas. Således kommer ju inte sidan att scrollas till ankaret (eftersom det ej existerar).

Nja,

Jag har møjlighet att genom .net registrera ett skript som kørs då sidan kommer som postback - alltså efter postningen. Så det skall nog gå.

Ok. Testa följande i FF:

<script>

window.onload = function(){
  var elms = document.forms[0].elements;

  for (var i = 0; i < elms.length; ++i){
    elms[i].onclick = function(){
      var r = this.ownerDocument.createRange();

      r.setStartBefore(this);

      var u = new Date().valueOf(),
          a = r.createContextualFragment('<a href="u' + u + '"></a>');

      this.form.insertBefore(a, this);
      this.form.action += '#u' + u;
      this.form.submit();
    }
  }
}

</script>

<form method="post" action="riri.html">
<input type="submit">
<input name="a"><br>
<input name="b"><br>
<input name="c"><br>
<input name="d"><br>
<input name="e"><br>
<input name="f"><br>
<input name="g" value="g"><br>
<input name="h"><br>
<input name="i"><br>
<input name="j"><br>
<input name="k"><br>
<input name="l"><br>
<input name="m"><br>
<input name="n"><br>
<input name="o"><br>
<input name="p"><br>
<input name="q"><br>
<input name="r"><br>
<input name="s"><br>
<input name="t"><br>
<input name="u"><br>
<input name="v"><br>
<input name="x"><br>
<input name="y"><br>
<input name="z"><br>
<input name="aa"><br>
<input name="bb"><br>
<input name="cc"><br>
<input name="dd"><br>
<input name="ee"><br>
<input name="ff"><br>
<input name="gg"><br>
</form>