After executing window.open(), the ListBox becomes inaccessible

Within the Page_Load() function, I am adding the following JavaScript:

var scriptReihe = "<script type=\"text/javascript\">function OnClientLoadHandlerReihe(sender) {"
                     + "var listbox = $find(\"" + lbReihen.ClientID + "\");"
                     + "var item = listbox.get_selectedItem();"
                     + "item.ensureVisible();"
                     + "}"
                     + "</script>";

Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "OnClientLoadHandlerReihe", scriptReihe);
lbReihen.OnClientLoad = "OnClientLoadHandlerReihe";

The variable lbReihen represents a control of type RadListBox.

This script works perfectly as intended, ensuring that the selected item in the ListBox is visible.

In addition to the ListBox, there is also a button on the page:

<asp:Button ID="myBtn" runat="server" Text="Call google" OnClientClick="window.open('http://www.google.ch', '_blank');" />

However, an issue arises when this button is clicked and a new tab containing Google is opened. After this action, the ListBox becomes unresponsive, making it impossible to scroll or interact with it.

If I remove the EventHandler registration for OnClientLoad, everything functions correctly again.

Could someone offer some guidance on what might be causing this issue? Any help would be appreciated - thank you.

Answer №1

It's important to ensure that you register the script with each postback to avoid script errors when using a button declaration that triggers a postback on your main page. If the script is not registered correctly, you may encounter issues with scrolling to specific items. One way to address this is by including the script block in the markup and using server code blocks to access the listbox ID:


        <telerik:RadListBox ID="lbItems" runat="server"></telerik:RadListBox>
        <telerik:RadCodeBlock runat="server" ID="RadCodeBlock2">
            <script type="text/javascript">
                function OnClientLoadHandlerItem(sender) {
                    var listBox = $find("<%=lbItems.ClientID%>");
                    var selectedItem = listBox.get_selectedItem();
                    selectedItem.ensureVisible();
                }
            </script>
        </telerik:RadCodeBlock>

In addition, consider preventing the button postback by using "return false" in the OnClientClick event:

<asp:Button ID="myButton" runat="server" Text="Open website" OnClientClick="window.open('http://www.example.com', '_blank'); return false;" />

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

The exceptional speed of jQuery's each method sets it apart

I'm currently facing an issue where I am unable to successfully add the attribute data-size to my parent div. My code snippet is as follows: var width, height; $(".galerie img").each(function() { width = this.naturalWidth; height = this.naturalH ...

AngularFire Google OAuth failing to retrieve the user's email address

I am trying to retrieve the email address from Google OAuth using AngularFire, but the popup is not requesting permission for the email. This code snippet is from the Firebase Google authentication documentation var ref = new Firebase("https://<your-f ...

Steps to integrate AngularJS 2 into an already existing Java Web project

Having experience with AngularJS 1.x in a .Net MVC application, I successfully downloaded all the required AngularJS min files and included them in the project without using npm or bower. Now, I am working on a Java Web application that utilizes servlets/j ...

Is HTML5 Device Orientation the answer to a dependable compass system?

I am currently developing a project for mobile web that requires access to the compass direction of the user's device. At the moment, my code is quite basic, but here is what I have: var updateDirection = function (evt) { $("#dire ...

encountering difficulty while performing calculations within an HTML table

In my dynamic HTML table, I generate a tbody element upon changing the selected option. Within this table, there are 3 input fields: ItemName, which uses jQuery UI autocomplete to populate corresponding data from JSON format. The user then moves on to th ...

Breaking down a string using JavaScript

Is there a way to shorten the following code? It currently works for me, but it seems quite long-winded. var str = "some title of an event here, weekday 17:00&nbsp;&ndash;&nbsp;18:00 o’clock, with name of a person"; var date = str.split(&apo ...

I don't understand this comet concept

protected void Page_Load(object sender, EventArgs e) { Response.Buffer = false; while (true) { Response.Write(Delimiter + DateTime.Now.ToString("HH:mm:ss.FFF")); Response.Flush(); // The thread is paused for half a sec ...

Displaying all hidden sections on a website

I'm trying to figure out if there's a way to expand all the collapsible sections on a webpage at once. One section that is relevant to my search looks like this: <tr> <td></td> <td style="..;"> <div s ...

Enhancing Your WordPress Menu with Customized Spans

I have a WordPress menu structured like this: <div id="my_custom_class"> <ul class="my_custom_class"> <li class="page_item"><a href="#">page_item</a> <ul class='children'> <li class="page_item chil ...

How can I use JavaScript to show a div upon clicking an input element?

I am looking to make a block div visible when an input field is clicked. <input class="indifferent" type="radio" name="decision" value="indifferent"> Indifferent </br> <div class="input" style="display: none;"> Please assist with our com ...

The method xxx is not defined within my ViewModel

Why am I encountering an error Uncaught TypeError: this.createRow is not a function when constructing the matrixLengthsAvailable array? The createRow function is defined at the end of my viewmodel... function TabBuyHarvesterModel() { self = this; ...

Sorting through an array of objects nested within another array of objects

I'm currently working on a MERN app where I retrieve all albums using axios. This is the structure of the data: [ { title: "", artist: "", reviews: [ { username: "", comment: "", }, { ...

Could it be possible that my consecutive POST and GET axios requests are gradually slowing down?

After chaining the POST and GET calls in my code, I noticed a slight slowdown and was curious if this is normal or if there's a more efficient approach. The delay in displaying the google map marker made me think that pushing the newly created marker ...

Karma is reporting an error with TypeScript, saying it cannot locate the variable 'exports'

Currently, I am in the process of mastering how to write Unit Test cases for an angular project coded in Typescript. To facilitate this, I have opted for utilizing Karma and Mocha. Below lays out the structure of the application: Project/ ├── app/ ...

Angular-in-memory-web-api experiencing multiple collection errors with Error 404

I'm currently utilizing the angular-in-memory-web-api module to simulate server responses. Here is the implementation of in-memory-data.service.ts import { Injectable } from '@angular/core'; import { InMemoryDbService } from 'angular-i ...

I'm curious about the purpose of the "^=" operator in this algorithm for finding the unpaired numbers. What exactly does it do?

I came across a fascinating code snippet that helps find a unique number in a list of duplicate numbers (where each number appears twice, except for one). function findNonPaired(listOfNumbers) { let nonPairedNumber = 0 listOfNumbers.forEach((n) => ...

determine if the req.params parameter is void on an express route

Hi everyone, I'm a beginner with node and express and could really use some guidance. I am currently attempting to create a get request that checks if the req.params.address_line is empty, and then performs an action based on that condition. However, ...

Having trouble loading a model converted from FBX to JSON using THREE.JSONLoader

I recently converted an FBX model to JSON using a Python script called convert-to-threejs.py. However, I am encountering issues trying to load it into three.js (r58). An error message stating "Uncaught TypeError: Cannot read property 'length' of ...

Initiating a GET request to retrieve the file generated by the server

I am currently delving into the Mean stack and have encountered a challenge with downloading a file from my server-side application using the Angular front end. Despite successfully generating the file on the back end, clicking the download button on the f ...

ResponseXML in AJAXBindingUtil

I'm having an issue with the responseXML in my AJAX code. Here is an excerpt from my callback function: var lineString = responseXML.getElementsByTagName('linestring')[0].firstChild.nodeValue; The problem I'm facing is that the linest ...