The Xrm.Navigation function has not been defined

When attempting to open a modal dialog box, I used the following code:

var addParams = "entityid=" + Xrm.Page.data.entity.getId() + "&entityName=" + Xrm.Page.data.entity.getEntityName();
var webresourceurl = "/webresources/pdfflr_selectorpage.html?Data=" + encodeURIComponent(addParams);
var parameters = {};
parameters["width"] = parent.document.body.clientWidth * 0.95;
parameters["top"] = '0px';
parameters["left"] = '0px';
parameters["height"] = parent.document.body.clientHeight;
//!!!           
Xrm.Utility.openDialog(webresourceurl, parameters, null, null, null); 

However, I realized that I need to change Xrm.Utility.openDialog to Xrm.Navigation.openWebResource. The issue is that Xrm.Navigation is currently undefined.

So, my question is: How can I achieve opening a dialog box using Xrm.Navigation?

Answer №1

Xrm.Navigation was recently unveiled in Dynamics 365 version 9. Learn more about this update in the article Deprecated Client APIs in Dynamics 365.

If you're working with CRM 2011, keep in mind that Xrm.Navigation is not available. Instead, refer to Xrm.Utility.

Answer №2

Check out the MSDN Documentation for openWebResource feature in Dynamics 365 (v9+)

Modal dialogs are no longer supported, but you can open a non-modal browser window using Xrm.Navigation.openWebResource

Here's a modified version of your code:

var data = {};
data["entityid"] = Xrm.Page.data.entity.getId();
data["entityName"] = Xrm.Page.data.entity.getEntityName();

var options = {};
options["width"] = parent.document.body.clientWidth * 0.95;
options["top"] = '0px';
options["left"] = '0px';
options["height"] = parent.document.body.clientHeight;

Xrm.Navigation.openWebResource("pdfflr_selectorpage.html", options, JSON.stringify(data));

Note:

  • You do not need to include "/webresources" in your URL
  • Avoid including querystring arguments in your url; instead use the data parameter

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

Error: The term "Image" is unrecognizable

I'm in the process of creating a website where I want to display images via links. If the image is missing or only 1 pixel wide, I need the site to show an alternative image. My technology stack includes Jade/Pug and JS. Before rendering the links on ...

What level of trust can be placed in MUI Global Class names when using JSS?

Here is my current code snippet: const formControlStyles = { root: { '&:hover .MuiFormLabel-root': { } } } Would it be considered secure to utilize the class name in theme overrides for connecting with other components? Furthe ...

Enhance React-D3-Graph ViewBox

I have a dataset named actors storing nodes and links called scratch. The structure is as follows... { "nodes": [ { "id": "Guardians of the Galaxy" }, { "id": "Chris Pratt" }, ...

Is there a way to implement HTML code that can automatically hide text based on the scroll size, similar to

Check out your Gmail inbox, where you'll notice 3 main columns Includes the sender's information Contains "THE_EMAIL_SUBJECT - THE_EMAIL_BODY" Showcases the date the email was sent on I observed that when resizing the window in the Gmail web c ...

A guide on leveraging console.log in Next.js

I'm having trouble displaying the output of an API call using console.log. The issue is that nothing appears in the console (both in the browser and Visual Studio Code). The only console.log that seems to work is within the RouteStatus function, but i ...

How can I implement a toggle button to display additional details for a specific row within a table created using React.js?

I'm currently working on a project using Next.js and have come across an unexpected issue. Upon reading a JSON file, I populate a table with the data retrieved from it. Each piece of information in the table has hidden details that should only be reve ...

How can I embed a Python processing sketch into a web page?

The question is simple. I dedicated a significant amount of time to creating a design in Processing using Python. Now, I am interested in displaying the sketch on a website. Naturally, one option would be to convert the Python code to JavaScript and uti ...

The keys within a TypeScript partial object are defined with strict typing

Currently, I am utilizing Mui components along with TypeScript for creating a helper function that can generate extended variants. import { ButtonProps, ButtonPropsSizeOverrides } from "@mui/material"; declare module "@mui/material/Button&q ...

Attaching an event listener to elements with a specified Class name

Currently facing a challenge where I am trying to implement a function that captures click events on squares. The objective is to capture the click event on every button with the square class. import { Component, OnInit } from '@angular/core&apos ...

Tips for running Typescript files on a server in the background

I am currently working on a NodeJS application that consists solely of TypeScript files, without any JavaScript files. I'd like to run it on my server in the background. Any suggestions on how I can achieve this? I experimented with using the npm pa ...

EJS variable not detected by Visual Studio IDE in JavaScript file

Working on a Node.js project with the express framework and utilizing EJS as the template engine, my IDE of choice is Visual Studio. Encountering an issue when using EJS variables within the same ejs file. Though it renders correctly and functions perfect ...

To properly conduct Playwright Component testing, it is essential to utilize the defineConfig() function

Currently, I am utilizing Playwright to execute tests on my components. The installation of playwright was completed by using the following command: npm init playwright@latest -- --ct Below is the configuration file for playwright-ct: import { defineConf ...

Implementing a Jquery Switcher: A Step-by-Step Guide

I always strive to provide clear and specific details about my question. My goal is to create an Alert Box for different types of inputs, where all inputs will trigger the same alert message in the box instead of separate alerts. I attempted to implement ...

Exploring Vue's feature of passing props and emitting events within nested components

Within my coding project, I am facing the challenge of properly implementing a parent component containing a form that includes a birthday component. This birthday component consists of two separate components within it. My task is to effectively pass prop ...

To modify the specified variables in data, I must deconstruct the object

Hello everyone, this is my debut post. I am seeking assistance with destructuring in order to update a variable that is defined within the "data" section. Below are the code snippets I have been working on using Vue. data: () => ({ id: '' ...

The Javascript alert is displaying twice in Internet Explorer

My file validation function is set up to only allow the uploading of xls files, and it works properly by displaying an error message if a non-Excel file is uploaded. However, there is an issue with the alert firing twice in IE. Here is my code: function ...

The art of Vue.js templating and interpolation goes beyond simply rendering data

I'm in the process of creating a reviews page using Vue.js. The goal is to take an array of objects and dynamically insert a section on the page for each review in the array, displaying details like name, rating, and review text. The current code imp ...

Is it possible to configure route localization in Next.js and next-i18next to function as an URL alias?

Currently, I am utilizing NextJs version 10.0.5 in conjunction with next-i18next version 8.1.0 to localize my application. With the introduction of subpath routing for internationalized routing in NextJs 10, I encountered a situation where I needed to modi ...

Create an array of dynamically calculated properties from the Vuex state array, which can then be utilized in the v-model

In my Vue 3 setup, I have a Vuex store with an array in the state: const store = createStore({ state: { questions: [ { text: 'A', value: false }, { text: 'B', value: false }, { text: 'C', value: true }, ...

Even though I've already assigned a key prop in React, I am still receiving a warning message about the

In the following code snippet, I am creating a note card element with a specific key. However, whenever I attempt to edit my note element, I encounter a warning that states: Warning: Each child in a list should have a unique "key" prop. Here is a portion ...