CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg

Log ind eller opret profil

Du kan også logge ind via nedenstående tjenester

monarq Praktikant

12. januar 2013 - 14:40 Der er 7 kommentarer og
1 løsning

Dynamisk indsættelse af tekstfelt

Jeg har pt. et script hvor man kan indsætte nye teksfelter i en formular, men der er et problem: Tilføjer man fx. tre nye felter og udfylder dem bliver de slettet hvis man tilføjer et nyt felt herefter. Er der en måde at gøre dette på så den tilføjer et tekstfelt uden at slette det allerede indtastede data?

Herunder ses hvad jeg har pt. Bemærk jeg har strippet det for formatering, men kan køre i en browser.

<script language="javascript">

</script>

<input type="hidden" name="table[]" value="0" />
<div id="dvFile">
<input type="text" size="70" maxlength="500" name="" value="" />
</div>

<a href="java script:_add_more();" title="Add more">+ Insert new</a>

Synes godt om

olsensweb.dk Ekspert

12. januar 2013 - 14:53 #1

dit problem ligger i innerHTML, overskriver hele din div, hvilke er meningen med innerHTML
i denne linje document.getElementById("dvFile").innerHTML += txt;

nb language attributten har været forældet meget længe

Synes godt om

monarq Praktikant

12. januar 2013 - 14:58 #2

Tak for kommentaren. Er der så et alternativ, der løser mit problem?

mvh
Rasmus

Synes godt om

olsensweb.dk Ekspert

12. januar 2013 - 15:59 #3

google js add input field dynamic
en let omskrivning af
http://viralpatel.net/blogs/dynamic-add-textbox-input-button-radio-element-html-javascript/

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
    <title></title>
    <style type="text/css">
    </style>
<script type="text/javascript">
function add(){
    //Create an input type dynamically.
    var element = document.createElement("input");
    var br = document.createElement("br");
     //Assign different attributes to the element.
    element.setAttribute("type", "text");
    element.setAttribute("value", "indtast noget"); // bør nok være blank
    element.setAttribute("name", "table[]");
    var foo = document.getElementById("fooBar");
    //Append the element in page (in span).
    foo.appendChild(br);
    foo.appendChild(element);    
}
</script>
</head>
<body>
<input type="button" value="Add" onclick="add()"/>
<span id="fooBar">&nbsp;</span>
<!-- laver den første input box -->
<script type="text/javascript">
add();
</script>
</body>
</html>

Synes godt om

olebole Juniormester

12. januar 2013 - 17:53 #4

<ole>

For fuldstændighedens skyld, skal det lige siges, at det ikke lader sig gøre med standard DOM-metoder i Explorer 7 eller før. Først i version 8 kan det lade sig gøre at sætte en name attribut på feltet med DOM.

De gamle IE'ere skal have det på denne måde:

function add(){
//Create an input type dynamically.
var element = document.createElement('<input type="text" name="table[]" value="indtast noget">');
var br = document.createElement("br");
var foo = document.getElementById("fooBar");
//Append the element in page (in span).
foo.appendChild(br);
foo.appendChild(element);
}

Grimt, men sandt! =)

/mvh
</bole>

Synes godt om

olebole Juniormester

12. januar 2013 - 17:56 #5

Microsoft's egen dokumentation af emnet

Synes godt om

monarq Praktikant

12. januar 2013 - 21:15 #6

ronols -> Lige hvad jeg havde brug for. Smid et svar så du får point.

olebole -> Tak for dit input - det er værd at overveje.

Synes godt om

olsensweb.dk Ekspert

13. januar 2013 - 00:27 #7

får du her

Synes godt om

olsensweb.dk Ekspert

13. januar 2013 - 10:52 #8

ville lige lave testen så det også virker til det gamle L... der er tråds alt 14,8% der stadig bruger ie8 jf http://www.fdim.dk/statistik/teknik/browserbarometer

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
    <title></title>
    <style type="text/css">
    </style>
<script type="text/javascript">
function add_IE7_8(){
    //Create an input type dynamically.
    var element = document.createElement('<input type="text" name="table[]" value="indtast noget">');
    var br = document.createElement("br");
    var foo = document.getElementById("fooBar");
    //Append the element in page (in span).
    foo.appendChild(element);
    foo.appendChild(br);
}

// FF, IE9 mf.
function add_other(){
    //Create an input type dynamically.
    var element = document.createElement("input");
    var br = document.createElement("br");
     //Assign different attributes to the element.
    element.setAttribute("type", "text");
    element.setAttribute("value", ""); // bør nok være blank
    element.setAttribute("name", "table[]");    
    element.setAttribute("size", "70");
    element.setAttribute("maxlength", "500");    
    var foo = document.getElementById("fooBar");
    //Append the element in page (in span).
    foo.appendChild(element);
    foo.appendChild(br);        
}

var specielbrowser=0;
function add(){
    (specielbrowser==0)? add_other() : add_IE7_8();
}

</script>
</head>
<body>
<span id="fooBar"></span>
<input type="button" value="Add" onclick="add()"/>
<!-- tester for browser og laver den første input box -->
<script type="text/javascript">
if (/MSIE (\d+\.\d+);/.test(navigator.userAgent)){ //test for MSIE x.x;
    var ieversion=new Number(RegExp.$1) // capture x.x portion and store as a number
    if( (ieversion == 7) || (ieversion == 8) )specielbrowser = 1; 
}
add();
</script>
</body>
</html>

Synes godt om

Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Følg dette spørgsmål

Opret Preview

Flere spørgsmål fra JavaScript kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Beregning af sum via PHP og SQL Af dane022 i JavaScript	3	10/02/202421:38	12/02/202409:41
Kode der tjekker telefonnummer i formular Af Asky i JavaScript	2	27/12/202321:42	28/12/202314:41
Nogle af mine formularer i PHP er plaget af spam Af Asky i JavaScript	12	19/12/202313:31	10/01/202411:04
Vis data fra en anden fil i en div Af EveryMA i JavaScript	2	19/10/202307:02	20/10/202307:02
js til asp backend Af keepy i JavaScript	1	11/10/202310:28	11/10/202313:46

Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS