Prevent RadMenu from triggering postback after performing an action

I am facing an issue with my radmenu (Telerik control) where I want it to perform two actions when clicked: 1. open menu, 2. cancel postback.

Below is the code for the menu:

<telerik:RadMenu ID="radMnu1" runat="server" ClickToOpen="true" OnClientItemClicked="MenuItemClicked" OnClientItemClicking="MenuItemClickingCancelPostback">
   <Items>...
   </Items>
</telerik:RadMenuItem>

Here are the associated JavaScript methods:

function MenuItemClicked(sender, args) {
        var itemValue = args.get_item().get_value();

        var menu = $find("ctl00_radMnu1");
        var menuItem = menu.findItemByText(itemText);
        if (menuItem) menuItem.open();
    }

    function MenuItemClickingCancelPostback(sender, args) {
        args.set_cancel(true); // Cancel the postback 
    }

The problem arises when I enable the OnItemClicking event - it cancels the postback but fails to trigger the OnItemClicked event. Conversely, disabling OnItemClicking results in a successful menu opening but also triggers a postback.

Is there a way to achieve both: opening the menu and cancelling the postback? Ideally, I would like to cancel the postback in the OnItemClicked event, but unfortunately, the set_cancel() method is not available in its arguments.

Any guidance on this matter would be greatly appreciated.

javascripttelerikclient-sideradmenu

Answer №1

Could you please write the code using onitemclicking to ensure it works properly, like so

function MenuItemClickingCancelPostback(sender, args) {       
    // Begin by opening the menu and then cancel the postback.
    var menu = $find("ctl00_radMnu1");
    var menuItem = menu.findItemByText(itemText);
    if (menuItem) menuItem.open();
    args.set_cancel(true); // Cancel the postback 
}

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

Potential Scope Problem in Angular JS Controller

The HTML code snippet I have is as follows: <body ng-controller = "Control as control"> <button ng-click = "control.prepareAction()">Do Action </button> <div id="one" ng-hide = "!control.showOne" > <div> <h6> ...

javascriptangularjscontroller

Unpredictable assortment of words selected from an array

I am struggling to create a JavaScript code that can select a random string of text from an array. I have attempted the following code, but it doesn't seem to work. Any assistance would be greatly appreciated. Just to clarify, this is intended for a w ...

javascriptarrays

Django displaying GET method as Forbidden 403 error

Currently, I am attempting to utilize AJAX to send form data to an application. Here is the Javascript section: function submit_changes() { var all_data = [A_list, B_list, C_list] $.ajax({ type: "POST", url: "/my_url/", contentType: "applicat ...

javascriptpythondjangomongodbdjango-mongodb-engine

No content was retrieved during the rendering process; attempting to redirect to the main page

I'm currently tackling a project for school using react, and I've encountered some challenges with redirecting to a different page. I've incorporated react-router-dom for navigation in my project. In the code snippet, I attempt to redirect t ...

javascriptreactjsreact-routerjsx

Error in NodeJS when trying to run ESM: "ReferenceError: exports is not defined

Having a tough time with this task. I'm attempting to execute ESM scripts on Node 14 (AWS Lambda) I am working on running this piece of code to convert 3D objects to THREE JSON. This involves using the command node -r esm fbx2three.js model.fbx. I ...

javascriptnode.jstypescriptcommonjsclaudiajs

Exiting callback function in JavaScript

Is there a way to retrieve the return value from within a node.js/javascript callback function? function get_logs(){ User_Log.findOne({userId:req.user._id}, function(err, userlogs){ if(err) throw err; if(userlogs){ ...

javascriptnode.js

Apache conf file configured with CSP not functioning properly when serving PHP files

While configuring the Apache CSP lockdown for a site, I encountered an unusual behavior when opening the same file as a PHP script compared to opening it as an HTML file. The HTML file looks like this: <html> <head> <meta http-equiv= ...

javascriptphphtmlapache

Unveil the modules of a Node.js NPM application

I have a Node application that is used as an npm module and serves as a dependency in the package.json file of another Node application. This application needs to grant access to internal modules to the app utilizing my package as a dependency. All these m ...

javascriptnode.jsmodulenpm

Comparing values in React Redux state using hooks

Recently, I developed a table component using hooks that makes an API call to the backend every time the page loads. While waiting for a response from the API, a loading spinner is displayed. The state management is handled with redux, so when a response i ...

javascriptreactjsreact-reduxreact-hooksreact-state-management

Place the text within the contenteditable body of a frame at the specific caret position

Within my iframe object, there is a contenteditable body. I am trying to paste text or HTML elements at the caret position. However, when I attempted this code snippet, I encountered an error message saying Cannot read property 'createRange' of u ...

javascriptjqueryhtmlcontenteditable

Set the array back to its initial value of 1 using jQuery and

After making substantial edits to this question, I find myself in need of a reset button for the code. The current item needs to be reset back to 1 so that I can use it again, but the issue lies in the fact that only the current item is reset while the hig ...

javascriptjqueryarrays

Attempted to utilize zipstatic but received no feedback

I attempted to utilize the Zipstatic API with jQuery in my code, as shown below. However, I am not receiving any response. Could there be something missing? jQuery(function() { jQuery("#form").hide(); jQuery("#postcode").keyup(function() { var c ...

javascriptjquery

Component fails to update when state updated using useState()

In my current project, I am facing an issue with a parent (App) and child (MUIDatatable) component setup. The child component is a datatable that requires a columns prop to define the structure of the columns, including a custom render function for one of ...

javascriptreactjsecmascript-6mui-datatable

Is there a way to use a component in two separate stack navigator screens without losing their distinctiveness?

Suppose we have the following scenario: <Stack.Screen name="Home" component={BottomTab} options = {{title:'Home', headerShown: false}} /> <Stack.Screen name = 'Create' component={BottomTab} option ...

javascriptreact-native

Get the npm distribution package without the need to actually install npm

Is there a way to obtain an npm package without the need for running npm view XXX ... or installing node/npm? Specifically, I am attempting this process on a Linux operating system. ~UPDATE~ I now understand that I should have provided more details about ...

javascriptnode.jsnpm

What is causing the counter to appear twice in the console with varying values?

Recently, I was exploring the React 'ref' feature and decided to experiment with the code snippet below. import { useEffect } from "react"; import { useRef } from "react"; import { useState } from "react"; const But ...

javascriptreactjsreact-hooks

What is the process for utilizing a custom plugin within the <script setup> section of Vue 3?

//CustomPlugin.js const generateRandomValue = (min, max) => { min = Math.ceil(min); max = Math.floor(max); const random = Math.floor(Math.random() * (max - min + 1)) + min; console.log(random); }; export default { install(Vue) { Vue.conf ...

javascriptvue.jsvuejs3

Can a module factory be invoked from a different JavaScript file?

I have two separate javascript files and I am trying to retrieve one from another. To achieve this, I have created a Module factory as shown below; var module = angular.module('test',[]); module.factory('$result', function() { va ...

javascriptangularjs

The request to the specified URL using EJS and Nodejs returned a 400 (Bad Request) status code, indicating an error

New to using socket.io and in need of assistance. Below is the node server code that I am working with: var express = require("express"); var app = express(); var http = require("http").createServer(app); var socketIO = require("s ...

javascriptnode.jssocket.ioejs

What is the process for implementing a click event and accessing the DOM within an iframe using react-frame-component?

I am working on using the react-frame-component to create an iframe. I am trying to bind a click event on the iframe and retrieve the DOM element with the id of "abc" inside the iframe. Can anyone guide me on how to achieve this? The code snippet provided ...

javascriptreactjsiframereact-component