Help: getting javascript & c# to talk together in asp.net web application

Alex

Hi all,

I'm writing a small web application which searches a database based on
a date field, and populates a datagrid control with the results. The
datagrid control has selection buttons added to it to view additional
details about the selected result (a second database query is
triggered).

I want this second query to pop up in a new window, the way it would
if I used "window.ope n" in javascript. I've added a function in the
javascript to open the new window ("newpage"), but this function does
not appear to be visible to the c# code on the asp page.

I must admit to being a little confused about the separation between
the c# code view of the asp page and the html view of the page layout
- these two things are interrelated, but there doesn't seem to be any
easy way to get them to talk to one another.

To illustrate, this is the html view of the page Query.aspx:

---

<%@ Page language="c#" Codebehind="Que ry.aspx.cs"
AutoEventWireup ="false" Inherits="Video Search.WebForm1 " %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>WebForm1 </title>
<meta name="GENERATOR " Content="Micros oft Visual Studio .NET 7.1">
<meta name="CODE_LANG UAGE" Content="C#">
<meta name="vs_defaul tClientScript" content="JavaSc ript">
<meta name="vs_target Schema"
content="http://schemas.microso ft.com/intellisense/ie5">
<script>
function newpage(string url)
{
window.open(url , 'Session Detail', 'width=400,heig ht=400,
toolbar=no');
}
</script>
</HEAD>
<body MS_POSITIONING= "GridLayout ">
<form id="Form1" method="post" runat="server">
<asp:Calendar id="Calendar1" style="Z-INDEX: 101; LEFT: 296px;
POSITION: absolute; TOP: 112px"
runat="server" Width="240px" Height="224px"> </asp:Calendar>
<asp:DataGrid id="DataGrid1" style="Z-INDEX: 106; LEFT: 56px;
POSITION: absolute; TOP: 488px"
runat="server" Width="680px" Height="280px"
HorizontalAlign ="Left" BorderColor="#9 99999" BorderStyle="So lid"
CellSpacing="2" BorderWidth="3p x" BackColor="#CCC CCC"
CellPadding="4" ForeColor="Blac k">
<SelectedItemSt yle Font-Bold="True" ForeColor="Whit e"
BackColor="#000 099"></SelectedItemSty le>
<ItemStyle BackColor="Whit e"></ItemStyle>
<HeaderStyle Font-Bold="True" ForeColor="Whit e"
BackColor="Blac k"></HeaderStyle>
<FooterStyle BackColor="#CCC CCC"></FooterStyle>
<Columns>
<asp:ButtonColu mn Text="View Session"
ButtonType="Pus hButton" CommandName="Se lect"></asp:ButtonColum n>
</Columns>
<PagerStyle HorizontalAlign ="Left" ForeColor="Blac k"
BackColor="#CCC CCC" Mode="NumericPa ges"></PagerStyle>
</asp:DataGrid>
<asp:Label id="Label2" style="Z-INDEX: 103; LEFT: 440px;
POSITION: absolute; TOP: 64px" runat="server"
Width="96px" Height="32px">T o:</asp:Label>
<asp:Label id="Label1" style="Z-INDEX: 102; LEFT: 128px;
POSITION: absolute; TOP: 72px" runat="server"
Width="96px" Height="32px">F rom:</asp:Label>
<asp:Button id="Button1" style="Z-INDEX: 104; LEFT: 320px;
POSITION: absolute; TOP: 408px" runat="server"
Width="184px" Height="40px" Text="Search!"> </asp:Button>
<asp:Label id="Label3" style="Z-INDEX: 105; LEFT: 128px;
POSITION: absolute; TOP: 24px" runat="server"
Width="280px" Height="24px">S earch for video
records:</asp:Label>
<asp:Label id="errortext" style="Z-INDEX: 107; LEFT: 88px;
POSITION: absolute; TOP: 360px"
runat="server" Width="624px" Height="38px"></asp:Label>
</form>
</body>
</HTML>

This is the button handler event for the selection buttons in the data
grid, which is in Query.aspx.cs:

private void DataGrid1_Selec tedIndexChanged (object sender,
System.EventArg s e)
{
DataGridItem sel = DataGrid1.Selec tedItem;

string segmentid = sel.Cells[2].Text;

newpage("Search Results.aspx?se g=" + segmentid);
}
---
Can I access the javascript function "newpage" from the c# source like
this?
Is there a better way to do this?

Any help would be greatly appreciated.

Cheers,
Alex.
Remove ernie and bert from email address to reply.

Nov 18 '05 #1

Subscribe Reply

2841

Tommy

In an ASP.NET application, JavaScript runs on the client-side, and C#
runs on the server side. They are executed under a different tier and
runtime, so they cannot call into each other's method.

If I understand correct, you current have a datagrid that looks like
this:

---------------------------------------
|Data column|Data column|Button column|
---------------------------------------
|Some data |Some data |Detail button|
|Some data |Some data |Detail button|
|Some data |Some data |Detail button|

I would suggest making the "Detail button" an HTML button. Set the
HTML button's client-side onclick event to call the "NewPage"
javascript function. This way when the user click on the button, the
javascript will open a new window with the detail information. All
this happen without making a roundtrip back to the server.

To change the "Detail button" to an HTML button, don't use the
<asp:ButtonColu mn, create an empty column, and create an HTML button
in it.

<input type="button" ...

To set the client-side onclick event to call your javascript function:

.... onclick="NewPag e("SearchResult s.aspx?seg="...

To insert the segment Id from the datatable:

<%# DataBinder.Eval (Container.Data Item,"SegmentID ")%>"/>

Put it all together, it will look something like this:

<Columns>
<asp:TemplateCo lumn>
<ItemTemplate >
<input type="button" value="Detail"
onclick="NewPag e("SearchResult s.aspx?seg="
<%#
DataBinder.Eval (Container.Data Item,"SegmentID ")%>);"/>
</ItemTemplate>
</asp:TemplateCol umn>
</Columns>

Tommy,

Alex <al*******@bert melix.com.au> wrote in message news:<f7******* *************** **********@4ax. com>...

Hi all,

I'm writing a small web application which searches a database based on
a date field, and populates a datagrid control with the results. The
datagrid control has selection buttons added to it to view additional
details about the selected result (a second database query is
triggered).

I want this second query to pop up in a new window, the way it would
if I used "window.ope n" in javascript. I've added a function in the
javascript to open the new window ("newpage"), but this function does
not appear to be visible to the c# code on the asp page.

I must admit to being a little confused about the separation between
the c# code view of the asp page and the html view of the page layout
- these two things are interrelated, but there doesn't seem to be any
easy way to get them to talk to one another.

To illustrate, this is the html view of the page Query.aspx:

---

<%@ Page language="c#" Codebehind="Que ry.aspx.cs"
AutoEventWireup ="false" Inherits="Video Search.WebForm1 " %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>WebForm1 </title>
<meta name="GENERATOR " Content="Micros oft Visual Studio .NET 7.1">
<meta name="CODE_LANG UAGE" Content="C#">
<meta name="vs_defaul tClientScript" content="JavaSc ript">
<meta name="vs_target Schema"
content="http://schemas.microso ft.com/intellisense/ie5">
<script>
function newpage(string url)
{
window.open(url , 'Session Detail', 'width=400,heig ht=400,
toolbar=no');
}
</script>
</HEAD>
<body MS_POSITIONING= "GridLayout ">
<form id="Form1" method="post" runat="server">
<asp:Calendar id="Calendar1" style="Z-INDEX: 101; LEFT: 296px;
POSITION: absolute; TOP: 112px"
runat="server" Width="240px" Height="224px"> </asp:Calendar>
<asp:DataGrid id="DataGrid1" style="Z-INDEX: 106; LEFT: 56px;
POSITION: absolute; TOP: 488px"
runat="server" Width="680px" Height="280px"
HorizontalAlign ="Left" BorderColor="#9 99999" BorderStyle="So lid"
CellSpacing="2" BorderWidth="3p x" BackColor="#CCC CCC"
CellPadding="4" ForeColor="Blac k">
<SelectedItemSt yle Font-Bold="True" ForeColor="Whit e"
BackColor="#000 099"></SelectedItemSty le>
<ItemStyle BackColor="Whit e"></ItemStyle>
<HeaderStyle Font-Bold="True" ForeColor="Whit e"
BackColor="Blac k"></HeaderStyle>
<FooterStyle BackColor="#CCC CCC"></FooterStyle>
<Columns>
<asp:ButtonColu mn Text="View Session"
ButtonType="Pus hButton" CommandName="Se lect"></asp:ButtonColum n>
</Columns>
<PagerStyle HorizontalAlign ="Left" ForeColor="Blac k"
BackColor="#CCC CCC" Mode="NumericPa ges"></PagerStyle>
</asp:DataGrid>
<asp:Label id="Label2" style="Z-INDEX: 103; LEFT: 440px;
POSITION: absolute; TOP: 64px" runat="server"
Width="96px" Height="32px">T o:</asp:Label>
<asp:Label id="Label1" style="Z-INDEX: 102; LEFT: 128px;
POSITION: absolute; TOP: 72px" runat="server"
Width="96px" Height="32px">F rom:</asp:Label>
<asp:Button id="Button1" style="Z-INDEX: 104; LEFT: 320px;
POSITION: absolute; TOP: 408px" runat="server"
Width="184px" Height="40px" Text="Search!"> </asp:Button>
<asp:Label id="Label3" style="Z-INDEX: 105; LEFT: 128px;
POSITION: absolute; TOP: 24px" runat="server"
Width="280px" Height="24px">S earch for video
records:</asp:Label>
<asp:Label id="errortext" style="Z-INDEX: 107; LEFT: 88px;
POSITION: absolute; TOP: 360px"
runat="server" Width="624px" Height="38px"></asp:Label>
</form>
</body>
</HTML>

This is the button handler event for the selection buttons in the data
grid, which is in Query.aspx.cs:

private void DataGrid1_Selec tedIndexChanged (object sender,
System.EventArg s e)
{
DataGridItem sel = DataGrid1.Selec tedItem;

string segmentid = sel.Cells[2].Text;

newpage("Search Results.aspx?se g=" + segmentid);
}
---
Can I access the javascript function "newpage" from the c# source like
this?
Is there a better way to do this?

Any help would be greatly appreciated.

Cheers,
Alex.
Remove ernie and bert from email address to reply.

Nov 18 '05 #2

Kevin Spencer

> I must admit to being a little confused about the separation between

the c# code view of the asp page and the html view of the page layout
- these two things are interrelated, but there doesn't seem to be any
easy way to get them to talk to one another.
Let me see if I can clear this up for you. What you refer to as "the html
view of the page layout" is referred to in ASP.Net as a "Page Template." An
ASP.Net Page is a class, an object. Most classes you may have seen before
are typically defined in a single file of code, such as the CodeBehind that
ASP.Net uses for the Page Class definition. In ASP.Net, the Page class is
what is referred to as a "Templated Control." A Templated Control consists
of a class definition and a Template. The Template inherits the class.
Inheritance is an object-oriented concept that means that a class has all
the properties and functionality of another class (inherits it), and can
have additional properties and functionality as well. The Page Template
class inherits the CodeBehind class, so in fact, it actually IS the
CodeBehind class, with the additional HTML and other code that it contains
as well. So, it's not useful to think of the CodeBehind and the Page
Template as 2 different entities. They are, in fact, 2 parts of the SAME
entity.

Now, you stated that you "added a function in the javascript" which doesn't
make sense, as there is no javascript in a Page to start out with. So, I
don't know what you were trying to say. But from your description, it sounds
like you want to dynamically add a JavaScript to the page from an Event
Handler during a PostBack. To do this, you would define the script using a
string, and then use Page.RegisterSt artupScript() to add the script to the
page so that it runs the script when it loads.

--
HTH,
Kevin Spencer
..Net Developer
Microsoft MVP
Big things are made up
of lots of little things.

"Alex" <al*******@bert melix.com.au> wrote in message
news:f7******** *************** *********@4ax.c om... Hi all,

I'm writing a small web application which searches a database based on
a date field, and populates a datagrid control with the results. The
datagrid control has selection buttons added to it to view additional
details about the selected result (a second database query is
triggered).

I want this second query to pop up in a new window, the way it would
if I used "window.ope n" in javascript. I've added a function in the
javascript to open the new window ("newpage"), but this function does
not appear to be visible to the c# code on the asp page.

I must admit to being a little confused about the separation between
the c# code view of the asp page and the html view of the page layout
- these two things are interrelated, but there doesn't seem to be any
easy way to get them to talk to one another.

To illustrate, this is the html view of the page Query.aspx:

---

<%@ Page language="c#" Codebehind="Que ry.aspx.cs"
AutoEventWireup ="false" Inherits="Video Search.WebForm1 " %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>WebForm1 </title>
<meta name="GENERATOR " Content="Micros oft Visual Studio .NET 7.1">
<meta name="CODE_LANG UAGE" Content="C#">
<meta name="vs_defaul tClientScript" content="JavaSc ript">
<meta name="vs_target Schema"
content="http://schemas.microso ft.com/intellisense/ie5">
<script>
function newpage(string url)
{
window.open(url , 'Session Detail', 'width=400,heig ht=400,
toolbar=no');
}
</script>
</HEAD>
<body MS_POSITIONING= "GridLayout ">
<form id="Form1" method="post" runat="server">
<asp:Calendar id="Calendar1" style="Z-INDEX: 101; LEFT: 296px;
POSITION: absolute; TOP: 112px"
runat="server" Width="240px" Height="224px"> </asp:Calendar>
<asp:DataGrid id="DataGrid1" style="Z-INDEX: 106; LEFT: 56px;
POSITION: absolute; TOP: 488px"
runat="server" Width="680px" Height="280px"
HorizontalAlign ="Left" BorderColor="#9 99999" BorderStyle="So lid"
CellSpacing="2" BorderWidth="3p x" BackColor="#CCC CCC"
CellPadding="4" ForeColor="Blac k">
<SelectedItemSt yle Font-Bold="True" ForeColor="Whit e"
BackColor="#000 099"></SelectedItemSty le>
<ItemStyle BackColor="Whit e"></ItemStyle>
<HeaderStyle Font-Bold="True" ForeColor="Whit e"
BackColor="Blac k"></HeaderStyle>
<FooterStyle BackColor="#CCC CCC"></FooterStyle>
<Columns>
<asp:ButtonColu mn Text="View Session"
ButtonType="Pus hButton" CommandName="Se lect"></asp:ButtonColum n>
</Columns>
<PagerStyle HorizontalAlign ="Left" ForeColor="Blac k"
BackColor="#CCC CCC" Mode="NumericPa ges"></PagerStyle>
</asp:DataGrid>
<asp:Label id="Label2" style="Z-INDEX: 103; LEFT: 440px;
POSITION: absolute; TOP: 64px" runat="server"
Width="96px" Height="32px">T o:</asp:Label>
<asp:Label id="Label1" style="Z-INDEX: 102; LEFT: 128px;
POSITION: absolute; TOP: 72px" runat="server"
Width="96px" Height="32px">F rom:</asp:Label>
<asp:Button id="Button1" style="Z-INDEX: 104; LEFT: 320px;
POSITION: absolute; TOP: 408px" runat="server"
Width="184px" Height="40px" Text="Search!"> </asp:Button>
<asp:Label id="Label3" style="Z-INDEX: 105; LEFT: 128px;
POSITION: absolute; TOP: 24px" runat="server"
Width="280px" Height="24px">S earch for video
records:</asp:Label>
<asp:Label id="errortext" style="Z-INDEX: 107; LEFT: 88px;
POSITION: absolute; TOP: 360px"
runat="server" Width="624px" Height="38px"></asp:Label>
</form>
</body>
</HTML>

This is the button handler event for the selection buttons in the data
grid, which is in Query.aspx.cs:

private void DataGrid1_Selec tedIndexChanged (object sender,
System.EventArg s e)
{
DataGridItem sel = DataGrid1.Selec tedItem;

string segmentid = sel.Cells[2].Text;

newpage("Search Results.aspx?se g=" + segmentid);
}
---
Can I access the javascript function "newpage" from the c# source like
this?
Is there a better way to do this?

Any help would be greatly appreciated.

Cheers,
Alex.
Remove ernie and bert from email address to reply.

Nov 18 '05 #3

Similar topics

2757

Some help getting started

by: PHPkemon | last post by:

Hi there, A few weeks ago I made a post and got an answer which seemed very logical. Here's part of the post: PHPkemon wrote: > I think I've figured out how to do the main things like storing products in

PHP

907

COM+ Singletons & instances ?

by: Angelos Karantzalis | last post by:

Hi y'all ... I'm a bit puzzled here about .NET class instancing under COM+ Issue 1: I've a COM+ component, let's call it ... COMDbWrapper that initializes itself from an xml file. The data in the file change very rarely, so I would like to keep it in a single copy in-memory if that's possible.

.NET Framework

1703

Please Help !!

by: Melba | last post by:

Hi everybody !! I need to know when my HTML page is being printed. I know there are some events (onbeforeprint and onafterprint), but they are firing befor the printing and if someone cancels the printing i can not know that. Please Help me !! Thanks Tamara.

Javascript

3227

XSL output method to XML & JavaScript problem

by: johkar | last post by:

When the output method is set to xml, even though I have CDATA around my JavaScript, the operaters of && and < are converted to XML character entities which causes errors in my JavaScript. I know that I could externalize my JavaScript, but that will not be practical throughout this application. Is there any way to get around this issue? Xalan processor. Stripped down stylesheet below along with XHTML output. <?xml version='1.0'?>...

.NET Framework

136

9425

Javascript Best Practices Document v1.0

by: Matt Kruse | last post by:

http://www.JavascriptToolbox.com/bestpractices/ I started writing this up as a guide for some people who were looking for general tips on how to do things the 'right way' with Javascript. Their code was littered with document.all and eval, for example, and I wanted to create a practical list of best practices that they could easily put to use. The above URL is version 1.0 (draft) that resulted. IMO, it is not a replacement for the FAQ,...

Javascript

2536

Still Need desperate help to start with ASP NET - simplified problems - HELP!!

by: pamelafluente | last post by:

I am still working with no success on that client/server problem. I need your help. I will submit simplified versions of my problem so we can see clearly what is going on. My model: A client uses IE to talk with a server. The user on the client (IE) sees an ASP net page containing a TextBox. He can write some text in this text box and push a submit button.

ASP.NET

5571

VB6 OR VBA & Webbrowser DOM Tiny $50 Mini Project Programmer help

by: gunimpi | last post by:

http://www.vbforums.com/showthread.php?p=2745431#post2745431 ******************************************************** VB6 OR VBA & Webbrowser DOM Tiny $50 Mini Project Programmer help wanted ******************************************************** For this teeny job, please refer to: http://feeds.reddit.com/feed/8fu/?o=25

Microsoft Access / VBA

2796

Help with Access and Frontpage

by: Webstorm | last post by:

Hi, I hope someone can help me sort this out a bit, Im completely lost. Here is the page I am working on: http://www.knzbusinessbrokers.com/default.asp I have 3 search critera that I need to use when querying the database. Right now it is only looking for a match on one of those dropdowns and not all 3. can anyone help? Here is the code: <form BOTID="0" METHOD="POST" action="businessforsale_interface/Results/test3.asp">

Microsoft Access / VBA

8408

Help Jquery: unable to register a ready function

by: souporpower | last post by:

Hello All I am trying to activate a link using Jquery. Here is my code; <html> <head> <script type="text/javascript" src="../../resources/js/ jquery-1.2.6.js"</script> <script language="javascript" type="text/javascript">

Javascript

9401

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...

C / C++

9257

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

by: jinu1996 | last post by:

In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...

Online Marketing

9179

The easy way to turn off automatic updates for Windows 10/11

by: Hystou | last post by:

Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...

Windows Server

8099

AI Job Threat for Devs

by: agi2029 | last post by:

Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...

Career Advice

6011

Couldn’t get equations in html when convert word .docx file to html file in C#.

by: conductexam | last post by:

I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...

C# / C Sharp

4519

Trying to create a lan-to-lan vpn between two differents networks

by: TSSRALBI | last post by:

Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...

Networking - Hardware / Configuration

4784

Windows Forms - .Net 8.0

by: adsilva | last post by:

A Windows Forms form does not have the event Unload, like VB6. What one acts like?

Visual Basic .NET

2637

How to add payments to a PHP MySQL app.

by: muto222 | last post by:

How can i add a mobile payment intergratation into php mysql website.

PHP

2157

Comprehensive Guide to Website Development in Toronto: Expert Insights from BSMN Consultancy

by: bsmnconsultancy | last post by:

In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

General