Issues with opening popup windows during a row command operation

I am facing an issue with an ajaxcontrol that contains a tab panel and a grid view with LinkButtons. My goal is to open a new window when clicking the LinkButton, but instead of triggering a postback, I get redirected to the first panel in the tab control.

<ajaxcontrol:TabPanel ID="TabPnlDependents" runat="server">
<HeaderTemplate>
Dependents
</HeaderTemplate>
<ContentTemplate>
  <table>
        <tr>
            <td>
                 <asp:GridView ID="DependentsGridView" DataSourceID="SqlDependentsGridView" AutoGenerateColumns="false" runat="server" DataKeyNames="PerId,PersonId" OnRowCommand="DependentsGridView_RowCommand">
                    <Columns>
                         <asp:TemplateField HeaderText="Dependent ID">
                             <ItemTemplate>
                                     <asp:LinkButton runat="server" ID="BtnDepenedentForm" Text='<%# Bind("PersonId") %>' CommandName="OpenDependentForm" CommandArgument='<%# DataBinder.Eval(Container,"RowIndex") %>' />
                             </ItemTemplate>
                          </asp:TemplateField>
                          <asp:BoundField DataField="FullName" HeaderText="Name" />
                          <asp:BoundField DataField="Gender" HeaderText="Gender" />
                         <asp:BoundField DataField="RelationToMain" HeaderText="Relation" />
                   </Columns>
                </asp:GridView>
            </td>
       </tr>
   </table>

The code behind for handling the LinkButton Row Command event is as follows:

protected void DependentsGridView_RowCommand(object sender, GridViewCommandEventArgs e)
        {
            if (e.CommandName == "OpenDependentForm")
            {
                int index = Int32.Parse(e.CommandArgument.ToString());
                GridViewRow SelectedRow = DependentsGridView.Rows[index];

                String RefId = DependentsGridView.DataKeys[index].Values[0].ToString();
                String DependentId = DependentsGridView.DataKeys[index].Values[1].ToString();

                string url = "DependentForm.aspx?DependentId=" + DependentId + "&PerId=" + PerId;
                string script = "window.open('" + url + "', 'popup_window1','width=700, height=700, left=50, top=100, resizable=yes');";
                this.Page.ClientScript.RegisterClientScriptBlock(this.Page.GetType(), "script", script, true);
            }
        }

Despite successfully opening the url directly on my page, I continue to face the redirect issue when using the LinkButton.

Answer №1

If you want to create a link using an Itemtemplate, you can easily add a javascript onclick event to launch your popup without needing a postback.

To prevent the postback, you may need to include event.preventDefault() right after opening the window.

Here's an example:

<asp:LinkButton id="BtnDepenedentForm" runat="server" onClientClick="window.open('DependentForm.aspx?DependentId=<%# Bind("PersonId") %>&PerId=<%# Bind("PersonId") %>');event.preventDefault();" ....

Answer №2

Using the MainMeasure variable, a URL string is created for the MU2DashboardDetail.aspx page. This URL is then used in a JavaScript function to open a popup window with specific dimensions and properties. The script is registered using ScriptManager in the current context.

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

Both IE and Firefox exhibit erratic behavior when updating the location.hash during the scroll event

In my current project, I am experiencing difficulties updating the location.hash based on which div is currently active in a website with long scrolling. Surprisingly, this functionality works perfectly in Chrome, but fails to work in Firefox and IE. I h ...

Ensure that the main div remains centered on the page even when the window size is adjusted

Here is the code snippet: <div id="root"> <div id="child1">xxxx</div> <div id="child2">yyyy</div> </div> CSS : #root{ width: 86%; margin: 0 auto; } #root div { width: 50%; float: left; border: ...

In order to display the particle-slider logo effect, the JavaScript on the page needs to be refreshed

I have a website frontend integrated from WordPress using an HTML 5 Blank Child Theme. The site features a logo effect utilizing particle slider for screen sizes greater than 960px, and a flat logo image for screen sizes less than 960px. Everything works p ...

Leveraging the power of Express.js, transmit local data alongside a

Why can't I display the active user in my view using plain HTML when console log shows it? Here is the code snippet: app.post('/', function (req, res) { var user = { user : req.body.username }; res.render('doctor_hagfish/pets&ap ...

Resharper fails to recognize namespace alias in web.config file

I have a configuration entry in my web.config file for my ASP.NET WebApplication that looks like this: <pages controlRenderingCompatibilityVersion="3.5" clientIDMode="Static"> <namespaces> <add namespace="XSS=Microsoft.Security. ...

Modifying two distinct charts according to the choices made in two independent dropdown menus

In my current project, I am facing a challenge with integrating two separate dropdowns containing UFC fighter names. The goal is to display a plot showing the KD (Knockdown) data for the selected fighters over time when their names are chosen from both dro ...

Using a custom module in node.js to retrieve data from a mysql database

How can I retrieve select query results? I am currently getting empty or null responses. Despite attempting callback logic and using the callback function as suggested in some articles, I have yet to have any success. All of the code for my Custom Module ...

Tips for assigning ids to bootstrap tabs using Javascript

Currently, I am creating tabs and the corresponding tab content dynamically using JSON format. After passing the JSON data, the following code is generated: <ul class="nav-tabs"> <li class = "active"> <a href="javascript:void(0);" ...

Obtain a previously used barcode scanner from multiple connected devices

Currently, I am developing a Windows application for access control using .Net and basic Barcode readers. For my project, I want to incorporate two barcode readers that are installed on the same computer but in different USB ports. The first reader will ...

Ways to extract values from a JSON output using comparisons

I am dealing with a JSON data structure that contains information about various teams. My task is to compare the values in the teams array with the values stored in html_content.position[i]. In this comparison, the index i needs to be dynamically set withi ...

Issue: Unable to access 'error' property of undefined in React Chrome Extension

Currently, I am in the process of developing a React Chrome Extension utilizing the React-Chrome-Redux library This is my first time working with this library and I have encountered an error that has me stumped. When running my popup app, I am encounteri ...

access the content of a div element by its class attribute

Within the div element, a value has been set and I am attempting to retrieve this value using its class. However, the code below does not return the desired value. What mistake am I making here? How can I resolve this issue? <div title="Find on Amazo ...

The JSON array is causing the statement to not compile

I am working with a Json array structured like this: Test = [ { "adj" : [ { "nodeTo" : "x", "nodeFrom" : "y", "data": { "$type" ...

What is the best way to integrate the each_slice method in Rails views with React components

In my Parent component Monsters, I am rendering the Monster component. for each monster in @state.monsters React.createElement Monster, key: monster.id, monster: monster, team: @state.team... Within the monster: div className: 'col-md-4' ...

MERN: When evaluating 'this.props.params.id', a TypeError occurs due to undefined not being an object

Currently, I am diving into the world of MERN development utilizing the book 'Pro MERN Stack' by Vasan Subramanian as my guide. The content in the book is insightful; however, since it was published two years ago, some of the code examples are no ...

Finding Corresponding Values in an Array with JavaScript

I am working with an array of objects that have a specific format: [ { "card_details": { "cardType": "gift" }, "merchant_details": { "merchantName": "Walter Heisenberg1", "timeZone": "+05:30", } }, { "card_detai ...

What is the reason for the vertex shader failing to compile?

Recently diving into the world of WebGl, I decided to experiment with a simple example. Here is how I set up my script: Here's my setup script import testVertexShader from './shaders/test/vertex.glsl' import testFragmentShader from './ ...

I am looking to display the <AddProduct /> element within the main-content div of a different component called Dashboard

import { useState,useEffect } from 'react'; import './App.css'; import Header from './Components/Header/Header'; import { BrowserRouter as Router, Route ,Routes} from 'react-router-dom'; import Pages from './Pag ...

Getting a jquery lightbox up and running

After experimenting with three different jquery plugins in an attempt to create a lightbox that appears when clicking on a link containing an image, I am currently testing out this one: . Despite adding the plugin source in the head and ensuring that the l ...

Troubleshooting AJAX Problems in ASP.NET and C#

I am currently working on implementing a WebMethod call in my C# code behind using AJAX. I have a Bootstrap Modal that should be displayed when a linkbutton is clicked, triggering the execution of the WebMethod through AJAX to populate a table in the modal ...