Creating a custom ID for a Firebase POST request

Is it possible to assign a custom ID in Firebase when using the POST method? For example:

{
  "users": {
    "user_one": {
      "username": "jdoe",
      "password": "123"
    }
  }
}

I'm currently working on a Vue.js project and I want to save information about students and their parents like this:

let parent = {
  name: this.parent.name,
  surname: this.parent.surname,
  id_number: this.parent.id_number,
  nationality: this.parent.nationality,
  marital_status: this.parent.marital_status,
  education_level: this.parent.education_level,
  profession: this.parent.profession,
  works: this.parent.works,
  work_location: this.parent.work_location,
  work_days: this.parent.work_days,
  work_phone: this.parent.work_phone,
  home_phone: this.parent.home_phone,
  mobile_phone: this.parent.mobile_phone
}

axios.post('https://projectname.firebaseio.com/parents.json', parent)
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });

Answer №1

Make sure to always use the PUT request instead of POST, otherwise you may end up with an auto-generated ID inside your "user_one".

POST request result:

{
  "users": {
    "user_one": {
      "134134hnj34nuj134bn": {
        "username": "jdoe",
        "password": "123"
      }
    }
  }
}

axios.put('https://projectname.firebaseio.com/padres/user_one.json', padre)

Using PUT will give you the desired outcome.

{
  "users": {
    "user_one": {
      "username": "jdoe",
      "password": "123"
    }
  }
}

Answer №2

A solution is readily available by utilizing the HTTP PUT method and indicating the complete path. It could be as straightforward as this, depending on the library you are using:

axios.post('https://projectname.firebaseio.com/padres/user_one.json', padre)

To delve deeper into this topic, refer to the detailed guidance provided in the Firebase REST API documentation regarding the PUT directive.

Answer №3

When utilizing Php cURL, I successfully implemented a PUT request by including my custom ID in the URL.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Having trouble getting the Facebook like button to display on my website using an iframe in the markup

I gave it my all to try and get it to work, but unfortunately, I was unsuccessful. This is the approach I took. First, I followed the instructions provided on https://developers.facebook.com/docs/plugins/like-button. Next, I copied and pasted the iframe ...

The HTML page is displaying the Express.js GET request

As a beginner in express.js, I'm encountering an issue where data sent to the client is displayed directly in the browser instead of appearing as a preview. Can someone please review my code and help me identify what I'm doing wrong? app.use(cors ...

Using an ng-repeat directive alongside an if condition in Angular

My website contains a vast array of 30 articles, previously represented by around 300 lines of HTML code, but now condensed to just 10 lines with angularjs. However, certain articles hold special significance and require specific display criteria. Check ou ...

Is there a way to trigger a function with the onclick event in NextJs?

Working on my NestJS project, I am still a beginner in the field. My current task involves creating a web application that displays a leaflet map with clickable tiles. Each tile should have a button that triggers a specific function when clicked. However, ...

How can I add header and footer elements in dot.js template engine?

My understanding was that all I needed to do (as per the documentation on GitHub) was to insert {{#def.loadfile('/snippet.txt')}} into my template like this: <!DOCTYPE html> <html> <head> <meta charset=&a ...

Exploring the inner workings of self-referencing mechanics in functions

In a recent coding scenario, I encountered this situation: I attempted to define the func1() function and add several static methods to it simultaneously by passing it through the _init() function along with a hash containing properties to attach. However, ...

Creating a seamless navigation experience with Next.js: Implementing per-page layouts for efficient 2-link navigation on a single screen

In my next.js project, I have a URL like "http://localhost:3000/forum". If a user goes to "http://localhost:3000/forum/{postId}", I want to redirect them back to "http://localhost:3000/forum" My folder structure is in the 'App' directory and I h ...

Identifying the conclusion of a folder being dropped in vanilla JavaScript

I am working on determining when a directory tree has been completely traversed after being dropped onto a page. My goal is to identify the point at which the next process can begin once the entire folder and its sub-directories have been processed by the ...

Vuejs Todolist List App experiences unanticipated alteration in task prop

I own a store that includes state, mutation, getters, and more. Within the state, there is a list of tasks like the ones shown below. const state = { tasks:[{ title: "Wake up", completed: false }, { title: "Item 2&quo ...

Utilize Vue to fetch authenticated Laravel data for populating purposes

Is there a way to fill the auth()->user()->first_name or {{ optional(auth()->user()->first_name) }} in my blade template? Can I use vue.js file.js to populate user.first_name with the code below? var app = new Vue({ el: '#property-boo ...

Continue sending a GET request until Vue.js receives a response from a POST request

Wondering how to handle file uploads in a Vue.js app? Here's a scenario for you - when a user browses and selects a file, a POST request is made to upload the file. While waiting for a response, you need to make GET requests every 2 seconds. How can t ...

Tips for changing an input value when clicked using JQuery

Struggling to create an interactive mind mapping tool using JQuery? One challenge I'm facing is editing the content of a div once it's been set. I've implemented a function that successfully adds text to a div within the (mind-container). H ...

AngularJS - directive template is not being compiled correctly

I am facing an issue with AngularJS. .directive('field', ['$routeParams', function($routeParams){ return { restrict: 'E', compile: function(tElement, tAttributes) { var template ...

"Creating multiple circles on an HTML5 canvas using an iPad: A step-by-step guide

My current code is only drawing one circle at a time on an iPad view, but I want to be able to draw multiple circles simultaneously. How can I achieve this? // Setting up touch events for drawing circles var canvas = document.getElementById('pain ...

Discovering the previously dropped value from a droppable div

Currently, I am developing a dynamic formula generator using jQuery's drag and drop functionality. Here is what I have accomplished so far: I have two lists: <ul id="head"> <li class="horizontal">Salary</li> <li class="h ...

What is the best approach for displaying multiple slots in Vue3?

Is there a way to utilize the h() function within the setup() method in Vue3 to render this template? <label v-for="service in services" :key="service"> <slot name="before" :service="service"></slo ...

What is the best way to implement a custom layout with nuxt-property-decorator?

Summary of Different Header Components in Nuxt In order to set a different header component for a specific page in Nuxt, you can create separate layout files. layout ├ default.vue // <- common header └ custom.vue // <- special header for s ...

Assigning a specific data type value to an element as it enters the top of the viewport

I have a unique color code stored for each section, and when a section reaches the top of the screen (specifically -180px for the header), I want to dynamically change the text color of the header element as you scroll through the sections. Despite no erro ...

What is the process for attaching an event handler to an element that is displayed after a button click?

I need some assistance with my JavaScript code. I have a page with two links, and when the second link is clicked, certain fields are displayed. I am trying to write an onkeyup() event handler for one of these fields, but seem to be missing something. Here ...

Hovering over the child element, instead of the parent

I'm working on implementing a highlight feature for my website. The structure of the HTML looks something like this: <div> <!-- this is the main container --> <div> content ... </div><!-- a child element --> < ...