[Javascript] keydown en tekst selecteren probleem

[Swerfer]

In onderstaand script heb ik een functie die met onkeydown="return KeepSourceDevice(this)" wordt aangeroepen voor het desbetreffende input textveld.

Het is de bedoeling dat de tekst in het veld die standaard is ingevuld kan worden aangevuld, zonder de vooraf ingevulde tekst te kunnen wissen. De vooraf ingevulde tekst heeft als formaat: xx.xx.xx.

Onderstaande functie werkt prima, behalve als je een deel van de tekst selecteerd en dan een toets intikt. Dan verschijnt alleen de ingedrukte toets in het veld en de rest verdwijnt. Als je dan nog een toets indrukt, dan verschijnt de vooraf ingevulde tekst weer aangevuld met de laatste toets die is ingedrukt.

Ik kan er maar niet achter komen waarom dit script zo reageerd, en dus weet ik ook geen workaround

JavaScript:

var Location = ""

function KeepSourceDevice(obj){
 if (Location==""){
  var dummy = 0
  dummy = obj.value.search(/\./) + 1
  Location=obj.value.substr(dummy)
  dummy = dummy + Location.search(/\./) + 1
  Location=obj.value.substr(dummy)
  dummy = dummy + Location.search(/\./) + 1
  Location=obj.value.substring(0,obj.value.length - (obj.value.length - dummy))
 }
 obj.value=Location + obj.value.substr(Location.length)
 var iCode = window.event.keyCode;
 if (obj.value == Location){
  if (iCode == 8){
   obj.value = obj.value.substring(0,obj.value.length)
   window.event.returnValue = false
  }
 }
}

[Swerfer]

* Kickje*

[Rekcor]

Waarom zet je constante tekst in het inputveld, als je die toch niet mag wijzigen? Waarom niet zoiets:

HTML:

<span id="vast">xx.xx.xx</span>
<input id="inpToevoeging" name="toevoeging" type="text">

[Swerfer]

Rekcor schreef op maandag 12 maart 2007 @ 10:26:
Waarom zet je constante tekst in het inputveld, als je die toch niet mag wijzigen? Waarom niet zoiets:

HTML:

<span id="vast">xx.xx.xx</span>
<input id="inpToevoeging" name="toevoeging" type="text">

Omdat in sommige gevallen de complete tekst wel veranderd mag worden. Op het moment dat de tekst niet veranderd mag worden, en alleen aangevuld, zou het voor de consistentie voor de gebruiker een nettere oplossing zijn om het overanderbare deel toch in het inputveld te zetten. Maar misschien is een borderloos inputveld mogelijk... Dat ik 2 inputvelden als het ware tegen elkaar aan plak...

Eens kijken of dat met CSS te realiseren is...

[Borizz]

Swerfer schreef op maandag 12 maart 2007 @ 18:42:
[...]

Omdat in sommige gevallen de complete tekst wel veranderd mag worden. Op het moment dat de tekst niet veranderd mag worden, en alleen aangevuld, zou het voor de consistentie voor de gebruiker een nettere oplossing zijn om het overanderbare deel toch in het inputveld te zetten. Maar misschien is een borderloos inputveld mogelijk... Dat ik 2 inputvelden als het ware tegen elkaar aan plak...

Eens kijken of dat met CSS te realiseren is...

Dat is zeker te regelen met CSS:

Cascading Stylesheet:

input#inpToevoeging { border-width: 0; }

[Swerfer]

Borizz schreef op maandag 12 maart 2007 @ 18:46:
[...]

Dat is zeker te regelen met CSS:

Cascading Stylesheet:

input#inpToevoeging { border-width: 0; }

Ik heb het met onderstaand CSS opgelost:

Cascading Stylesheet:

.FirstConnection1
    {
    border-left:solid 1px GrayText;
    border-top:solid 1px GrayText;
    border-bottom:solid 1px GrayText;
    border-right:none 0px;
    text-align:right;
    width:94px;
    }
.FirstConnection2
    {
    border-right:solid 1px GrayText;
    border-top:solid 1px GrayText;
    border-bottom:solid 1px GrayText;
    border-left:none 0px;
    width:52px;
    }   

En de Firstconnection1 heb ik disabled. Ik moet allen nog effe uitvinden dat ik de tekst in het disabled veld in dezelfde kleur krijg als in het enabled veld...

edit:

Ik heb ondertussen FirstConnection1 weer ge-enabled, en met een onclick event zorg ik dat FirstConnection2 dan focus krijgt...

[ Voor 8% gewijzigd door Swerfer op 12-03-2007 19:58 ]