Access The Entry's ID from Connected Data

Hi, in the Visual Editor I’m using the ‘Connect data’ option to fetch items from a model “Projects”, this successfully updates the state with a list of all the model’s fields:

{
  state: {
    project: {
      results: [
        {
          data: {
            name: "Project 1",
            image: "http://example.com/image1.jpg",
            description: "This is the first project",
            title: "Project 1",
          }
        },
        {
          // ... other projects ....
        }
      ]
    }
  }
}

I use these results to map individual properties to a custom component’s field via the ‘Element data bindings’. However, I’d like to access the id property of the entry which is normally 1 level up from data. How can I do this?

Thanks.

Hi @aDev

In order for me to be able to help you, could you please provide me with the Builder Content Entry link where you’re experiencing an issue as it this will me further my investigation?

Here is how to find it:

Hi @sheema, this is the entry id: d6bbda8f7c894302bc7387f07c6fb7ba

Thanks.

Hey @aDev I am not able to find the ID field on your Projects. Typically you should be access it using the state. state.resultsItem.id. The actual value would depend on your specific use case.

hi @sheema, yes, that’s precisely the problem, we can’t find it either.

The results array contains all the properties in the data field, but we want to obtain the id generated by builder.io, which resides in the parent object of data:

{
  state: {
    project: {
      results: [
        {
          id: "xxxxxxxxxxx",  // <==== this is what we need
          data: {
            name: "Project 1",
            image: "http://example.com/image1.jpg",
            description: "This is the first project",
            title: "Project 1",
          }
        },
      ]
    }
  }
}

Is there anything we can do to parse the state results and map this value?

Hey @aDev are you talking about the Builder Content ID generated for each page?
In your case that would be the project data model-

If that is the case you can access it via the customURL from your results.

state.resultsItem.data.customUrl

Let me know if you are looking for something else!

@sheema the customUrl is a property we added to the model as a workaround. Currently, after the entry is generated, we need to manually paste this value there. We are looking for a way to obtain the Builder Content ID dynamically, so we no longer need to update every entry manually.

@aDev You can utilize the reference data type in your data model, which allows you to establish a connection to the desired page by referencing its content ID. For a clearer demonstration, I’m sharing a Loom video to provide visual context.

Hope this helps.