Breaking kendoWindow occurs when the kendo window extension is applied

Currently, I am working on subclassing Kendo Window. My subclassed Window is functioning properly at the moment. However, it seems to be causing an issue with the close event of the standard Kendo Window. Whenever the close event is triggered, I receive the following error message:

Uncaught TypeError: Cannot read property 'options' of undefined
.

If you'd like to see an example of what I'm trying to achieve, you can visit this link: http://jsbin.com/IfoMOPU/6/edit?html,js,output

Could someone point out what I might be missing in order to resolve this issue?

Answer №1

It appears there may be an issue or design flaw within Kendo UI that needs attention. As a temporary fix, you can try replacing the kendoWindow widget and modifying the "windowObject" function to also accommodate your customized window subclasses:

function windowObject(element, name) {
    var contentElement = element.children(KWINDOWCONTENT);

    return contentElement.data("kendoWindow") || contentElement.data("kendoCustomWindow") || contentElement.data("kendo" + name);
}

Here is an example of the fixed code: http://jsbin.com/OfIHOm/1/edit

Update: In the latest update, Q2 2013 SP1 (version 2013.2.918), the code from the private function windowObject has been relocated to the method _object.

This allows for subclassing of kendoWindow just like any other widget, but it is still recommended to modify kendoWindow's _object method as follows:

/**
* Modify kendoWindow's _object method to include our new widget
*/
ui.Window.fn._object = function (element) {
    var content = element.children(KWINDOWCONTENT);

    return content.data("kendoWindow") || content.data("kendoCustomWindow") || content.data("kendo" + this.options.name);
};

For the updated version, refer to: http://jsfiddle.net/lhoeppner/qj2HL/

Answer №2

Encountered a problem when my Kendo window was loading a dynamic script within its content. Moving the script to the header successfully resolved the issue.

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

Looking to access the layout details of an HTML element similar to what can be done in Firefox's debugger tool?

I am facing a challenge with a aspx.net grid control where I need to extract the first row's information and copy it into another table using JavaScript. To achieve this, I am attempting to calculate the width of each cell in the first row by accessin ...

`How can I use JavaScript filter to refine element searches?`

Struggling to get this filter function to work correctly. I configured it to filter and display only the desired items based on the card's classname (landing-pages-list). Unfortunately, the function is not functioning as expected. How can I make it w ...

Innovative way to design a menu using HTML, CSS, and JavaScript that dynamically resizes to a specific width

I'm currently working on a website and I'm trying to create a menu with specific width of 700px. However, I'm unsure whether to tackle this using CSS, JavaScript, or a combination of both. Which approach would be the most straightforward for ...

Working with color fills in Three.js shapes

Looking for some help with code that generates a yellow circle: let radius = 5, segments = 64, material = new THREE.LineBasicMaterial( { color: 0xF0C400 } ), geometry = new THREE.CircleGeometry( radius, segments ); geometry.vertices.shift ...

I'm seeking an easy method to adjust the x and y coordinates of a popup rectangle with a fixed size. Can anyone provide

Is there a way to create a simple pop-up rectangle, possibly using jQuery or a similar tool, that presents a scaled-down canvas view of a larger browser window (1000px x 1600px), allowing users to click and determine the x/y position within the full window ...

Sharing information through a hyperlink to a Bootstrap popup window

I've been attempting to send data to a Bootstrap modal window with no success so far. First, I tried: <a href="#TestModal?data=testdata" role="button" class="btn" data-toggle="modal">Test</a> However, the modal did not open as expected. ...

Creating an inline function in JavaScript for an anchor tag

I'm attempting to open a new window with a specific URL while also sharing the current page's address through an inline function. Here's what I have so far: a href="javascript:void(0);" onClick='(function() { var link = string.conc ...

Is the ajax success function failing to work properly in JavaScript?

Although I've searched extensively on Stack Overflow, none of the similar questions seem to solve my issue. The problem I'm facing is that the success function is not triggering the alert message and I can't seem to figure out why. <form ...

What is the best way to set up a simple example using a Node Stream.Readable?

I am currently exploring the concept of streams and encountering some difficulties in making it work properly. For this scenario, my goal is to send a static object to the stream and then pipe it to the server's response. This code snippet shows my ...

Discovering a specific value within a JSON stringified array

I am looking for a specific value within a JSON stringify array [{"id":"432","temperature":"1","humidity":"1","createat":"0000-00-00 00:00:00"},{"id":"433","temperature":"22.00","humidity":"48","createat":"2015-10-11 19:49:57"},{"id":"434","temperature":" ...

Generating computations within a currently active session

I am currently in the process of developing a shopping application using AngularJS, PHP, a webservice, and various HTML/CSS and XML elements. At the moment, I am focusing on implementing the cart session functionality and have encountered difficulties whe ...

A variety of menu items are featured, each one uniquely colored

In the user interface I developed, users have the ability to specify the number of floors in their building. Each menu item in the system corresponds to a floor. While this setup is functional, I am looking to give each menu item a unique background color ...

Creating a dynamic content space: A step-by-step guide

Project Overview I'm currently working on a cinema demo website, where I have implemented four movie poster panels displaying the poster image, title, and screening times. These panels are meant to be clickable. My goal is to have an interactive fea ...

What could be the reason for the Checkbox's value not showing up after making changes?

In my React and Material UI project, I am facing an issue where I want to check all checkboxes in a list by simply checking one checkbox in a parent component. Despite passing down the correct value of the parent checkbox through props, the visual changes ...

How can I organize and arrange a JSON object based on specific criteria?

Imagine having a JSON object containing user colors that you want to sort by UserID. oUserColors = { "users": [ { "UserID": 31, "Color": "Red" }, { "UserID": 30, "Color": "Red" }, { "UserID": 32, "Color": "Green" }, { "UserID": 30, "Color" ...

Top method for cycling through an Array in React

I am looking to create a memory game using React for a portfolio project. I have an array of 20 items with 10 different sets of colors. const data = [ // Manchester Blue { ID: 1, Color: "#1C2C5B" }, ...

Filtering JSON data with JavaScript

Looking to group data in AngularJS using UnderscoreJS. Here is the JSON data: data = [ { "Building*": "Building A", "Wing*": "Wing C", "Floor*": "Floor 3", "Room Name*": "Room 3", "Room Type*": ...

What is the best way to extract the value of a string before a comma in Javascript?

I have a challenge where I need to eliminate the city from a city, state combination. For example, if I have the string "Portland, OR", I want to extract only "Portland". Can someone help me with a Javascript solution or guide me on how to achieve this usi ...

Developing MCRYPT_RIJNDAEL_128 from scratch in Node.js

Attempting to replicate the php encryption script below using node.js: $size = mcrypt_get_iv_size(MCRYPT_RIJNDAEL_128, MCRYPT_MODE_ECB); $iv = mcrypt_create_iv($size, MCRYPT_RAND); $msg = base64_encode(mcrypt_encrypt(MCRYPT_RIJNDAEL_128, 'MY_KEY_LONG ...

Eliminate every instance using the global regular expression and the replace method from the String prototype

function filterWords(match, before, after) { return before && after ? ' ' : '' } var regex = /(^|\s)(?:y|x)(\s|$)/g var sentence1 = ('x 1 y 2 x 3 y').replace(regex, filterWords) console.log(sentence1) sentence2 ...