ساخت آرایه جدید وقتی کلیک شد
سلام میشه کمکم کنید؟ من میخوام که هر بااااار که کاربر روی دکمه ذخیره کلیک کرد یه آرایه جدید بسازه و مقدار input ها رو داخلش قرار بده. و همین آرایه رو بزاره داخل خونه 0 یک آرایه . دوباره که کاربر کلیک میکنه بیاد باز مقدار input هارو تو یه آرایه جدید بریزه نه همون آرایه قبلی.و به همین ترتیب خونه 2و3و.... تو هر خونش یه آرایه از مقدارای input باشه
اینم کدامه که اشتباهه. کد من میاد وقتی دوباره و دوباره کلیک میکنم مقدار رو توی همون ارایه قبلی میریزه و ارایه جدید به ازای هر بار کلیک درست نمیکنه
<html lang="fa" dir="rtl" xmlns="http://www.w3.org/1999/html" >
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="utf-8">
<title></title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
<script type="text/javascript" src="js/jquery.js"></script>
</head>
<body>
<br>
<br>
<center>
<form id="dataform">
<label for="name">کد ملی</label>
<input type="text" class="form-control-file" id="n"><br>
<label for="name">نام</label>
<input type="text" class="form-control-file" id="name"><br>
<label for="lastname">نام خانوادگی </label>
<input type="text" class="form-control-file" id="lastname"><br>
<label for="fathername">نام پدر</label>
<input type="text" class="form-control-file" id="fathername"><br>
<label for="birthday">تاریخ تولد</label>
<input type="text" class="form-control-file" id="birthday"><br><br>
<input type='file' style=" margin: 0 124px 5px 0;"/><br><br>
<img id="myImg" src="#" alt="محل قرار گیری آپلود عکس" /><br><br>
<input type="button" id="btnn" onclick="saveInfo()" value="ذخیره">
<br>
<br>
<p id="end"></p>
<div id="a"></div>
</form>
</center>
<style>
#btnn{
background-color: palevioletred;
width: 80px;
height:40px;
}
</style>
<script>
var arr=[];
var arr1=[]
function saveInfo(){
var nid=document.getElementById("n").value;
var nameeee=document.getElementById("name").value;
var namkh=document.getElementById("lastname").value;
var nampe=document.getElementById("fathername").value;
var dateborn=document.getElementById("birthday").value;
arr.push(nid);
arr.push(nameeee);
arr.push(namkh);
arr.push(nampe);
arr.push(dateborn);
console.log(arr1);
arr1.push(arr);
document.getElementById("end").innerText=arr1;
}
$(function () {
$(":file").change(function () {
if (this.files && this.files[0]) {
var reader = new FileReader();
reader.onload = imageIsLoaded;
reader.readAsDataURL(this.files[0]);
}
});
});
function imageIsLoaded(e) {
$('#myImg').attr('src', e.target.result);
}
</script>
</body>
</html>
پاسخ‌ها
11
@pariageravand
اگر فرض کنیم آیدی myImgFile رو به input عکس داده باشین فایلش اینطوری بدست میاد
var file = document.getElementById('myImgFile').files[0];
سلام،شما باید در اینجا از متد map استفاده کنی و یک تابع بنویسی که رو map اجرا بشه و هرسری دیگه به صورت خودکار این عمل انجام میشه و اگه خواستید جایی map رو مطالعه کنید پیشنهاد من https://www.roxo.ir/javascript-array-iteration این مقاله هستش،موفق باشید.
سلام
@pariageravand
مقدار
var arr=[];رو داخل فانکشن saveInfo قرار بدین
function saveInfo(){
var arr=[];
var nid=document.getElementById("n").value;
var nameeee=document.getElementById("name").value;
var namkh=document.getElementById("lastname").value;
var nampe=document.getElementById("fathername").value;
var dateborn=document.getElementById("birthday").value;
arr.push(nid);
arr.push(nameeee);
arr.push(namkh);
arr.push(nampe);
arr.push(dateborn);
console.log(arr1);
arr1.push(arr);
document.getElementById("end").innerText=arr1;
}گفتگوهای مرتبط
شاید پاسخ شما همین‌جا باشد
@mehdi.mahdavi97 مرررسی واااقعا. من الان شرکت سرکارمم. نجاااتم دادی . حالا اگه بجای مقدار input یه عکس رو imagebase64 uri رو بگیره و بزاره داخل این آرایه چی؟؟؟؟؟؟؟؟؟؟؟؟
@kamyzenon خیلی ممنون
@pariageravand
متوجه نشدم ، منظورتون اینه عکسی که انتخاب میشه مقدار base64 ش رو داخل آرایه قرار بدین ؟
@mehdi.mahdavi97 االان تو آرایه من مقدار input ها هستش. من میخوام یه عکس هم بگیره بزار تو آرایه. inputi که type:image
نمیدونم چطوری
@mehdi.mahdavi97 ممنون. حالا یه input دارم که type فایل. عکس رو چطوری تبدیل میشه به base64????????
@pariageravand
میتونید از این فانکشن استفاده کنید :
function getBase64(file) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result);
reader.onerror = error => reject(error);
});وبرای فراخوانی :
getBase64(file).then(function(data){
console.log(data);
});
data مقدار base64 هستش
@mehdi.mahdavi97 ممنون😍😍😍😍😍😍 من تازه شروع کردم و خیلی به مشکل میخورم. وااااقعااااا ممنونم. 🙏🙏🙏🙏🙏
✅✅✅✅✅✅✅✅✅✅✅✅