The PopupControlExtender in ajaxToolkit seems to be malfunctioning when used with a textbox that has Tinymce

I recently built a website using ASP.NET, and I have a feature where a small tooltip appears on the right side of a text box when the user focuses on it. To achieve this, I am using the ajaxToolkit:PopupControlExtender in my code.

        <asp:TextBox ID="txtTest" runat="server" Width="100%" TextMode="MultiLine" Rows="5" AutoComplete="off" ClientIDMode="Static" MaxLength="6000" class="tinymce"></asp:TextBox><br />
        <ajaxToolkit:PopupControlExtender runat="server" TargetControlID="txtTest" PopupControlID="tipCity" Position="Right"></ajaxToolkit:PopupControlExtender>

Everything was working smoothly until I integrated a text editor called tinymce with the textbox. After applying tinymce, the PopupControlExtender stopped displaying the tooltip message.

Below is the code snippet I used to include tinymce in my project.

<script src="//tinymce.cachefly.net/4.2/tinymce.min.js"></script>
    <script type="text/javascript">
        tinymce.init({
            resize: true,
            mode: "specific_textareas",
            editor_selector: "tinymce",
            encoding: "xml",
            theme: "modern",
            plugins: [
             "advlist lists link preview",
             "searchreplace",
             "directionality"
            ],
            toolbar1: "bold italic underline | bullist numlist outdent indent | link | preview",
            menubar: false,
            statusbar: true,


            setup: function (editor) {
                editor.on('SaveContent', function (ed) {
                    ed.content = ed.content.replace(/&#39/g, "&apos");
                });
            }
        });

Can anyone help me solve this issue?

javascriptasp.nettinymceajaxcontroltoolkittinymce-4

Answer №1

Give this code a shot:

var requestManager = Sys.WebForms.PageRequestManager.getInstance();

requestManager.add_beginRequest(UpdateRequestHandler);

function UpdateRequestHandler(sender, args) {
    tinymce.execCommand('mceRemoveEditor', true, 'textarea_id');
}

requestManager.add_pageLoaded(function (sender, e) {
    InitializeTinyMCE();
});

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

I'm facing issues with the angular-stl-model-viewer in my current Angular project

I recently attempted to incorporate an stl-viewer into my Angular project using the npm package angular-stl-model-viewer and managed to install all necessary dependencies without any issues. However, I encountered a problem where the viewer is not displayi ...

javascriptangulartypescriptthree.jsstl

Discovering the Value of TD when Clicked in MVC

I have been struggling to extract a value or string from a td in a table, but none of the clickevents I've used seem to work. Here is the structure of the table: <table id="tblMain"> <thead> <tr> ... </tr> ...

javascriptjqueryasp.net-mvcasp.net-mvc-4razor

Adding Javascript and CSS files to the document dynamically

I've created a custom jQuery plugin, but I need it to verify if jQuery is already loaded. If not, I want the plugin to load jQuery along with a few other necessary JavaScript files. Additionally, I want it to check if a specific CSS file has been load ...

javascriptjquery

When using my webrtc technology, I configure my sdp to establish a recvonly direction

While attempting to make a video call using WebRTC, I encountered bugs during testing. My goal is to integrate this project into a webview for my Android app. I conducted testing using phone-pc and phone-phone scenarios. Scenario A: When the PC initialize ...

javascriptandroidhtmlnode.jswebrtc

Ways to determine if the backbone.js model has been emptied

I often find myself wondering how to determine if a model has been cleared or is empty. For example, if I set the model with: model.set({name:'this is a test', id:1}); and then clear it with: model.clear(); ...

javascriptjquerybackbone.jsunderscore.js

The functionality of Jquery datatables seems to be faulty when navigating to the second page

While utilizing the jQuery datatables plugin, I encountered an issue where the event click function only worked on the first page and not on subsequent pages. To address this problem, I discovered a helpful resource at https://datatables.net/faqs/ Q. My ...

javascriptjqueryhtmlcssdatatable

Simple integration of JSP, JSON, and AJAX

I need help testing a simple login functionality using AJAX. Here's the code snippet: <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Login Test Page</title> <script src="../js/j ...

javascriptjqueryajaxjsonjsp

Managing POST request data in Express: A step-by-step guide

Currently, I am facing an issue with my alert button on the client side, which has an event listener that is supposed to send data to the server. Below is the code snippet for the client side: alertBtn.addEventListener("click", () => { axios ...

javascriptnode.jsexpress

Extract a value from a json document

Hey there! I'm looking to create an unwhitelist command. When a user is mentioned or their ID is provided, I want it to be removed from the JSON file without checking if the ID exists. Do you have any suggestions on how to accomplish this? Here is my ...

javascriptnode.jsdiscord.js

JavaScript - Error: The '}' token was unexpected

Every time I attempt to move <div id="test">this should go down</div> downwards using: <div onclick="(".test").slideDown(800);">close it</div> I encounter an error whenever I click 'close it' SyntaxError: Unexpected to ...

javascript

Creating a custom type for accepted arguments in a Typescript method

Below is the structure of a method I have: const a = function (...args: any[]) { console.log(args); } In this function, the type of args is any[]. I am looking to create a specific type for the array of arguments accepted by this method in Typescript. ...

javascripttypescripttypescript-generics

Can you share a method in javascript that extracts href= and title values, similar to PHP's preg_match_all() function?

I received an HTML string as :var code; I am looking to retrieve all the values of href and title similar to how it is done using PHP's preg_match_all(). I have achieved a similar task in PHP with the provided example but now I am curious about how I ...

phpjavascriptjqueryregex

JavaScript encounters difficulty in reading the text file

I am working on a project where I need to read a local text file located at /home/myname/Desktop/iot/public/sensordata.txt using JavaScript when a button is clicked on a web page. Below is the code snippet I have been using: <html> <head> ...

javascript

When incorporating sequelize's belongsTo and hasOne methods, you may encounter an issue where the call stack size surpass

Within my Discussion entity, I have: Discussion.hasOne(sequelize.import('./sound'), { relations: false }) While in the Sound entity, the relationship is defined as: Sound.belongsTo(sequelize.import('./discussion')) To load t ...

javascriptnode.jssequelize.js

Checkbox paired with a read-only text column

I have a simple HTML input field with JavaScript functionality, which includes a checkbox. I am trying to write text in the input field when the checkbox is checked, and make the input field read-only when it is not checked. Can anyone provide an example ...

javascripthtmlcheckbox

Issue with Next.js's notFound() function not properly setting the 404 HTTP Header

Our decision to use Nextjs was primarily driven by the need for SSR and SEO optimization. We rely on an external REST API to fetch data on the front end, but we face challenges when trying to pre-render certain pages and display a proper 404 Not Found head ...

javascriptnext.js

Activate a monitoring pixel with a click of your mouse

I have a tracking pixel that is typically placed in the body of a "installation success" page: <img src="http://domain.com/adclick.php" width="1" height="1" border="0" /> However, I want to trigger this pixel when someone clicks on a download butto ...

phpjavascripthtml

Error: $controller does not function as a controller within another controller

I recently started learning Angular JS and attempted to call one controller within another, but encountered the following error: ionic.bundle.js:21157 TypeError: $controller is not a function at new <anonymous> (http://localhost:8080/itravel/www/js/ ...

javascriptangularjsdependency-injectionangularjs-scopeangularjs-controller

Having trouble with uploading an image in Laravel using a modal?

For my laravel inventory system, I am facing an issue with uploading images for products. The old code I used for image upload is not working in my current project where I am utilizing a modal and ajax request to save inputs in the database. Can anyone pro ...

javascriptphpjqueryajaxlaravel

Display a single specific outcome within a React component's list

import {useState, useEffect } from 'react' import axios from 'axios' const Singlecountry = ({searchedCountries, setWeather, weather}) => { const weatherName = searchedCountries[0].capital console.log(weather) useEffect(() =&g ...

javascriptreactjs