Updating a document on Firestore based on a query is a straightforward process that involves first identifying

I'm currently working on a web form page that needs to update input fields into a specific firestore document based on certain conditions. Can anyone provide guidance on how this can be achieved?

The initial part where I retrieve the query results seems to be functioning correctly, as indicated by the correct query result displayed in the console log. However, the second part which involves updating the document appears to be encountering some issues.


const reportForm = document.querySelector('#daily-reports');

reportForm.addEventListener('submit', (e) => {
    e.preventDefault();

    const forward = reportForm['forward'].value;
    const reflected = reportForm['reflected'].value;
    // additional code for other input fields omitted for brevity

    console.log(forward, reflected); // example fields logged here
    firebase.initializeApp(config);
    const db = firebase.firestore();
    
    // authentication and query logic here
    
    });

Upon executing the code, an error message is returned:

Error getting documents: TypeError: "doc.data(...).update is not a function"
    <anonymous> func.js:42
    forEach database.ts:2131
    // Additional error logs truncated for readability

Answer №1

Retrieve the raw data content of a DocumentSnapshot using the data() method. The resulting object is a plain JavaScript object without any additional methods.

To update the document associated with a DocumentSnapshot, utilize the ref property to obtain a DocumentReference, followed by invoking the update() method on this object.

doc.ref.update({...})

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 generating a mock constructor for the user model

While attempting to simulate my user model in order to test my service, the nest console is throwing a TypeError. I am unsure of how to properly 'emulate' the constructor of the user model. user.service.spec.ts import { Test, TestingModule } fro ...

Position items within the dynamically generated div without appending them

Utilizing JavaScript, I dynamically generate a line but struggle to position two balls at both the 1/3 mark from the beginning and end. For reference, please view the image below. I aim to have two balls appear upon pressing enter in the input box. Despite ...

confirmation message upon completing a form submission

<script> var remainingCredit = document.getElementById("cor_credit"); var remaining = document.getElementById("remain_credit"); function validateForm() { if (remaining.value < remainingCredit.value) { return conf ...

Creating a sort button in HTML that can efficiently sort various divs within a table is a useful tool for enhancing user experience

My HTML table is populated with various <td> elements. How can I arrange these divs based on IMDb rating, TomatoMeter, etc... [ CSS code is not provided below ] <table> <tr class="row"> <td class="column"> <br> ...

Accordion featuring collapsible sections

Looking to build an accordion box using Javascript and CSS. The expanded section should have a clickable link that allows it to expand even further without any need for a vertical scroll bar. Any ideas on how this can be achieved? Thank you ...

Using v-for with nested objects

Have you been attempting to create a v-for loop on the child elements of the {song: "xxx"} object within the songs array? export const data = [ {id: "1", albumname: "xx", artist: "xxxx", dateadded: "xxxx", route: "xxxx", songs: [{ song : &apos ...

Accessing objects from a loop in JavaScript

In an effort to adhere to the principle of avoiding "polluting the global namespace" and due to the consensus that global variables are typically discouraged, I made a modification in my code by replacing global variables: stBgAsset15_src = $image.at ...

The issue of ERR_MODULE_NOT_FOUND in Node.js express.Router arises when attempting to import new routes

Something strange is happening. I was in the process of organizing my routes by creating a new folder. Within this folder, I used the express.Router API to define the routes and then exported the router itself. Here is an example code snippet from my pos ...

Struggling to access the html elements within a component once the ng2 page has finished loading?

I am working on a web app that utilizes ng2-smart-table and I want to hide all cells within the table. However, when attempting to retrieve all the cells using document.getElementsByTagName("td") in the ngAfterViewInit() lifecycle hook, I noticed that the ...

Instructions for implementing the iPhone Contacts header scroll effect on an HTML webpage

If you take a look at this jsFiddle I've set up, it should give you a better idea of what I'm trying to accomplish: http://jsfiddle.net/nicekiwi/p7NaQ/2/ Imagine the contact page on an iPhone's iOS, where as you scroll through the alphabet ...

Accessing data from a CD-ROM or DVD through a web browser

I am currently working on developing a web application for a friend that will enable users to simply click a button to upload all the content from the CD-ROM or DVD they have inserted directly to a server. It's not feasible to rely on the standard br ...

Obtaining the chosen options from a dropdown menu

I am facing an issue with retrieving values from dropdown menus on a webpage that are used to filter a list. Despite trying various methods, I am not getting any values returned in my function. Here is what I have attempted: - var browserVal= document.ge ...

An index problem with BufferGeometry

Trying to transition code from openFrameworks to THREE.JS for generating a landscape with Perlin noise. The approach involves creating a static index array first, followed by positioning vertices in a square grid, each offset by a specific distance. This s ...

Javascript is unable to locate the clientid

Encountering an error message like the following: 'System.Web.UI.WebControls.TextBox' doesn't have a definition for 'ClentID' and there isn't any extension method 'ClentID' that accepts the first argument of type &a ...

Angular2 recursive template navigation

Is it possible to create a recursive template in Angular 2 without using ng-include? It's puzzling why this feature seems to be missing in Angular 2... HTML: <div ng-app="app" ng-controller='AppCtrl'> <script type="text/ng-templat ...

Problem uploading files with ajax in Laravel version 6

I am encountering an issue while attempting to save a PDF file along with other input values using Ajax in Laravel 6 without utilizing the form HTML element. The error message "Call to a member function getClientOriginalExtension() on null" keeps popping u ...

Displaying a JSON array based on certain criteria using ng-repeat

Hey there, I've got a JSON array that looks like this: var homes = [ { "city": "Dallas", "state": "TX", "zip": "75201", "NoteNumber": "162500" }, { "city": "Bevery Hills", "state": "CA", ...

Extracting and transforming an array into a list with the desired outcome

Looking for a way to flatten the array below into a single line array using Typescript/JavaScript? Student: any = [ { "id": "1", "name": "Jhon", "Marks": { "Math": "90", "English": "80", "Science": "70" } }, { "id": "2", "name": "Peter", "Marks": { "M ...

Is there a way to ensure that the table headers are printed on every page when using Google Chrome

When printing documents in Chrome browser, the table header (thead) does not appear on every page. I want to ensure that the table header is displayed on each printed page, just like it is done with IE and Firefox. However, Chrome does not support this fea ...

Ways to eliminate the worldwide model in SAPUI5

I've been attempting to break down the global model without success. I have a filter button that's set up like this: navToSecond : function (oEvent){ var oObject = this.getView().byId("inp").getValue(); sap.ui.getCore().setModel( ...