Incorporating JavaScript into ASP.NET web controls

I am currently working on an ASP.NET webforms application and I've encountered an issue with injecting a script into the page from a web control. The script is located in the same folder as the control:

Here is a screenshot showcasing the issue

My approach so far has been:

[ToolboxData("<{0}:MyWebControl runat=server></{0}:MyWebControl>")]
[System.Drawing.ToolboxBitmap(typeof(MyWebControl))]
public class MyWebControl : Image
{

    //...

    protected override void OnPreRender(EventArgs e)
    {
        base.OnPreRender(e);

        string scriptStr = "<script src=\"my_script.js\" type=\"text/javascript\">";
        ClientScriptManager csm = Page.ClientScript;
        csm.RegisterClientScriptBlock(this.Page.GetType(), "MyScriptTag", scriptStr);

        //...
    }

}

Upon checking if the script was successfully injected, Chrome displayed this error:

Screenshot showing the error message

I suspect that the issue lies within script src=\"my_script.js\", even after attempting to change the path multiple times without success.

Your assistance in resolving this matter would be greatly appreciated. Thank you!

Answer №1

Ensure that the path to the javascript file is relative to the page where the user control is being displayed. If the user control is loaded by your index.html in your web project, create a Scripts directory within the project and relocate the javascript file there. Update the src attribute to be:

src=\"/Scripts/my_script.js\"

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

Building a React JS application that allows users to easily upload multiple files

I have built a button component in React.js that allows users to upload multiple files to the application. However, I am facing an issue where only one file can be uploaded at a time using the current code implementation: const handleClick = event => ...

Retrieving the event name from a CustomEvent instance

Looking to retrieve the name of a CustomEvent parameter in a function, which is basically the string it was created with (new CustomEvent('foo')) If you need a reference, check out https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent ...

Is there a way to activate a freshly duplicated Bootstrap select field?

I am attempting to duplicate a bootstrap select field and immediately open the duplicate. The following code toggles the original select field. $('.selectpicker').selectpicker("toggle"); However, when I try to toggle the duplicated field, it i ...

Comparing dates with Firestore timestamp in queries using TypeScript: A comprehensive guide

I have been struggling with comparing dates from my calendar app to dates stored in Firestore. The issue arises because Firestore returns timestamps, and I need to compare them to regular Date objects. Is there a workaround for this problem? Can something ...

Flow for requesting passport breaks in federated accounts

While using a basic Google Tutorial app, I came across an issue where if a user successfully authenticates with Google and then my app cancels the login process (for example, because the user was not found in the database), the Passport flow breaks. The me ...

Tips for transferring a file to PocketBase using NodeJs

Currently, I am in the midst of a project that necessitates uploading numerous PDF files to a PocketBase collection. All the necessary files are saved on my computer and my goal is to upload them using nodejs along with the PocketBase JavaScript SDK. Howe ...

Launching a Material-UI dialog box from a higher-level Header component

I have a setup where the header component is separate from the Register dialog modal component, functioning as parent and child components. My goal is to trigger the Register dialog (child) from the headerlink component (parent) Here is the code for my he ...

Utilize jQuery to convert text to lowercase before adding Capitalize CSS styling

I have encountered a situation where I need to change the HTML link values from UPPERCASE to LOWERCASE and then apply a capitalization style. The problem lies in the fact that the links arrive in uppercase, so I had to come up with a workaround: The given ...

Guide to surrounding each letter in a user-entered string with div elements

I am currently working on a small web app that allows users to input text. The goal is to have the app parse EACH LETTER entered by the user, creating a new div for each character (even spaces). Although the code is functional, I am facing an issue with s ...

Obtain the value of a promise in AngularJS without accessing its internal properties

Hey there, I have another question about promises. I'm trying to fetch data from an endpoint and use it in ng-repeat. Here is the standard response from the endpoint: {"ebbe5704-4ea5-470e-8ab9-102ee8ca457f":"Foo", "e380a6f7-2f88-46bb-bd54-2517193536 ...

What is the best method for incorporating headers and custom server-side .js in an express.js / node.js application?

Recently, I've been working on developing a data-driven HTML site specifically tailored for developers at our company. The main concept involves setting up a server using node.js v0.12+ / express v4+ to handle various functions for accessing a large d ...

refresh the information in the intersection table

Choosing between ASP.Net Core and MySQL In my database, the Student table and Course table are connected through the junction table called StudentCourse: Student StudentCourse Course ========= ============ ======= PK | ID FK | St ...

What could be causing the ReferenceError when the Response object is not defined?

I am currently working on node.js and express. After attempting to establish a simple server, I am encountering an unexpected response error. const http = require('http'); const myServer = http.createServer(function(req, res){ res.writeHead ...

Determine the text's length inside a div element by utilizing the div itself

I have a div with a fixed width of 30% and I am trying to find the length of the text within that div. Check out my JSFiddle for the code. The current code snippet I am using is: var text=$('#test').text(); text=text.trim(); var len=text.lengt ...

You must include an argument for 'model' in the Angular service

My service requires an id parameter for a route, but when I tried to access the route with the id, I encountered the error mentioned above. Any suggestions on how to resolve this issue? https://i.sstatic.net/FEcqo.png #request const apiBaseUrl = `${envir ...

Implementing serverside pagination using Datatable in Javascript: Passing POST request body data

Attempting to incorporate ServerSide pagination using Datatable for AJAX POST request The Javascript Code snippet below showcases the issue faced when utilizing JSON.stringify for data field, causing the API not to be triggered. $('#tripboard_table&a ...

Ways to display various components when a button is clicked

I need to dynamically load different components based on button clicks in my UI using React, but I am unsure of the best approach. In the past, I used a ternary operator for two components, but now I have more than two and that method no longer works for ...

Cursor-hugging tooltip

My tooltip creation works when hovering over an icon, but there's a slight issue - it doesn't always follow the cursor and can get stuck at times. To see a demo of this in action, click here: fiddle Here's the code I'm using: HTML & ...

Generate a list using the result of a function within a loop

I am trying to extract the positions of "they" and "some" in all occurrences within the array split_Sentence using a for loop. After that, I aim to create an array based on the results of the for loop. However, the issue is that when I use indexOf() to fin ...

Ways to confirm the validation of radio buttons in a form and implement CSS

I am having trouble adding validation to a form with radio buttons displayed as labels. I want to show a red border around the radios/labels or outer div when a radio button hasn't been checked before the user submits the form. I have attempted this ...