Click to See Complete Forum and Search --> : ??...How to create hidden variables dynamically?


SAFX
07-08-2003, 08:08 PM
I'm building a web-based system that allows the user to, among other things, create notes from a web page, but the number of notes is unlimited and the user can specify any number of notes before the information is submitted from the form. There is no need to display the notes on the screen after the user enters each note, otherwise I would have used a multiple select list to save the text for each note, but I need to save it as hidden variables, but I'm not sure how to create them dynamically. I know how to create a hidden variable, no problem, but I need to create them for each note as the user enters them into the form.

Thanks

SAF

Khalid Ali
07-08-2003, 08:20 PM
I am sure you are talking about hidden fields..

here is a typical one

<input type="hidden" name="soemname} value="whatever"/>

SAFX
07-08-2003, 08:23 PM
C'mon man :) give me some credit! Yeah, I know how to create a hidden field, but I need to create them dynamically, and I don't want to hard-code the number of hidden fields on the HTML page.

SAFX

Khalid Ali
07-08-2003, 08:43 PM
let me guess...:D (again)
You want to create an hidden input field when a user creates a note..???

SAFX
07-08-2003, 08:46 PM
yes!

Khalid Ali
07-08-2003, 08:48 PM
hoq about explaining and giving a snippet of code that you will or are using to create a note by the user...Then I'll help you do the rest of it

SAFX
07-08-2003, 08:58 PM
<form name="notes">

<input type="text" name="note">
<input type="button" value="Add" onclick="javascript:addNote(document.notes.note.value);">

</form>

<script language="javascript">

var noteCount = 1;

function addNote( noteText){
//at this point, I need to create a hidden
//field and add it to the form above,
//something like this would be nice...
document.notes.addField("note" + noteCount++, noteText);

}

</script>

Khalid Ali
07-08-2003, 09:08 PM
this will do ...


<script type="text/javascript">
<!--
var noteCount = 1;

function addNote( noteText){
var field = document.createElement("input");
field.setAttribute("type","hidden");
field.setAttribute("value",noteText);
field.setAttribute("name","note_"+noteCount++);

//add new element to the existing form
document.getElementById("notes").appendChild(field);
}
function Process(){
var frm = document.getElementById("notes");
var len = frm.length;
for(x=0;x<len;x++){
if(frm[x].type=="hidden"){
alert("name = "+frm[x].name+"\n"+frm[x].value)
}
}
}
//-->
</script>
</head>

<body class="body">
<form name="notes" id="notes">
<input type="text" name="note">
<input type="button" value="Add" onclick="addNote(document.notes.note.value);"><br/>
</form>

SAFX
07-08-2003, 09:11 PM
You're the best, Khalid!

Thanks again,


SAFX

Khalid Ali
07-08-2003, 09:13 PM
:D
You are welcome ...

SAFX
07-08-2003, 10:02 PM
Khalid,

Is it possible to remove an element by id? For example, if I create a hidden field using....



var field = document.createElement("input");
field.setAttribute("id","1001");



...can I remove the element by it's id using document.removeElementById( "1001");

Thanks again,

SAFX

Khalid Ali
07-08-2003, 10:04 PM
Originally posted by SAFX
Khalid,

...can I remove the element by it's id using document.removeElementById( "1001");

Thanks again,

SAFX
No however there is another DOM method you can use

parentElement.removeChild(elementToRemove)

SAFX
07-09-2003, 08:05 AM
Originally posted by Khalid Ali
No however there is another DOM method you can use

parentElement.removeChild(elementToRemove)

Ok, so I can remove the element by reference, like this...



parentElement.removeChild( document.notes.getElementById("1001"));



...I think that's what you meant, right? :)

SAFX

Khalid Ali
07-09-2003, 08:35 AM
precisely...:D