2021-06-29

How can we store every Object passed through a on-click event in an array after each time the button is clicked?

I am trying to Pass a button in a map function, And then trying to Obtain all the values in an array which I get after every on-click event function. The map function looks like this

  {Data.map((d, i) => {
      return (
       <div key={i} >
  <table>
  <tr>
    <td className="date">{d.Date}</td>
    <td className="time">{d.Time}</td>
    <td className="availability" >{d.Availabilty}</td>
    <td><button value={JSON.stringify(d)} onClick={(e)=>{
      decNum(e);
      }}>Book Now</button></td>
  </tr>

</table>
</div>
      )
})}

The onclick function goes like this

const decNum=(e)=>{
  var i =0
    cartData[i] = e.target.value
    i = i+1
    console.log(cartData)
    console.log( e.target.value)
  }

I am getting the value for the particular button that i am clicking on and nothing else. And I want to get all the previous data That I have clicked on before.

thanks in advance

for reference The data Passes in the map function goes like this

const Data =[
    {
   "Date":"Thu Jul 06 2021" ,
   "Time": "01:00 PM PST -03:00 PM PST",
   "Availabilty":"9 seats available",
  
  },
  {
   "Date":"Fri Jul 07 2021" ,
   "Time":"01:00 PM PST -03:00 PM PST",
   "Availabilty":"7 seats available",
  },
  {
   "Date":"Sat Jul 08 2021" ,
   "Time": "01:00 PM PST -03:00 PM PST",
   "Availabilty":"10 seats available",
  },
  {
   "Date":"Sun Jul 09 2021" ,
   "Time": "01:00 PM PST -03:00 PM PST",
   "Availabilty":"3 seats available",
  },
  {
   "Date":"Mon Jul 10 2021" ,
   "Time": "01:00 PM PST -03:00 PM PST",
   "Availabilty":"14 seats available",
  },
  
  {
   "Date":"Wed Jul 12 2021" ,
   "Time":"01:00 PM PST -03:00 PM PST",
   "Availabilty": "12 seats available",
  },
  {
   "Date":"Thu Jul 13 2021" ,
   "Time":"01:00 PM PST -03:00 PM PST",
   "Availabilty": "15 seats available",
  },
  {
   "Date":"Fri Jul 14 2021" ,
   "Time":"01:00 PM PST -03:00 PM PST",
   "Availabilty":"8 seats available",
  },
  {
   "Date":"Sat Jul 15 2021" ,
   "Time":"01:00 PM PST -03:00 PM PST",
   "Availabilty":"1 seats available"
  } 
  ]


from Recent Questions - Stack Overflow https://ift.tt/3AaW1H5
https://ift.tt/eA8V8J

No comments:

Post a Comment