Linking Information through Data Detail and Server Connects

[famousmag]

Hey @Parker_Jacobs,

What you’re up to is easy…
(But please share screenshots or your code to understand what we are talking about)

Let’s start with the company name listed in your query
In order to get the Company Name listed in your defoffstanceconnect query you have to add a join in your query:

• In your database query builder fiirst add the deoffence table, click on the fields/columns you want to pull inside thequery
• add a Join table, the Companies (the table that contains the company name), set the columns that will connect the tables

If you can’t do it, open the database builder and if you need help send me screenshots to help you

(I share screenshots of my setup with products table. Each product has a catefory id and I list it pulling it with a join from the categories table)

[Parker_Jacobs]

Amazing! I have all the CRUD functionality already in my APIs but for right now I really want to focus on when I add defoffstance for the Employee_ID and the Company_ID to be auto inputted. Do you know how I would go about doing this?

[famousmag]

@famousmag

(But please share screenshots or your code to understand what we are talking about)

please…

[Parker_Jacobs]

I need my Company_Id to match what company is already selected, and I need my employee_Id to reflect who is logged in

[famousmag]

This is defined in your read serveraction (1st picture).
You mean to list the company name and the Employee name instead of their ids?

[Parker_Jacobs]

Hi Famousmag. Sorry I’m making this more confusing than it needs to be. Thanks to you my inner join’s are working and I’m displaying the correct information. The Read functionality in my CRUD works great. I am moving on to the Create part of my CRUD operation now. When I pull up my form (previous picture) I want my company_ID to be autofilled based on what company is selected, and I want my employee_id to be filled based on what employee is logged in.

[famousmag]

1. you can pull the Company id from the data detail, that you have already selected the company, right?
   

   

2. You can get the security identify in any serveraction you want and use for filtering or assigning anything you want
   BUT, I personally have added a security identify in the Globals in order to have it available everywhere without adding it again in any serveraction
   

   

[Parker_Jacobs]

Thank you! This is very helpful. How would it work in this scenario as well:

where when I click on company WOAH, and the Offense and Defense Stance, it’ll only show Company WOAH and not SNAP. The way I have it wired right now it only works when WOAH and SNAP are the highlighted ones, not when any other company is highlighted because there isn’t information for them yet.

[famousmag]

I haven’t understood completely how your data are connected and which serverconnect give what…

But I would suppose that you must define a filter IN THE YELLOW DATASOURSE like “Green.ticker == yellow.Ticker”
if you understand what I mean… otherwise you have to show me the whole workflow

[Parker_Jacobs]

@famousmag

You can get the security identify in any serveraction you want and use for filtering or assigning anything you want
BUT, I personally have added a security identify in the Globals in order to have it available everywhere without adding it again in any serveraction

I have this security identifier:

you’re saying instead of an API action make this under my globals to be able to always reference?

[Parker_Jacobs]

Yes, except I go by company_ID. Is there a way to easily do this because right now I’m using show commands through data detail when my defoff stance data detail selects company_id.

My Company server connect is for the company list, I use data detail to display the details on the right. I then made a navbar that when clicked I use my def_off_stance server connects to display the information in yellow. I am trying to use data detail to show when buttons are clicked, but I can’t make it work. I got close and it was working when the right company was selected and I clicked the button it would display the table, but when I added another datapoint now it works for both companies and displays both at the same time. That’s no good.

[Parker_Jacobs]

11/2 Explanation Video

Here’s how it’s all linked together.

[famousmag]

@Parker_Jacobs

I got close and it was working when the right company was selected and I clicked the button it would display the table, but when I added another datapoint now it works for both companies and displays both at the same time. That’s no good.

You want the Yellow table to show only the records that where Employee_id == Security_Identity?
Then you have to define that filter to the yellow table datasourse when you click the navbar button.

Show me the code of the navbar click event…

[Parker_Jacobs]

I want the yellow table to only display the information for only one company, in this case I only want information for the company WOAH

[famousmag]

So… define that filter over in that datasorce…

@famousmag

where Employee_id == Security_Identity

[famousmag]

If you don’t understand please share your code clicking the navbar item… What you’re doing there?

[Parker_Jacobs]

[famousmag]

I think you could define a filter on your datadetail (data_detaildefoffstance) then…
Something like that:

data_detaildefoffstance.company_id == Company_list.company_id

(translate it to your case)

[ben]

Sorry to barge in. I would like to show you how I would go about solving this.

First off, the database is the heart of an application. That is why I always start designing the data base. In my case I would construct this as follows:

The company read API looks like

The general_topics read API looks like

And the HTML for the layout page

<!doctype html>
<html>

<head>
  <base href="/">
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <title>Untitled Document</title>

  <link rel="stylesheet" href="/bootstrap/5/css/bootstrap.min.css" />
  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.14.0/css/all.css" integrity="sha384-HzLeBuhoNPvSl5KYnjx0BT+WB0QEEqLprO+NBkkk5gbc67FTaL7XIGa2w1L0Xbgc" crossorigin="anonymous" />
  <link rel="stylesheet" href="/css/style.css" />
  <link rel="stylesheet" href="/dmxAppConnect/dmxBootstrap5TableGenerator/dmxBootstrap5TableGenerator.css" />

  <script src="/dmxAppConnect/dmxAppConnect.js"></script>
  <script src="/dmxAppConnect/dmxRouting/dmxRouting.js" defer></script>
  <script src="/dmxAppConnect/dmxDataTraversal/dmxDataTraversal.js" defer></script>
  <script src="/dmxAppConnect/dmxFormRepeat/dmxFormRepeat.js" defer></script>
</head>

<body is="dmx-app" id="main">
  <main>
    <div is="dmx-view" id="content">
      <%- await include(content, locals); %>
    </div>
  </main>

  <script src="/bootstrap/5/js/bootstrap.bundle.min.js"></script>
</body>

</html>

The HTML for the content page

<dmx-serverconnect id="serverconnectCompanies" url="/api/companies/read"></dmx-serverconnect>
<dmx-data-detail id="data_detailCompany" dmx-bind:data="serverconnectCompanies.data.queryCompanies" key="id"></dmx-data-detail>
<dmx-serverconnect id="serverconnectGeneralTopics" url="/api/general_topics/read"></dmx-serverconnect>
<div class="container mt-4">
    <div class="row">
        <div class="col-4">
            <div class="table-responsive">
                <table class="table table-striped table-hover table-sm">
                    <thead>
                        <tr>
                            <th>Name</th>
                        </tr>
                    </thead>
                    <tbody is="dmx-repeat" dmx-generator="bs5table" dmx-bind:repeat="serverconnectCompanies.data.queryCompanies" id="tableRepeat1">
                        <tr dmx-on:click="data_detailCompany.select(id)">
                            <td dmx-text="name" dmx-class:text-danger="id==data_detailCompany.data.id"></td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <div class="col mt-4">
            <div class="table-responsive">
                <table class="table table-striped table-sm">
                    <tbody is dmx-generator="bs5table" dmx-populate="data_detailCompany.data">
                        <tr>
                            <th class="w-25">Name</th>
                            <th></th>
                            <td dmx-text="data_detailCompany.data.name" dmx-class:text-primary="id==data_detailCompany.data.id"></td>
                            <td dmx-text="id"></td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    <div class="row mt-4">
        <div class="col-4">
            <div class="table-responsive">
                <table class="table table-striped table-sm">
                    <thead>
                        <tr>
                            <th>Name</th>
                        </tr>
                    </thead>
                    <tbody is="dmx-repeat" dmx-generator="bs5table" dmx-bind:repeat="serverconnectGeneralTopics.data.queryGeneralTopics" id="tableRepeat2">
                        <tr>
                            <td dmx-text="name"></td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <div class="col">
            <form id="form1">
                <div is="dmx-form-repeat" id="formRepeat1" dmx-bind:items="data_detailCompany.data.general_topic_items">
                    <table class="table">
                        <thead>
                            <tr>
                                <th>Name</th>
                                <th>Company</th>
                            </tr>
                        </thead>
                        <tbody is="dmx-repeat" dmx-generator="bs5table" dmx-bind:repeat="data_detailCompany.data.general_topic_items" id="tableRepeat3">
                            <tr>
                                <td><input type="text" class="form-control" id="ins_name" name="name" aria-describedby="input1_help" placeholder="Enter some text" dmx-bind:value="name"></td>
                                <td><input type="text" class="form-control" id="ins_company" name="company" aria-describedby="company_help" placeholder="Enter some text" dmx-bind:value="data_detailCompany.data.name"></td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </form>
        </div>
    </div>
</div>

I hope that this works for you as it did for me.

and

For more info on form-repeat see:

Inserting Data in Main and Sub Table using App Connect Form Repeat

Intro App Connect Form repeat makes it easy to insert or update nested data in your database tables using a single insert or update action. This way you can easily insert data in your main table as well as in its sub tables. In this tutorial we will show you how to store a user and its contacts. The user will be stored in the main table, while its contacts will be stored in a sub table. Database Structure Our database structure is quite simple. We have a main table called users, having an un…

Using App Connect Form Repeater with Update Record Forms

Intro Form repeater can be used in update record forms in order to easily update nested data to your database table. Similar to our Insert Data tutorial - we will show you how to update a user and its contacts - so make sure to check it first, before continuing here. The user will be stored in the main table, while its contacts will be stored in a sub table. Overview We created an update record page with a list of records an a form: [Screenshot_93] Our dynamic list gets its data from a …

[Parker_Jacobs]

Thank you so much! I’ve been watching your videos on Youtube as well and they’ve been much help to me.