My JavaScript code is not triggering during the page load. Could this be related to .net

I've been attempting to trigger a JavaScript function upon the refresh of an update panel, but for some reason it's not working. Oddly enough, I'm using the same approach that has worked for other functions.

In C#, this is what I have in the page load event:

ScriptManager.RegisterStartupScript(
            UpdatePanel1,
            this.GetType(),
            "Modify Map",
            "modifyMap();",
            true);

This is the JavaScript function:

function modifyMap() {
        alert(1);
        //To change the map size if the user is viewing the site on a mobile.
        if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
            //Change width/height of map.

            //Change the width of the wrapper to 100% of the screen.
           document.getElementById('wrapper-div').style.width = "100%";
            //Set the map to fill the wrapper.
            document.getElementById('canvasMap').style.width = "100%";
            //Set the height of the map.
            document.getElementById('canvasMap').style.height = "500px";
        }

    }

If anyone can provide assistance, it would be greatly appreciated.

Thank you,

Callum

javascript.net

Answer №1

To implement an onload event, you can simply add the following code:

 window.onload = modifyMap;

Avoid placing it inside a function. It's best practice to include it right before the closing </script> tag.

Alternatively, you can attach the onload event to an HTML tag.

<body onload="modifyMap()">

Answer №2

It is recommended to attempt registering the script during the PreRender event, and consider changing the key name without any spaces.

protected void Page_PreRender(object sender, EventArgs e)
{
 ScriptManager.RegisterStartupScript(
                  UpdatePanel1,
                   this.GetType(),
                   "ChangeMapKey",
                   "modifyMap();",
                   true);
}

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

Methods for dynamically altering the background color of a parent component from a child component

Currently, I am working on a T-shirt design application using fabric.js within reactjs. I have encountered an issue when attempting to change the color of the t-shirt. My goal is to allow the color of the T-shirt to be changed from the child component but ...

javascriptreactjsnext.js

ReactJS is giving me an error message: "Uncaught TypeError: Unable to access property 'ownerDocument' since it is null."

Trying to create a bar chart using D3 and render it with React's render method. Below is my index.js file: import React from 'react'; import ReactDOM from 'react-dom'; import './Styles/index.css'; import BarChart from &a ...

javascriptreactjsd3.jswebpackwebpack-dev-server

The Express application encounters a 500 Internal Server Error due to a TypeError where the Object #<EventEmitter> does not contain the method 'hr

The staging instance of my webapp is encountering an issue: Express 500 TypeError: Object #<EventEmitter> has no method 'hrtime' at Object.logger [as handle] (F:\approot\node_modules\express\node_modules\connect ...

javascriptnode.jsexpress

Verify whether a certain key exists within the gun.js file

Suppose I need to verify whether a specific entry exists in the database before adding it. I attempted the following: gun.get('demograph').once((data, key) => { console.log("realtime updates 1:", data); }); However, I only receive ...

javascriptnode.jsjsondatabasegun

Error SCRIPT1002 was encountered in the vendor.js file while using Angular 8 on Internet Explorer 11

Having trouble getting Angular to function properly in IE 11. I've tried all the solutions I could find online. The errors I'm encountering are as follows: SCRIPT1002: Syntax error File: vendor.js, Line: 110874, Column: 40 At line 110874 args[ ...

javascriptangulartypescriptecmascript-6internet-explorer-11

Tips for making a range slider in react-native

Check out my range slider I'm having trouble with changing values by clicking on them. Is there a way to enable sliding the range slider instead? Thanks for any help. ...

javascriptreactjsreact-native

Using jQuery's ajax function to send data with a variable name of data field

I am trying to figure out how to dynamically add a variable to the name of the data field I want to send information to through ajax. Below is an example of the code I'm working on: var qty = $('#qty_'+value).val(); $.ajax({ url: &apo ...

javascriptjqueryajax

Tips for extracting valuable insights from console.log()

I'm currently utilizing OpenLayers and jQuery to map out a GeoJson file containing various features and their properties. My objective is to extract the list of properties associated with a specific feature called "my_feature". In an attempt to achi ...

javascriptjqueryopenlayers

Ways to alert user prior to exiting page without initiating a redirect

I have a feature on my website where users can create and edit posts. I want to notify them before leaving the page in these sections. Here's how I can accomplish that: //Add warning only if user is on a New or Edit page if(window.location.href.index ...

javascriptjquery

Unable to make getJSON function properly with CodeIgniter

I'm experimenting with using getJSON to retrieve the most recent data from my database. So far, I've stored it in an array and used json_encode(the array). This method successfully displays the information on the view, but the problem lies in the ...

javascriptajaxjsoncodeigniter

Changing Images with Button Click in Javascript

I am facing an issue with my buttons that should swap images once clicked. The first two buttons work perfectly, but for the third and fourth buttons, the images do not disappear when clicking another button. Below is the current code in the document head ...

javascripthtmlimagebutton

Nodejs and express authentication feature enables users to securely access their accounts by verifying their identity before they

I am currently working on a straightforward registration page that needs to save user input (name, email, password) into a database. My tools for this task are express and node. What I am experimenting with is consolidating all the database operations (suc ...

javascriptmysqlnode.jsexpress

Storing data using angular-file-upload

In my application, I am utilizing the "angular-file-upload" library to save a file. Here is the code snippet that I am using: $scope.submitForm = function(valid, commit, file) { file.upload = Upload.upload({ url: '/tmp', data ...

javascriptangularjs

What could be causing the lack of population in ngRepeat?

In my angular application, I encountered an issue with ngRepeat not populating, even though the connected collection contains the correct data. The process involves sending an http get request to a node server to retrieve data, iterating over the server&a ...

javascriptangularjshtml

Storing and updating object property values dynamically within a for...in loop in JavaScript

I am currently working on a Node application powered by express and I am looking to properly handle apostrophes within the incoming request body properties. However, I am not entirely convinced that my current approach is the most efficient solution. expo ...

javascriptnode.jsexpress

jQuery AJAX chained together using promises

In my current project, I am facing an issue where I have 4 get requests being fired simultaneously. Due to using fade effects and the asynchronous nature of these requests, there are times when empty data is received intermittently. To address this issue, ...

javascriptjqueryajax

DataAnnotations: Validating multiple levels of object hierarchy recursively

My object graph is filled with DataAnnotation attributes, where properties of objects are classes that also have validation attributes, creating a chain. In this specific instance: public class Employee { [Required] public string Name { get; set; ...

c#.netvalidationrecursiondata-annotations

Implementing a hamburger menu and social media sharing buttons on websites

Currently working on my personal website and delving into the world of Web Development, I have some inquiries for seasoned developers. My first query revolves around incorporating a hamburger menu onto my site for easy navigation to other pages. After att ...

javascripthtmlcsswebhamburger-menu

I am unsure how this type of jQuery AJAX data : () will be interpreted

I'm not a beginner nor an expert in jQuery. I'm modifying a jQuery code for opencard checkout section. There is a Javascript file in this section that sends data to the server. I came across an AJAX request with data structured like this: url: ...

javascriptjqueryajaxopencart

Using a function as a parameter in Typescript: Anticipated no arguments, received 1.ts

I'm encountering an issue when trying to pass the doSomething function into performAction. The error message I'm receiving is Expected 0 arguments, but got 1 interface SomeInterface { name: string, id: string } function doSomethingFunction( ...

javascripttypescript