سلام به دوستان
سوال:
يه دونه فرم با يك كليد براي انتخاب فايل و يك كليد ديگر براي اضافه كردن دلخواه انتخاب فايل ديگر ،،، داريم با اين كد:
<form id="upload_form" name="form1" method="post"
enctype="multipart/form-data">
<input name="brows[]" class="intext submitbtn" type="file" />
<input name="add" type="button" id="add"
value="Submit" onclick="javascript:" />
</form>
حالا ميخوام وقتي روي كليد زدم يه دونه input درج بشه با نام brows[] . با php اين كار رو كردم ولي فقط يه بار درج ميكنه و ديگه درج نميكنه.
اگه با php بشه كه خيلي خوبه اگه هم نشد با java كمكم كنيد.
منظور رو رسوندم؟
پيشاپيش ممنون
[آره]
دوست من؛ شیوهی پرسش، لحن کلام و نگارش متکلم، فاکتورهای ترغیب کنندهی ارسال پاسخ توسط مخاطب هستند. متاسفانه شما منظورتون رو اونطور که باید نرسوندین و توضیحات شما کافی نیست. البته جوابهای طولانی هم دلیلی برای بیمیلی به پاسخ دادن هستش که بهتره دوستان سوالهاشون رو بخش بخش مطرح کنند.
اما اگه منظورتون اینه که با کلیک بر روی یک متن؛ یک ورودی فرم ایجاد بشه باید بگم که ارتباطی به PHP نداره و اینگونه موارد سمت کاربر هستند.
برای انجام این کار ابتدا آیتمهای مورد نظر رو بررسی میکنیم. یک تگ DIV برای ایجاد یک شی درون آن؛ یک تابع برای انجام این کار و یک لینک که با کلیک روی اون این کار انجام میشه. پس اول یک DIV با ID دلخواه در جایی که انتظار نمایش آیتمهای مورد نظر رو داریم ایجاد میکنیم:
و با افزودن کدهای شما به صورت زیر خواهد بود:
<form id="upload_form" name="form1" method="post"
enctype="multipart/form-data">
<input name="brows[]" class="intext submitbtn" type="file" />
<div id="inputs"></div>
</form>
حالا لینک افزودن ورودی جدید رو هم در مکان دلخواه ایجاد میکنیم:
<a href="javascript: addInput()">آپلود فایلی دیگر</a>
همونطور که میبینید با کلیک بر روی لینک تابع ()addInput فراخونی میشه که کار اون اینه که ورودی دلخواه شما رو در مکان دلخواه که همون تگ DIV با آی دی inputs هست؛ ایجاد کنه:
function addInput() {
var targetDiv = document.getElementById('inputs');
var newinput = "<input name=\"brows[]\" type=\"file\">"+"<br>";
targetDiv.innerHTML += newinput;
}
موفق باشید.
1. به رسم ادب سلام
2 . آقاي بنيان عالم . من به شما ارادت زيادي دارم
. شما رو كم ميشه پيدا كرد . انگار ديگه به انجمن php سر نمي زنيد . واقعا خوشحال شدم ديدم شما جواب داديد .
3. كد كاملا درست بود و جواب داد و از توضيحات دقيق شما كمال تشكر رو دارم.
4. يه سوال ديگه مربوط به همين سوال و كارايي ان است:
اگر بخواهيم هنگام درج در كنار input ، يك لينك براي حذف آن ايجاد شود و با كليك روي آن input درج شده حذف شود.
5 . كار innet HTML چي هست ؟...؟؟؟؟
ممنونم؛ شما به بنده لطف دارید.
باز هم آیتمهای شاخص رو با هم بررسی میکنیم.
لزومات حذف هر کدام از ورودیها یک لینک "حذف" هستش که به کلیک بر روی اون تابع ()removeInpt اجرا بشه. اما تابع ()removeInpt میبایست آبجکت هدف رو شناسایی کنه، بنابراین هر input رو درون یک SPAN قرار میدیم و ID مشخصی به اون نسبت میدیم. از اونجایی که این برنامه پویا (dynamic) هستش، بنابراین آی دی ها هم باید به صورت پویا تولید بشن. پس به یک input مخفی برای نگهداری آیدی مرجع که همون آخرین ID هست، نیاز داریم.
پس فرم مورد نظر رو با اضافه کردن ورودی آیدی مرجع (آخرین آیدی تولید شده) به صورت زیر تغییر میدیم:
<form id="upload_form" name="form1" method="post"
enctype="multipart/form-data">
<input type="hidden" id="lastId" value="1">
<input name="brows[]" class="intext submitbtn" type="file" />
<div id="inputs"></div>
<input type="submit" value="آپلود فایلها" />
</form>
حالا باید در تابع ()addInput تغییراتی رو انجام بدیم. اول مقدار ورودی lastId رو میگیریم:
inputId = document.getElementById('lastId');
لینک حذف رو ایجاد میکنیم:
var deleteLink = " <a href=\"javascript: removeInput('input_"+inputId.value+"');\">حذف</a>";
توجه کنید که جهت حذف ورودی تابع ()removeInput به کار بردیم که کار اون فرستادن کلمه "_input" به علاوه مقدار ورودی ایجاد شده فعلی هستش مثلاً (input_4)
متغیر newinput هم نیاز به تغییراتی داره که بر اساس اون لینک حذف هم کنار ورودی جدید قرار بگیره و یک واحد به مقدار lastId اضافه بشه: (++inputId.value)
var newinput = "<div id=\"input_"+inputId.value+++"\"><input name=\"brows[]\" type=\"file\">"+deleteLink+"<br></div>";
حالا نوبت نوشتن تابع ()removeInput هستش که کار اون حذف یک ورودی هستش:
function removeInput(spanId) {
var inputObject = document.getElementById(spanId);
var targetDiv = document.getElementById('inputs');
targetDiv.removeChild(inputObject);
}
توسط ()removeChild ورودی درونی و خود DIV مورد نظر رو حذف میکنیم.
خصیصهی ()innerHTML باعث وارد کردن محتوای دلخواه؛ اعم از متن و تگها و... به درون تگ مورد اشاره میشه.
موفق باشید.
باز هم تشكر بابت اين همه زحمت ، بابت توضيحات بسيار خوب .
انشاءاله شما رو بيشتر زيارت كنيم .
موفق باشيد .