user23154524
user23154524

Reputation: 11

How update the multiple data fetched from api and update submit to API

I am facing issues of submitting multiple records using the formadata

<div className="APDB_table-wrapper">
              <table className="table-Result">
                <tbody>
                  <tr className="table-Result-Row">
                    <th className="table-Result-Header">Application ID</th>
                    <th className="table-Result-Header">Application Name</th>
                    <th className="table-Result-Header">GSID</th>
                    <th className="table-Result-Header">Sequence</th>
                    <th className="table-Result-Header">Application DL</th>
                    <th className="table-Result-Header">Manager DL</th>
                    <th className="table-Result-Header">
                      Application Owner DL
                    </th>
                    <th className="table-Result-Header">DataCenter</th>
                    <th className="table-Result-Header">QA SFTP ID</th>
                    <th className="table-Result-Header">QA Password</th>
                    <th className="table-Result-Header">PROD SFTP ID</th>
                    <th className="table-Result-Header">PROD Password</th>
                    <th className="table-Result-Header">Updated User</th>
                  </tr>
                  {Result.map((item) => (
                    <tr key={item.acd_con_seq} className="table-Result-Data">
                      <td>
                        <input
                          type="text"
                          name="applicationId"
                          value={item.acd_ap_id}
                          readOnly
                        />
                      </td>
                      <td>
                        <input
                          type="text"
                          name="applicationName"
                          value={item.acd_ap_nm}
                          readOnly
                        />
                      </td>
                      <td>
                        <input
                          type="text"
                          name="gsid"
                          value={item.acd_ap_gsid}
                          readOnly
                        />
                      </td>
                      <td>
                        <input
                          type="text"
                          name="Sequence"
                          value={item.acd_con_seq}
                          readOnly
                        />
                      </td>
                      <td>
                        <input
                          type="text"
                          name="applicationDl"
                          onChange={(e) => {
                            item.acd_appl_dl = e.target.value;
                          }}
                          defaultValue={item.acd_appl_dl}
                        />
                      </td>
                      <td>
                        <input
                          type="email"
                          name="leadManagerDl"
                          defaultValue={item.acd_lead_manager_dl}
                          onChange={(e) => {
                            item.acd_lead_manager_dl = e.target.value;
                          }}
                        />
                      </td>
                      <td>
                        <input
                          type="email"
                          name="systemOwnerNameDl"
                          defaultValue={item.acd_system_owner_name_dl}
                          onChange={(e) => {
                            item.acd_system_owner_name_dl = e.target.value;
                          }}
                        />
                      </td>
                      <td>
                        <input
                          type="text"
                          name="dataCenterName"
                          defaultValue={item.acd_dc_name}
                          onChange={(e) => {
                            item.acd_dc_name = e.target.value;
                          }}
                        />
                      </td>
                      <td>
                        <input
                          type="text"
                          name="qaSftpId"
                          defaultValue={item.acd_qa_sftp_id}
                          onChange={(e) => {
                            item.acd_qa_sftp_id = e.target.value;
                          }}
                        />
                      </td>
                      <td>
                        <input
                          type="text"
                          name="qaSftpPwd"
                          defaultValue={item.acd_qa_sftp_pwd}
                          onChange={(e) => {
                            item.acd_qa_sftp_pwd = e.target.value;
                          }}
                        />
                      </td>
                      <td>
                        <input
                          type="text"
                          name="prodSftpId"
                          defaultValue={item.acd_prod_sftp_id}
                          onChange={(e) => {
                            item.acd_prod_sftp_id = e.target.value;
                          }}
                        />
                      </td>
                      <td>
                        <input
                          type="text"
                          name="prodSftpPwd"
                          defaultValue={item.acd_prod_sftp_pwd}
                          onChange={(e) => {
                            item.acd_prod_sftp_pwd = e.target.value;
                          }}
                        />
                      </td>
                      <td>
                        <input
                          type="text"
                          name="updatedUser"
                          defaultValue={item.acd_upd_usr}
                          onChange={(e) => {
                            item.acd_upd_usr = e.target.value;
                          }}
                        />
                      </td>
                    </tr>
                  ))}
                </tbody>
              </table>
            </div>
            <input type="submit" className="submit_Update" />
            </div>
          </Form>

result have api result as follows

acd_ap_gsid
: 
""
acd_ap_id
: 
""
acd_ap_nm
: 
""
acd_appl_dl
: 
""
acd_comments
: 
""
acd_con_seq
: 
"1"
acd_crt_date
: 
""
acd_crt_user
: 
""
acd_dc_name
: 
""
acd_lead_manager_dl
: 
""
acd_prod_sftp_id
: 
""
acd_prod_sftp_pwd
: 
""
acd_qa_sftp_id
: 
""
acd_qa_sftp_pwd
: 
""
acd_rg_nm
: 
""
acd_system_owner_name_dl
: 
""
acd_upd_date
: 
""
acd_upd_usr
: 
""

Data 2 
acd_ap_gsid
: 
""
acd_ap_id
: 
""
acd_ap_nm
: 
""
acd_appl_dl
: 
""
acd_comments
: 
""
acd_con_seq
: 
"2"
acd_crt_date
: 
""
acd_crt_user
: 
""
acd_dc_name
: 
""
acd_lead_manager_dl
: 
""
acd_prod_sftp_id
: 
""
acd_prod_sftp_pwd
: 
""
acd_qa_sftp_id
: 
""
acd_qa_sftp_pwd
: 
""
acd_rg_nm
: 
""
acd_system_owner_name_dl
: 
""
acd_upd_date
: 
""
acd_upd_usr
: 
""

The action I am calling

export async function action({ request }) {
  console.log(" functioncalled");
  const formData = await request.formData();
  const data = Object.fromEntries(formData);
  console.log(data)
  const newData=await updateAPDB(data);
  if (!newData === "1") {
    return null;
  } else {
    return redirect(`/webpage`);
  }
}

When I am trying access the formdata I am getting only sequence 2 data , I am unable to access the seq 1, I am not able to get the data of seq 1 to submit it into updatAPDB which calls api and update the data.

Upvotes: 0

Views: 39

Answers (0)

Related Questions