Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

Rod2rick's avatar

Can't update data : get error [HTTP/1.1 500 Internal Server Error 527ms]

Hi, I have problem when I want to update an element from my form. here is my code:

<script setup>
    const updateSupply = async () => {
        console.log("Test");
        errors.value = ""
        try {
            await axios.put("http://127.0.0.1:49146/" + "supply");
        } catch (e) {
            if (e.response.status === 422) {
                for (const key in e.response.data.errors) {
                    errors.value = e.response.data.errors
                }
            }
        }
    };

const { destroySupply, updateSupply, updateClick } = useSupply();

const saveSupply = async () => {
  // console.log("Test");
  await updateSupply();
  // supply_id:this.supply_id,
};
</script>

<template>
<!-- Modal -->
  <CardBoxModal_JTO
    v-model="updateModalActive"
    title="Update supply"
    has-close
  >
    <form @submit.prevent="saveSupply">
      <CardBox>
        <FormField label="Noms & Email">
          <FormControl
            id="supply_name"
            v-model="form.supply_name"
            name="supply_name"
            :icon="mdiAccount"
            placeholder="name supply"
            required
          />
          <FormControl
            id="supply_email"
            v-model="form.supply_email"
            name="supply_email"
            type="email"
            :icon="mdiMail"
            placeholder="Email supply"
            required
          />
        </FormField>

        <!-- Buttons footer -->
        <BaseButtons class="flex justify-center">
          <BaseButton
            class="mr-2"
            type="submit"
            color="jt_orders"
            label="Modifier"
          />
          <BaseButton
            class="ml-2"
            type="reset"
            color="danger"
            outline
            label="Annuler"
          />
        </BaseButtons>
      </CardBox>
    </form>
  </CardBoxModal_JTO>


</template>

Somehow i get this error [HTTP/1.1 500 Internal Server Error 527ms]. PS : Below is my store code which works perfectly for it

<script>
const storeSupply = async (data) => {
        errors.value = ""
        try {
            await axios.post("http://127.0.0.1:49146/" + "supply", data);
        } catch (e) {
            if (e.response.status === 422) {
                for (const key in e.response.data.errors) {
                    errors.value = e.response.data.errors
                }
            }
        }

    }
</script>

What did I do wrong ? Thank you for you help

0 likes
3 replies
LaryAI's avatar
Level 58

The code for the axios.put request is missing the data to be updated. The axios.put method should have a second parameter that contains the data to be updated. Here's an example of how to update the supply data:

const updateSupply = async () => {
  console.log("Test");
  errors.value = "";
  try {
    await axios.put("http://127.0.0.1:49146/supply/" + supply_id, form);
  } catch (e) {
    if (e.response.status === 422) {
      for (const key in e.response.data.errors) {
        errors.value = e.response.data.errors;
      }
    }
  }
};

In this example, supply_id is the ID of the supply to be updated, and form is an object that contains the updated data. You'll need to replace supply_id with the actual ID of the supply you want to update, and form with an object that contains the updated data.

Rod2rick's avatar

@LaryAI Thank you for your help. I tried your code and I get an error Uncaught (in promise) TypeError: can't access property "status", e.response is undefined

click's avatar

a 500 error means it is a server error. You have to check your server error logs, the problem is inside your PHP and/or Server and not in your blade or javascript

Please or to participate in this conversation.