Get column Data to a HTML label

Hey,

i made my app working in the way that i can recieve the name of each column… but now i struggle to get the columns e.g the description or the notes i´ve added.

How could i get the column data as a single variable so i´m able to fill these in the HTML ?


MY PHP CODE

?>

<?php

    header("Access-Control-Allow-Origin: *");
    header("Access-Control-Allow-Headers: *");

    $token = 'XXXXXXXXX';
    $apiUrl = 'https://api.monday.com/v2';
    $headers = ['Content-Type: application/json', 'Authorization: ' . $token];
    $boardID = 'XXXXXXX';
    $groupID = 'test_project';
    $getCollumn = "langer_text";

   $query = 'query { boards (ids: '.$boardID.') { id groups (ids: "'.$groupID.'") { id title items { id name } }}}';
  

  
    $data = @file_get_contents($apiUrl, false, stream_context_create([
    'http' => [
    'method' => 'POST',
    'header' => $headers,
    'content' => json_encode(['query' => $query]),
    ]
    ]));
    $responseContent = json_decode($data, true);
    echo json_encode($responseContent["data"]["boards"][0]["groups"][0]["items"]);



?>

MY JS ( HTML ) CODE

const ProjectBox = {
    props: ['name'],
    template: /*html*/`
    <div class="card" style="height: 150px;">
        <div class="card-body">
            <h5 class="card-title">{{name}}</h5> 
            <label for="Input2" class="form-label pt-3"></label>
            <br />
            <a href="XXXXXXXX" target="_blank" class="btn btn-primary">XXXXX</a>
        </div>
    </div>
    `
}

const wp_projects = {
    components: {
        'project-box': ProjectBox
    },
    template: /*html*/`
        <div class="d-flex flex-column flex-lg-row flex-wrap bd-highlight mb-3">
            <div class="px-2 mt-2" v-for="boardItem in boardItems">
            

                <project-box :key="boardItem.id" :name="boardItem.name">
                
                </project-box>
            </div>
        </div>
        `
    ,
    data: function(){
        return {
            boardItems: ''
        }
    },
    mounted: function() {
        fetch('domain of our PHP script ', {
                method: 'GET',
                mode: 'cors',
                credentials: 'omit'
            })
                .then(r => r.json())
                .then(data => {
                    console.log(data);
                    this.boardItems = [...data];
            });
    }
}

if(document.getElementById('wp-projects') !== null){
    console.log('start wp-projects');
    Vue.createApp(wp_projects).mount('#wp-projects');
}```

hi @SilverSlider
Welcome to the community. If you mean the column description field, like:
image
I’m afraid this one is not (yet) supported by the API. This one is from the API documentation:


and as you can see the description is not part of the fields.

I recommend to submit a feature request for it.

Hey @basdebruin thanks for your quick answer ! :slight_smile:

my question was not about the desc. of the wohle board ( sorry for this missunderstanding ) i was struggeling about to get alle the information of all columns in a board.

I solved it a minute ago -
i got the values of the board in a array and solved now how to get the information out of it in the correct way by their type and position in the array.

` <project-box :key=“boardItem.id” :name=“boardItem.name”
:text=“boardItem.column_values[0].text”
:text1=“boardItem.column_values[1].text”
:text2=“boardItem.column_values[2].text”

            >

`
now everything is displayed as it should.

Thanks :blush: anyway

1 Like

Hey @SilverSlider,

i’m glad you were able to tackle this one! Thanks so much for sharing your solution within the community, too!

@basdebruin I appreciate your help, as usual!

-Alex

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.