Transferring the control's identifier to JavaScript using ScriptControlDescriptor

In my CreateChildControls() method, I am creating a control:

HtmlGenericControl mycontrol= HtmlGenericControl("li");
mycontrol.ID = "controlID";

controlId = mycontrol.ID;


protected virtual IEnumerable<ScriptDescriptor> GetScriptDescriptors()
{
        ScriptControlDescriptor descriptor = new ScriptControlDescriptor("Project.TEditor", this.ClientID);                   

        descriptor.AddProperty("controlId", controlId);           
        return new ScriptDescriptor[] { descriptor };          
}

After that, when I try to access this control in JavaScript using the ID property:

 alert($get(this.get_controlId()));

I am getting null because the actual control ID has a prefix added by ASP.

Is there a way to solve this issue?

Answer №1

Consider using mycontrol.ClientID rather than mycontrol.ID when referencing on the client side:

// Within CreateChildControls method:
HtmlGenericControl mycontrol = new HtmlGenericControl("li");
mycontrol.ID = "controlID";

// After adding the control to the page (Page.Controls.Add(myControl)):
controlId = mycontrol.ClientID;

protected virtual IEnumerable<ScriptDescriptor> GetScriptDescriptors()
{
        ScriptControlDescriptor descriptor = new ScriptControlDescriptor("Project.TEditor", this.ClientID);
        
        descriptor.AddProperty("controlId", controlId);
        return new ScriptDescriptor[] { descriptor };
}

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

Executing several asynchronous functions in Angular 2

I am currently developing a mobile app and focusing on authentication. In order to display data to the user on my home page, I need to connect to various endpoints on an API that I have created. Although all endpoints return the correct data when tested i ...

Tips for successfully incorporating PHP dynamic parameters separated by commas into a JavaScript onclick function

How can I pass PHP dynamic parameters separated by commas to a JavaScript onclick function? Can someone assist me with the correct solution? The code below is not working as expected. echo "<td><a href='#' onclick='editUser(". $row ...

How do I prevent the default submission behavior in an asp:ImageButton when the user presses the enter key in ASP.NET using C#?

Whenever I attempt to use this code snippet, it doesn't seem to work properly. How can I prevent the submit behavior of an asp:ImageButton? Here is the HTML code I am working with: <td class="style101"> <asp:ImageButton ID="imgBtnPos ...

What is the reason behind the occurrence of an error when attempting to iterate through an array of objects within my react.js component?

Here is an example of some code: class Stepper extends Component { state ={ quiz_data: [ patient_data: [ {name: "A", age: "1"}, {name: "B", age: & ...

What is the best way to manage the 'content' attribute in TSX?

I'm currently developing an application that utilizes schema.org. In the code snippet below, you can see how I've implemented it: <span itemProp="priceCurrency" content="EUR">€</span> According to schema.org do ...

The system is facing difficulty in accessing the property 'user_first_name' as it is currently undefined

I'm having trouble registering a user with expressjs/mongoose as I keep receiving the error: TypeError: Cannot read property 'user_first_name' of undefined at C:\Quiz webPolitica\server.js:20:24 at Layer.handle [as handle_request] ...

PHP class initialization leads to 500 Internal Server Error

Currently, I am developing a database system to enhance our client management processes. The logic for displaying client data is functioning perfectly. The designated class responsible for handling method calls is named "kunde." Here is how I initialize ...

Exporting table data from Bootstrap 3 DataTable to Excel is not functioning as expected

I am attempting to export the data from a table to MS Excel by referring to this example: https://datatables.net/extensions/buttons/examples/styling/bootstrap.html While the content displays correctly on the page, the issue arises when I try to export it. ...

Ways to navigate to a new webpage in JavaScript without the need to click on a link

After going through various posts and trying different methods, I am still facing challenges. In a PHP page, I have an HTML form with an onClick command that triggers a JavaScript validation procedure when the user clicks a button. While everything funct ...

Is it possible to delay the postback by 3 seconds?

I am working on a usercontrol that contains multiple dropdown lists and a button. When the user clicks the button, I need it to redirect based on the selections in the dropdown lists. Instead of immediately redirecting, I would like to show a loading icon ...

In order to comply with JSX syntax rules in Gatsby.js, it is necessary to enclose adjacent elements

I want to apologize beforehand for the code quality. Every time I attempt to insert my HTML code into the Gatsby.js project on the index.js page, I encounter this error: ERROR in ./src/components/section3.js Module build failed (from ./node_modules/gatsb ...

What is the best way to organize properties within the Class Variance Authority?

Can the following be achieved in CVA? const mathPanelVariants = cva( 'relative mt-[100px] w-full rounded-sm border-l-[3px] px-[24px] py-[16px]', { variants: { variant: { theorem: { box: 'border-l-[#617bff] dark:bg-[#182 ...

Recommendation: 3 options for radio buttons on the registration form

My form includes a section where users need to choose if they want to sign up for a session that occurs 3 times daily. The catch is, only 5 applicants can enroll in each session (AM, Mid-day, PM). It's a competition to secure a spot. Here is the form ...

Incorporate a JavaScript script into an Angular 9 application

I have been experiencing issues trying to add a script.js file to angular.json and use it in one component. Adding a script tag directly to my HTML file is not the ideal solution. Can someone suggest an alternative approach or point out what I may be missi ...

Is it possible to have unique color tags in Material UI Autocomplete?

I'm currently diving into the world of material-ui and encountering some challenges that I could use help with. I am trying to incorporate multiple arrays into the autocomplete menu (e.g., options={top100Films, top100Shows}, but with the correct sy ...

Utilizing hooks to pass properties from a parent component to a child component

As someone who is new to react, I am currently facing an issue with passing props from a parent function to a child. It seems that the parameters "square_state" and "setSquare_state" are not being recognized in the useSquare or handle_square_click functi ...

leveraging the localStorage feature in a for-in iteration

I am new to stackOverflow, although I have browsed the forums for help in the past. However, this time I couldn't find a solution to my current issue, so I decided to create an account and seek assistance. The problem at hand is related to a workout ...

The functionality of jQuery's .hide method is not effective in this specific scenario

HTML section <div class="navigation-bar"></div> Jquery & JavaScript section function hideUserDiv(){ $('.ask-user').hide(); } var ask = '<div id="ask-user" style="block;position:absolute;height:auto;bottom:0;top ...

What is the reason behind assignments being completed faster than doing nothing?

class RandomObj { constructor() { this.valA = ~~(Math.random() * 255 + 0.5); this.valB = ~~(Math.random() * 300 + 0.5); } } const array1 = new Array(100000); for (var i = 0; i < 100000; i ++) { array1[i] = n ...

Dynamically loading JQuery causes highcharts to encounter errors

I have limited experience with JavaScript programming, and I've been encountering a persistent issue for quite some time now. Any assistance on this matter would be greatly appreciated. In the provided jsfiddle example, when jQuery is selected from t ...