Create Item View App to display link column data as iFrame

Hello there @nadiah and welcome to the community!

I hope you like it here 💪

You will need to use code for this one.

You could use our SDK (documentation here) and use the monday.get method using “context” as an argument to get the context of where the item view is being opened (in which item). This will give you an itemId.

You can then use that itemId with the method monday.api to get the URL inside your link column. This is our API documentation.

Once you have that URL, you can use it in your HTML code to display it inside your view.

You can also check an app that uses the SDK in a basic way here.

I hope that helps!

Cheers,
Matias

Thank you so much for your help! The example code really helps 🙂 I will check this solution out

2 follow-up questions - but I think I’m figuring something out! :

This is what I have:

import React from "react";
import "./App.css";
import mondaySdk from "monday-sdk-js";
import "monday-ui-react-core/dist/main.css"
//Explore more Monday React Components here: https://style.monday.com/
import AttentionBox from "monday-ui-react-core/dist/AttentionBox.js"

const monday = mondaySdk();

class App extends React.Component {
  constructor(props) {
    super(props);

    // Default state
    this.state = {
      settings: {},
      name: "",
    };
  }

  componentDidMount() {
    monday.listen("context", res => {
      this.setState({contextData: res.data});
      console.log(res.data);
    })
  }

  render() {
    return <div className="App">
      {JSON.stringify(this.state.contextData)}
    </div>;
  }
}

monday.api('query {
  items(ids: itemid) {
    name
    column_values (ids:link82) {
      id
      text
    }
  }
}

');

export default App;

1. How do I refer back to the item id into this part of the code?:

monday.api('query {
  items(ids: ?-->itemid<--?) {
    name
    column_values (ids:link82) {
      id
      text
    }
  }
}
');

2. Then after that: how do I refer to the returned url in the html?

Hello again @nadiah,

I do not understand the questions you sent. What do you mean refer back to the item ID?

And what do you mean when you say “refer to the returned url in the html”?

What would “refer” mean in this context?

And what url in what html?