How to set a variable value to Field name in Firebase Cloud. Web/HTML

user_13536340 0
Viewed 1137

I'm trying to set the data I entered in a form to the Field name in Firebase.

It works perfectly fine in the 3rd line $("#blogUID").val() (Blogs/blogUID collection). However, when I try to set the Field name in the Stats/Blogs collection (10th line), I get the following error:

error.ts:166 Uncaught FirebaseError: Function CollectionReference.doc() requires its first argument to be of type non-empty string, but it was: undefined
    at new ui (https://www.gstatic.com/firebasejs/7.17.1/firebase-firestore.js:1:52471)
    at Vh (https://www.gstatic.com/firebasejs/7.17.1/firebase-firestore.js:1:164122)
    at kh (https://www.gstatic.com/firebasejs/7.17.1/firebase-firestore.js:1:163328)
    at _d.doc (https://www.gstatic.com/firebasejs/7.17.1/firebase-firestore.js:1:280502)
    at HTMLButtonElement.<anonymous> (http://localhost:8080/TeamSolheim_Page1.html:251:36)
    at HTMLButtonElement.dispatch (https://code.jquery.com/jquery-3.5.1.min.js:2:43090)
    at HTMLButtonElement.v.handle (https://code.jquery.com/jquery-3.5.1.min.js:2:41074)

1    $("#blog-submit-button").click(function(){
2        // Add a new document in collection
3        // db.collection("Blogs").doc($("#blogUID").val()).set({
4        //     blogDate:  $("#blogDate").val(),
5        //     blogLink:  $("#blogLink").val(),
6        //     blogTitle: $("#blogTitle").val(),
7        // })
8        // .then(function() { 
9            db.collection("Stats").doc($("Blogs").val()).set({
10                $("#blogUID").val():  $("#blogLikes").val(),
11           })
12           .then(function() { 
                console.log("Document successfully written!");
                $("#blog-form").hide();
                $("#create-form").show();
            })
            .catch(function(error) {
                console.error("Error writing document 2: ", error);
            });
    //     })
    //     .catch(function(error) {
    //         console.error("Error writing document 1: ", error);
    //     });
    })

Permissions are wide open to any authenticated user:

    match /Stats/Blogs {
      allow read;
      allow write: if request.auth != null;
    }

Things I've tried:

            var _temp  = $("#blogUID").val();
            console.log(_temp);
            db.collection("Stats").doc("Blogs").set($("#blogUID").val, 123)
            //db.collection("Stats").doc("Blogs").val().set({
                //_temp: $("#blogLikes").val(),

                //"$$_temp.val()":  $("#blogLikes").val(),
                //$$_temp:  $("#blogLikes").val(),
                //window['_temp']: $("#blogLikes").val(),
                //$("#blogUID").val: $("#blogLikes").val(),
                //_temp:  $("#blogLikes").val(),
                //'$("#blogUID").val()':  $("#blogLikes").val(),
                //doc.$("#blogUID"): $("#blogLikes").val(),
                //$("#blogUID").val():  $("#blogLikes").val(),
           // })

Here's the final code for prosperity...

    $("#blog-submit-button").click(function(){
        // Add a new document in collection
        db.collection("Blogs").doc($("#blogUID").val()).set({
            blogDate:  $("#blogDate").val(),
            blogLink:  $("#blogLink").val(),
            blogTitle: $("#blogTitle").val(),
        })
        .then(function() { 
            var _temp  = $("#blogUID").val();
            console.log(_temp);
            db.collection("Stats").doc("Blogs").set({
                [_temp]: $("#blogLikes").val()
           })
            .then(function() { 
                console.log("Document successfully written!");
                $("#blog-form").hide();
                $("#create-form").show();
            })
            .catch(function(error) {
                console.error("Error writing document 2: ", error);
            });
        })
        .catch(function(error) {
            console.error("Error writing document 1: ", error);
        });
    })
google-cloud-firestore firebase html javascript
2 Answers

Moving down to an answer for formatting:

.set() needs an object - you had it "closer" on the first try. Try this:

const blogger = $("#blogUID").val() // jQuery
const bloggerLikes = $("#blogLikes").val() // jQuery

db.collection("Stats").doc("Blogs").set( { [ blogger]:  bloggerLikes } )

you need the [ ] to use the blogger value as the index/fieldname

user_24347840

Posting this as Community Wiki, based in the @LeadDreamer comment.

It seems by the stack trace that you error is related to the way that you are trying to query documents on line 9. From line 3, the db.collection("Blogs").doc($("#blogUID").val()).set() is correctly searching form the blogUID, where querying based in the id seems to be valid.

However, in your line 9, this db.collection("Stats").doc($("Blogs").val()).set() is not returning queries based in an id, as you can notice the difference between #blogUID and Blogs in the .doc() function. Since the error is informing that the issue is within the .doc() being undefined, please, change the way you are calling in line 9, to follow the same pattern from line 3.

user_127672570
Related