What could be causing the issue with sending a variable as a URL in a Planner Task reference?

I've encountered an issue while attempting to set references for a task through the Planner Graph API. The problem arises when trying to set the URL using a variable.

Even though I have created a separate method to encode the URL, which successfully returns the correct value, the references are not being properly set for the Planner task.

const updateAttachedFiles = (
    links: string[],
    taskId: string,
    etag: string
  ) => {
    var encodedLink: string; 
    links.forEach(async (link) => {
      encodedLink = escapeHtml(link)
      await graph.planner.tasks.getById(taskId).details.update(
        {
          references: {
            encodedLink : {
              "@odata.type": "microsoft.graph.plannerExternalReference",
              "previewPriority": " !",
              type: "Other",
            },
          },
        },
        etag);
    }
    )
  };

 const escapeHtml = (unsafe) => {
    let temp = unsafe.replaceAll("%", "%25")
    unsafe = temp
    .replaceAll(".", "%2E")
    .replaceAll(":", "%3A")
    .replaceAll("@", "%40")
    .replaceAll("#", "%23");

     return unsafe

  }

However, if I manually replace encodedLink with the hardcoded URL (taken from the variable), it functions as expected.

{
          references: {
            "https%3A//shmafe%2E.sharepoint%2E.com/sites/PlannerTest1/Delade dokument/nedladdning%2E.jpg" : {
              "@odata.type": "microsoft.graph.plannerExternalReference",
              "previewPriority": " !",
              type: "Other",
            },
          },
        }

I need the ability to dynamically set the link, so how can I achieve this without using a variable? Is there something else that I am missing in my approach?

For further reference, you can check out the Microsoft documentation on updating Planner task details here.

Additionally, information about the plannerExternalReferences resource type can be found in the Microsoft documentation here.

Answer №1

In order to utilize a variable as a key for an object, the bracket syntax must be used.

Here is an example:

const myVariable = 'goodbye';
const exampleObject = {
  [myVariable]: 'universe'
};

console.log(exampleObject[myVariable]);
// equivalent to
console.log(exampleObject.goodbye);

Below is the corrected code snippet:

const updateLinkedFiles = (
    urls: string[],
    taskId: string,
    tag: string
  ) => {
    var encodedUrl: string; 
    urls.forEach(async (url) => {
      encodedUrl = encodeURI(url)
      await graph.planner.tasks.getById(taskId).details.update(
        {
          references: {
            [encodedUrl] : {
              "@odata.type": "microsoft.graph.plannerExternalReference",
              "previewPriority": "!",
              type: "Other",
            },
          },
        },
        tag);
    }
  )
};

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Guide to utilizing this particular selector within jQuery

I am currently in the process of creating a drag-and-drop resizable template engine. However, I have run into a snag that I believe should be an easy fix, but unfortunately I am stuck. JQUERY CODE $(".getInfo").click(function(){ $("b").mousemove(functio ...

Click-triggered Animation of Glyphicon

I'm attempting to create an animation for a glyphicon-refresh icon that rotates when clicked. I've been trying to achieve this effect using CSS3, but haven't had much success. Below is the code I've used: <a id="update" href="#"> ...

The JSON string contains empty values

I'm attempting to convert my json data into a string - for (var i = 0 ; i < lines.length ; i++) { var label = lines[i]; var value = 1; item = []; item["label"] = label; item["value"] = value; jsonObj.push(item); } var j ...

Customize the field type in Kendo UI Grid based on specific row criteria

Dealing with a predicament that is proving to be quite challenging. I have a kendo grid that is being populated with data from a JSON file. The issue lies in the fact that the JSON file contains a field with varying types across different elements. Allow ...

Refresh the DOM window to load the updated PHP element

I have a dilemma with two separate playlists in a PHP file, each corresponding to a button labeled playlist1 and playlist2. <div class="player"> <?php include ('playlist1.php');?> <?php include ('playlist2.php'); ...

Importing three.js using ES6 syntax

When it comes to working with ES6, my workflow involves using Babel and babel-plugin-transform-es2015-modules-system.js specifically to transform module import/export for compatibility with system.js. I rely on a "green" browser for most ES6 features excep ...

Enhance the appearance of rows in a table by adding a captivating marquee effect to those with

I'm working with a table that has 7 rows and 2 tabs for Sunday and Monday. The row corresponding to the current time is highlighted in red. I wanted to know if it's possible to add the following <marquee>My first Row</marquee> effe ...

Unable to capture mistakes in function executed within try-catch statement

I'm currently facing challenges with implementing asynchronous functions in a Node.js server. This is my first experience working with try/catch blocks and I'm strugging to catch errors within the called function. Here's an excerpt of my co ...

Adding a new row to a Bootstrap table while maintaining the consistent style

Is there a way to dynamically add a new table row with different styling using jQuery? I'm facing this particular issue and need help in solving it. Below, I have included some screenshots of my code and the view for better understanding. Here is the ...

Looking for assistance with verifying the winning criteria for a Tic-Tac-Toe game coded in JavaScript

I need help understanding how to check for the winning conditions in my code. Can someone kindly explain it to me step by step? I'm quite new to coding. prntscr.com/m06ew1 <!DOCTYPE html> <html> <head> <title>Tic-Tac-Toe ...

Is there a way for me to dynamically retrieve the input value produced by the Query?

Is there a way to retrieve the value of a dynamically created input field? $('#inputArea').append(" <input id = "arrivalTime1" type = 'number' placeholder='Arrival Time' style = 'display: none;'> " ...

Utilizing AJAX with PHP on a single page: Guidelines

Hello everyone, I am trying to incorporate AJAX into the same PHP page. Usually, I can use AJAX on different pages but for some reason, I am facing challenges when using it on the same page. I have seen that people have achieved this using jQuery, howeve ...

Setting the width of individual Views within a ScrollView to adjust accordingly in React Native

Is there a way to ensure that the Views inside my horizontal ScrollView have the same dimensions as the ScrollView itself? I'd like to implement paging so that swiping takes me to the next View within the ScrollView. I attempted using width : "100%" b ...

VueSax notifications are showing up in the wrong place

Could it be my fault or is it due to the alpha status of vuesax that the notifications I want to use are displaying incorrectly? Here is the code extracted from the documentation: openNotification (title_, text_) { //This code is placed inside Vue methods ...

quiz stuck on last step due to xmhttp redirection problem

My learning project involves creating a PHP quiz with AJAX, which I am currently studying on Youtube. The goal is to have question number navigation displayed on the sidebar so that when a user clicks on any specific question number, the corresponding ques ...

"Updating values in an array using Vue 3 ref is not working as

Description Seeking assistance with Vue 3 and the composition API. Struggling to delete values in an array declared with ref. Code showcase Sharing my code below: <script setup lang="ts"> import { IPartnerCategory, IPartners } from ' ...

MongooseError: Attempting to execute a query that has already been completed: user.findOneAndUpdate(`

I've encountered an issue while following an online tutorial. The error I'm facing with the "PATCH" function (followUser) persists even after copying the instructor's code. The strange part is that it successfully updates in mongoDB despite ...

Vue snapshot testing is encountering a failure with the error message "TypeError: Cannot read property of undefined"

Everything seems to be working fine with the component on the page without any errors. Storybook is also functioning well, but the problem lies in the unit test. import { mount } from '../../vue'; import { createLocalVue } from '@vue/test-u ...

Exploring the Next.js Route API to Retrieve and Utilize Request Body Data

I've been experimenting with the new Route API's in Next v13.2, but I'm facing some difficulty in extracting the body values from a POST request. When calling the API on the client side, my code looks something like this: const respon ...

What is the process for integrating custom fields into a product using Stripe, and how can a stock limit be implemented for each customized field?

Currently, as I develop an ecommerce website using Next.js and integrate Stripe for checkout, I've come across the feature of custom fields in Stripe. This feature allows me to add options such as small, medium, and large for clothing sizes. However, ...