как се права добави поле

beta16

Registered
как да направа като се натисне едно там тексче да прави поле за уплоад да нали само че нз как ако са с едно име дали ще ми деиства кода
 
Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
var arrInput = new Array(0);
  var arrInputValue = new Array(0);

function addInput() {
  arrInput.push(arrInput.length);
  arrInputValue.push("");
  display();
}

function display() {
  document.getElementById('parah').innerHTML="";
  for (intI=0;intI<arrInput.length;intI++) {
    document.getElementById('parah').innerHTML+=createInput(arrInput[intI], arrInputValue[intI]);
  }
}

function saveValue(intId,strValue) {
  arrInputValue[intId]=strValue;
}  

function createInput(id,value) {
  return "<input type='file' id='test "+ id +"' onChange='javascript:saveValue("+ id +",this.value)' value='"+ value +"'><br>";
}

function deleteInput() {
  if (arrInput.length > 0) { 
     arrInput.pop(); 
     arrInputValue.pop();
  }
  display(); 
}

</script>
</head>

<body>
<p id="parah">Добавете автомартично полета за избор</p>

<a href="javascript:addInput()">Добави още полета)</a><br>
<a href="javascript:deleteInput()">Премахни полета</a>
</body>
</html>
 
emagi не става може ли по скаип да ми помогнеш пак после ще пуснеш тук решението молете
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Добавяне на input поле към форма</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<script type="text/javascript" src="jquery-1.3.2.min.js">
</script>
<script type="text/javascript">
$(function() {
var i = $('input.attached').size() + 1;

$('#add').click(function() {
$('<input type="file" name="fileatt"' + i + '" class="attached" />').appendTo('form');
i++;
});

$('#remove').click(function() {
if (i<3) {
} else {
$('input.attached:last').remove();
i--;
}
});
});
</script>
</head>
<body>
<p>
<a href="#" id="add">Добави</a> | <a href="#" id="remove">Изтрии</a>
<form>
<input type="file" name="fileatt" class="attached" />
</form>
</p>
</body>
</html>

С JQuery става много лесно. Само трябва да си свалиш последната версия на файла от www.jquery.com и да сложиш пътя до него вместо червеното в кода.
Добавил съм проверка проверка, за да не стават полетата 0. Също може да се направи и при добавянето на полета да не са повече от 10 примерно.

ДЕМО!
 
Ето още един вариант с жабакуери ;) при който елементите се клонират като масив f[] : по-лесно за писане и Server Side обработка
demo
Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Add files</title>
<script type="text/javascript" language="javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript" language="javascript">
//<![CDATA[ 
$(document).ready(function(){
$('a[name="addelements"]').click(function(){
$('form[name="f1"] div:eq(0)').clone().appendTo('form[name="f1"]');
});
$('a[name="removeelements"]').click(function(){
if ($('form[name="f1"] div').size()>1) $('form[name="f1"] div:last').remove();
});
});
//]]>
</script>
</head>
<body>
<a href="#" name="addelements">Добави</a>   <a href="#" name="removeelements">Премахни</a>
<center>
<form name="f1" action="" method="post" enctype="multipart/form-data">
<div><input type="file" name="f[]" /><br /></div>
</form>
</center>
</body>
</html>
Весели празници :)
 

Горе