Jag undrar om det går att få aktuell div:s inputvärden överförda till en och samma form.
Alltså när div1 är i focus så skall aktuella värden finnas i formen.
Se exempel
Eller är det bättre att göra en form för varje div?
det kan kanske bli 10 eller 15 divar på samma sida.
"Dynamisk form"
6 svar · 394 visningar · startad av Jesper T
fattar inte riktigt?
har du en textruta kan du ju lägga text från vilken div som helst i denna. Men förstår inte riktigt när du vill detta ska hända.
När du klickar på en div?
Ja, när jag klickar i en "div" så skall de aktuella värdena i den diven(inputfälten), lägga sig i fälten i den sista rutan(diven). Comprende?
Idéer eller förlag?
Någonting sådant här kanske:
...
<head>
<style type="text/css">
<!--
.row {
width : 500px;
padding : 5px;
border : 1px solid #f00;
margin-bottom : 20px;
}
-->
</style>
<script type="text/javascript">
<!--
var Form = {
rows : [],
currentInputs : [],
actual : null,
init : function(inputs, actual){
var rows = document.getElementById(inputs).getElementsByTagName("div");
for(var i=0; i<rows.length; i++){
this.rows[i] = rows[i];
this.rows[i].onclick = new Function("Form.displayValues(this)");
}
this.actual = document.getElementById(actual);
},
displayValues : function(o){
this.initCurrentInputs(o);
var str = "";
for(var i=0; i<this.currentInputs.length; i++)
str += "<input type=\""+ this.currentInputs[i].type +"\" name=\""+ this.currentInputs[i].name +"\" value=\""+ this.currentInputs[i].value +"\">";
this.actual.innerHTML = str;
},
initCurrentInputs : function(obj){
var inputs = obj.getElementsByTagName("input");
for(var i=0; i<inputs.length; i++)
this.currentInputs[i] = inputs[i];
}
};
window.onload = function(){
Form.init("inputs", "actual");
};
//-->
</script>
</head>
<body>
<form name="inputs" id="inputs">
<div class="row">
<input type="text" name="textfield1"><input type="text" name="textfield2"><input type="text" name="textfield3"> 1
</div>
<div class="row">
<input type="text" name="textfield1"><input type="text" name="textfield2"><input type="text" name="textfield3"> 2
</div>
<div class="row">
<input type="text" name="textfield1"><input type="text" name="textfield2"><input type="text" name="textfield3"> 3
</div>
<div class="row">
<input type="text" name="textfield1"><input type="text" name="textfield2"><input type="text" name="textfield3"> 4
</div>
<div class="row">
<input type="text" name="textfield1"><input type="text" name="textfield2"><input type="text" name="textfield3"> 5
</div>
<div class="row">
<input type="text" name="textfield1"><input type="text" name="textfield2"><input type="text" name="textfield3"> 6
</div>
<div class="row">
<input type="text" name="textfield1"><input type="text" name="textfield2"><input type="text" name="textfield3"> 7
</div>
<div class="row">
<input type="text" name="textfield1"><input type="text" name="textfield2"><input type="text" name="textfield3"> 8
</div>
</form>
<div class="row" id="actual"></div>
</body>
...
:)
Detta är ju f-n helt underbart. Men nu är det ju så att det inte skall vara "text" i den sista diven utan förstås en vanlig form med inputsfält. Hur löses det?
displayValues : function(o){
this.initCurrentInputs(o);
var str = "<form>";
for(var i=0; i<this.currentInputs.length; i++)
str += "<input type=\""+ this.currentInputs[i].type +"\" name=\""+ this.currentInputs[i].name +"\" value=\""+ this.currentInputs[i].value +"\">";
str+="</form>"
this.actual.innerHTML = str;
},
eller?