Javascript not working when part of asp.net page.

T

tshad

This is from my previous post, but a different issue.

I have the following Javascript routine that opens a popup page, but doesn't
seem to work if called from an asp.net button. It seems to work fine from a
link.

The button does bring up the popup window, but when I press the links on the
page, it doesn't return or close the window.

****************************************************************************
*
<%@ Page Language="VB" trace="false" debug="true" AutoEventWireup="true"
ContentType="text/html" ResponseEncoding="iso-8859-1" %>
<!--#include virtual = '/Development/includes/ModalDialogs.inc'-->
<script runat="server">
sub page_load(s as object, e as eventArgs)
if not isPostBack then
Button1.Attributes.Add("onclick", "YesNoCancel('This is a
test','modalreturn2', 'Yes, no, or cancel me',
'YesNoCancelReturnMethod()');")
end if
end sub
</script>

<form runat="server">

<asp:Button ID="Button1" text="submit" runat="server"/><br>

<input type=text id=modalreturn2 name=modalreturn2 value=''><br>

<a href="javascript:YesNoCancel('This is the first Title', 'modalreturn2',
'Yes, no, or cancel me', 'YesNoCancelReturnMethod()');" >Show Modal #1</a>

</form>
</body>
</html>
**************************************************************

In this page am calling the javascript popup from a link and a button. With
the link it works everytime I press the link. Once I use the button, it
doesn't work for the link anymore.

For the button, it opens the popup fine, but it never returns when I press
the link on the popup page. It only returns when I press the "x". It never
returns anything from the popup (not even the empty string when pressing the
"x").

At this point, neither the button nor the link will bring up the popup box.

Does anyone know what the is the problem here?

Here is the page that is rendered from .aspx:

**************************************************************************
<script language=JavaScript>

var ModalDialogWindow;
var ModalDialogInterval;
var ModalDialog = new Object;

ModalDialog.value = '';
ModalDialog.eventhandler = '';
ModalDialog.returnAddress = '';


function ModalDialogMaintainFocus()
{
try
{
if (ModalDialogWindow.closed)
{
window.clearInterval(ModalDialogInterval);
eval(ModalDialog.eventhandler);
return;
}
ModalDialogWindow.focus();
}
catch (everything) { }
}

function ModalDialogRemoveWatch()
{
ModalDialog.value = '';
ModalDialog.eventhandler = '';
}

function ModalDialogShow(Title,ReturnAddress,BodyText,Buttons,EventHandler)
{
alert("this is a test");
ModalDialogRemoveWatch();
ModalDialog.eventhandler = EventHandler;
ModalDialog.returnAddress = ReturnAddress;

var args='width=350,height=125,left=325,top=300,toolbar=0,';
args+='location=0,status=0,menubar=0,scrollbars=1,resizable=0';

ModalDialogWindow=window.open("","",args);
ModalDialogWindow.document.open();
ModalDialogWindow.document.write('<html>');
ModalDialogWindow.document.write('<head>');
ModalDialogWindow.document.write('<style>body{background-color:
#B2CBD2;}</style>')
ModalDialogWindow.document.write('<title>' + Title + '</title>');
ModalDialogWindow.document.write('<script' + ' language=JavaScript>');
ModalDialogWindow.document.write('function CloseForm(Response) ');
ModalDialogWindow.document.write('{ ');
ModalDialogWindow.document.write(' window.opener.ModalDialog.value =
Response; ');
ModalDialogWindow.document.write(' window.close(); ');
ModalDialogWindow.document.write('} ');
ModalDialogWindow.document.write('</script' + '>');
ModalDialogWindow.document.write('</head>');
ModalDialogWindow.document.write('<body onblur="window.focus();">');
ModalDialogWindow.document.write('<table border=0 width="95%"
align=center cellspacing=0 cellpadding=2>');
ModalDialogWindow.document.write('<tr><td align=left>' + BodyText +
'</td></tr>');
ModalDialogWindow.document.write('<tr><td align=left><br></td></tr>');
ModalDialogWindow.document.write('<tr><td align=center>' + Buttons +
'</td></tr>');
ModalDialogWindow.document.write('</body>');
ModalDialogWindow.document.write('</html>');
ModalDialogWindow.document.close();
ModalDialogWindow.focus();
ModalDialogInterval = window.setInterval("ModalDialogMaintainFocus()",5);

}

</script>

<script language=JavaScript>


function YesNoCancel(Title,returnAddress,BodyText,EventHandler)
{
var Buttons='';
Buttons = '<a href=javascript:CloseForm("Yes");>Yes</a> ';
Buttons += '<a href=javascript:CloseForm("No");>No</a> ';
Buttons += '<a href=javascript:CloseForm("Cancel");>Cancel</a> ';
ModalDialogShow(Title,returnAddress,BodyText,Buttons,EventHandler);
}

function YesNoMaybe(Title,returnAddress,BodyText,EventHandler)
{
var Buttons='';
Buttons = '<a
href=javascript:CloseForm("Yes");>Yes</a>&nbsp;&nbsp;&nbsp;&nbsp; ';
Buttons += '<a
href=javascript:CloseForm("No");>No</a>&nbsp;&nbsp;&nbsp;&nbsp; ';
Buttons += '<a href=javascript:CloseForm("Maybe");>Maybe</a> ';
ModalDialogShow(Title,ReturnAddress,BodyText,Buttons,EventHandler);
}

function YesNoCancelReturnMethod()
{
document.getElementById(ModalDialog.returnAddress).value =
ModalDialog.value;
ModalDialogRemoveWatch();
}

function YesNoMaybeReturnMethod()
{
document.getElementById(ModalDialog.returnAddress).value =
ModalDialog.value;
ModalDialogRemoveWatch();
}

</script>

<form name="_ctl0" method="post" action="TMP28cypdoa6c.aspx" id="_ctl0">
<input type="hidden" name="__VIEWSTATE"
value="dDw5NjU1MTU1O3Q8O2w8aTwxPjs+O2w8dDw7bDxpPDE+Oz47bDx0PHA8O3A8bDxvbmNsa
WNrOz47bDxZZXNOb0NhbmNlbCgnVGhpcyBpcyBhIHRlc3QnLCdtb2RhbHJldHVybjInLCdZZXMsI
G5vLCBvciBjYW5jZWwgbWUnLCdZZXNOb0NhbmNlbFJldHVybk1ldGhvZCgpJylcOzs+Pj47Oz47P
j47Pj47Pgp4F76kb7VjTMvhPLbWVoJO6PFw" />

<input type="submit" name="Button1" value="submit" id="Button1"
onclick="YesNoCancel('This is a test','modalreturn2','Yes, no, or cancel
me','YesNoCancelReturnMethod()');" /><br>
<input type=text id=modalreturn2 name=modalreturn2 value=''><br>
<a href="javascript:YesNoCancel('This is the first
Title','modalreturn2','Yes, no, or cancel
me','YesNoCancelReturnMethod()');">Show Modal #1</a>
<input type=hidden name='_sk_scrollkeepervalue' id='_sk_scrollkeepervalue'
value='0!0'><script>function SKFilter_SetPosition(){
scrollTo(0,0);}</script><script language='javascript'>onscroll =
function(){document.getElementById('_sk_scrollkeepervalue').value =
document.body.scrollLeft+'!' + document.body.scrollTop;}</script></form>
<p>&nbsp;</p>

</body>
</html>
**************************************************************************

Thanks,

Tom
 
T

tshad

I made some changes here to better see what was happening.

I added a button as well as buttons on one of the popup windows. I then
added an asp.net button and my asp.net code. The page works fine with or
without the asp.net code (as long as the asp.net button is not pushed).

This works fine (as before) until I press the asp.net button. I am opening
alert boxes in various locations that all fire until the asp.net button is
pushed. From that time, all links and buttons will bring up the alert box
in the first javascript funtion, but the ModalDialogShow never gets called
or it just ignores it and therefore the popup window never gets called.

Why would the asp.net button cause the Javascript to quit functioning?

Why does the popup window not close when the buttons or links are pressed on
them?

**************************************************************************************
<%@ Page Language="VB" trace="false" debug="true" AutoEventWireup="true"
ContentType="text/html" ResponseEncoding="iso-8859-1" %>
<html>
<script language=JavaScript>

var ModalDialogWindow;
var ModalDialogInterval;
var ModalDialog = new Object;

ModalDialog.value = '';
ModalDialog.eventhandler = '';


function ModalDialogMaintainFocus()
{
try
{
if (ModalDialogWindow.closed)
{
alert("at ModalDialogWindow.closed");
window.clearInterval(ModalDialogInterval);
eval(ModalDialog.eventhandler);
return;
}
ModalDialogWindow.focus();
}
catch (everything) { }
}

function ModalDialogRemoveWatch()
{
ModalDialog.value = '';
ModalDialog.eventhandler = '';
}

function ModalDialogShow(Title,BodyText,Buttons,EventHandler)
{
alert("inside ModalDialogShow");

ModalDialogRemoveWatch();
ModalDialog.eventhandler = EventHandler;

var args='width=350,height=125,left=325,top=300,toolbar=0,';
args+='location=0,status=0,menubar=0,scrollbars=1,resizable=0';

ModalDialogWindow=window.open("","",args);
ModalDialogWindow.document.open();
ModalDialogWindow.document.write('<html>');
ModalDialogWindow.document.write('<head>');
ModalDialogWindow.document.write('<title>' + Title + '</title>');
ModalDialogWindow.document.write('<script' + ' language=JavaScript>');
ModalDialogWindow.document.write('function CloseForm(Response) ');
ModalDialogWindow.document.write('{ ');
ModalDialogWindow.document.write(' window.opener.ModalDialog.value =
Response; ');
ModalDialogWindow.document.write(' window.close(); ');
ModalDialogWindow.document.write('} ');
ModalDialogWindow.document.write('</script' + '>');
ModalDialogWindow.document.write('</head>');
ModalDialogWindow.document.write('<body onblur="window.focus();">');
ModalDialogWindow.document.write('<table border=0 width="95%"
align=center cellspacing=0 cellpadding=2>');
ModalDialogWindow.document.write('<tr><td align=left>' + BodyText +
'</td></tr>');
ModalDialogWindow.document.write('<tr><td align=left><br></td></tr>');
ModalDialogWindow.document.write('<tr><td align=center>' + Buttons +
'</td></tr>');
ModalDialogWindow.document.write('</body>');
ModalDialogWindow.document.write('</html>');
ModalDialogWindow.document.close();
ModalDialogWindow.focus();
ModalDialogInterval = window.setInterval("ModalDialogMaintainFocus()",5);

}

</script>

<script language=JavaScript>


function YesNoCancel(BodyText,EventHandler)
{
alert("inside YesNoCancel")
var Buttons='';
// Buttons = '<a href=javascript:CloseForm("Yes");>Yes</a> ';
// Buttons += '<a href=javascript:CloseForm("No");>No</a> ';
// Buttons += '<a href=javascript:CloseForm("Cancel");>Cancel</a> ';
Buttons = '<BUTTON onclick="javascript:CloseForm(\'Yes\');"
type="button">Yes</BUTTON> ';
Buttons += '<BUTTON onclick="javascript:CloseForm(\'No\');" type =
"button">No</BUTTON> ';
Buttons += '<BUTTON onclick="javascript:CloseForm(\'Cancel\');" type =
"button">Cancel</BUTTON> ';
ModalDialogShow("Dialog",BodyText,Buttons,EventHandler);
}

function YesNoMaybe(BodyText,EventHandler)
{
var Buttons='';
Buttons = '<a href=javascript:CloseForm("Yes");>Yes</a> ';
Buttons += '<a href=javascript:CloseForm("No");>No</a> ';
Buttons += '<a href=javascript:CloseForm("Maybe");>Maybe</a> ';
ModalDialogShow("Dialog",BodyText,Buttons,EventHandler);
}

function YesNoCancelReturnMethod()
{
alert("inside YesNoCancelReturnMethod");
document.getElementById('modalreturn1').value = ModalDialog.value;
ModalDialogRemoveWatch();
}

function YesNoMaybeReturnMethod()
{
document.getElementById('modalreturn2').value = ModalDialog.value;
ModalDialogRemoveWatch();
}

</script>

<script runat="server">
sub page_load(s as object, e as eventArgs)
if not isPostBack then
Button1.Attributes.Add("onclick", "YesNoCancel('Yes, no, or cancel
me','YesNoCancelReturnMethod()');")
end if
end sub
</script>

<BODY >

<table border=1 cellpadding=2 cellspacing=2 align=center width="60%">
<tr><td align=left></td></tr>
<tr><td align=left></td></tr>
<tr><td align=left></td></tr>
<tr>
<td align=left><a href="javascript:YesNoCancel('Yes, no, or cancel
me','YesNoCancelReturnMethod()');">Show Modal #1</a>
1. <input type=text id=modalreturn1 name=modalreturn1
value=''></td>
</tr>
<tr>
<td align=left><a href="javascript:YesNoMaybe('Yes, no, or maybe
me','YesNoMaybeReturnMethod()');">Show Modal #2</a>
2. <input type=text id=modalreturn2 name=modalreturn2
value=''></td>
</tr>
<tr>
<td>
<BUTTON onclick="javascript:YesNoMaybe('Yes, no, or maybe
me','YesNoMaybeReturnMethod()');" type="button">Open Child Window</BUTTON>
</td>
</tr>
</table>
<form runat="server">
<asp:Button ID="Button1" text="submit" runat="server"/>
</form>
</BODY>
</HTML>
************************************************************************************

Thanks,

Tom
<snip>
 
M

Marina

You have a client side onclick event for the button. Are you sure there
isn't a javascript error that happens when you click the .NET button? And
you are not seeing it because script error notification is turned off?

I bet if you just had a button with no client side event handler for it, it
would be fine.

Just FYI, this has nothing to do with .NET. All javascript and HTML is dealt
with in the browser on the client. That ASP.NET button is just streamed out
as an <input>. You can look at the resulting HTML via View Source to see
what is being generated and what the problem could be.
 
T

tshad

Marina said:
You have a client side onclick event for the button. Are you sure there
isn't a javascript error that happens when you click the .NET button? And
you are not seeing it because script error notification is turned off?
Click to expand...

How would I turn it on if it is off?

It does open the javascript window fine. It is just that when I press the
buttons in the popup window, nothing happens. I can close it by pushing the
window cancel (x). But at this point none of the buttons will work. Also,
but when I do press the buttons (from the parent window), I still get the
alert box from the YesNoCancelReturnMethod, which tells me that it is
calling the Javascript function.

Also, that is how you call a Javascript function (not sure why), but that is
how it is done.

I can call an alert or confirm button by:

myNextButton.Attributes.Add("onclick", "return confirm('Are you sure you
want finish this test?');")

which works fine. Not sure why I don't have to have it as
"Javascript:return confirm('Are you sure you want finish this test?');"
I bet if you just had a button with no client side event handler for it,
it would be fine.
Click to expand...

Right. Buttons are no problem. My problem is I need to attach a client
side pop up window for some reactions from the client. The normal
Javascript windows (alert, confirm) won't work as I need one of a couple of
answers from the client.
Just FYI, this has nothing to do with .NET. All javascript and HTML is
dealt with in the browser on the client. That ASP.NET button is just
streamed out as an <input>. You can look at the resulting HTML via View
Source to see what is being generated and what the problem could be.
Click to expand...

Here is what is generated from asp.net:

******************************************************************************************
<td align=left><a href="javascript:YesNoMaybe('Yes, no, or maybe
me','YesNoMaybeReturnMethod()');">Show Modal #2</a>

2. <input type=text id=modalreturn2 name=modalreturn2
value=''></td>

</tr>
<tr>
<td>
<BUTTON onclick="javascript:YesNoMaybe('Yes, no, or maybe
me','YesNoMaybeReturnMethod()');" type="button">Open Child Window</BUTTON>
</td>
</tr>
</table>
<form name="_ctl0" method="post" action="popupTest.aspx" id="_ctl0">

<input type="submit" name="Button1" value="submit" id="Button1"
onclick="YesNoCancel('Yes, no, or cancel me','YesNoCancelReturnMethod()');"
/>
</script></form>

******************************************************************************************

As you can see the input/Button1(asp.net) onClick is similar to the html
Buttons onClick event (except that it doesn't have "javascript:" preceding
it. But even if I put that there, it still acts the same.

Thanks,

Tom
 
T

tshad

Also, I added a couple of more alerts to see how far it is getting when
pressing the buttons on the popup form.

ModalDialogWindow.document.write('function CloseForm(Response) ');
ModalDialogWindow.document.write('{ ');
ModalDialogWindow.document.write(' alert("inside CloseForm"); ');
ModalDialogWindow.document.write(' window.opener.ModalDialog.value =
Response; ');
ModalDialogWindow.document.write(' alert("after setting ModalDialog.value
and before window.close"); ');
ModalDialogWindow.document.write(' window.close(); ');
ModalDialogWindow.document.write(' alert("after window.close"); ');
ModalDialogWindow.document.write('} ');

It goes through all of them for all the other buttons (except that you have
to close the window directly, but the value does get transfered to the
textbox).

But for the asp.net button, it only gets to the first alert button and seems
to stop on the "window.opener.ModalDialog.value = Response" line where the
value is getting set. It never gets past that.

At that point the Javascript seems to be broken and never works for any of
the buttons (except that they do get to the first Javascript funtion).

Tom
 
T

tshad

I think I know what is happening, but I don't know what to do about it.

I added the line:

ModalDialogWindow.document.write(' if (window.opener &&
!window.opener.closed)alert ("window.opener still valid"); ');

to the code in the CloseForm function and it comes back as valid, but the
program may already doing it's postback and may have lost the object which
is on the page. And that is why it is lost. The object is gone.

I am not sure why the links get into the first function, but not to the
ModalDialogShow function. I can only assume it has something to do with the
Global object that is created at the start has now been replace with another
one (or is gone altogether) since there is no viewstate to save it.

I'd be curious if I am on the right path or not and if there is a way around
this problem.

Thanks,

Tom
 
T

tshad

Patrick Olurotimi Ige said:
Tom why don't u try this approach at :-
http://www.aspnetpro.com/NewsletterArticle/2004/10/asp200410bm_l/asp2004
10bm_l.asp
Click to expand...

I tried that.

It only seems to work in IE.

I tried using MS example from their site:

<html>
<head>
<script language="VB" runat="server">
Sub Page_Load( sender as Object,e as EventArgs)

'Form the script that is to be registered at client side.
Dim scriptString as String = "<script language=JavaScript> function
DoClick() {"
scriptString += "myForm.show.value='Welcome to Microsoft .NET'}<"
scriptString += "/"
scriptString += "script>"

If(Not IsClientScriptBlockRegistered("clientScript"))
RegisterClientScriptBlock("clientScript", scriptString)
End If
End Sub
</script>
</head>
<body topmargin="20" leftmargin="10">
<form id="myForm" runat="server">
<input type="text" id="show" style="width=200">
<input type="button" value="ClickMe" onclick="DoClick()">
</form>
</body>
</html>

I tried this in Mozilla and the button does nothing. IE works fine.

The problem with a lot of these solutions is that you spend days getting
them to work and then find that they won't work for all browsers or, as in
the case of the one I was trying to get to work, there is some gotcha that
you can't find a way around. This seems to work fine until I used it work a
..net object.

In this case, I thought it my popup box would work and now I have to go into
my boss and tell him it won't.

Thanks,

Tom
 
T

tshad

I worked on this all night and finally got it working, but the problem is
that it only works if you connect the value to an html button where there is
no postback.

I am using the RegisterClientScriptBlock you suggested.

I found that if I set the onClick to an asp.net object (asp:button), I lose
any value I wrote to the page during postback. For example:

<asp:textbox id="test" text="something" runat="server" />

If I set this "test" to "Yes", it will get reset to "something" during
postback. It doesn't keep the change I set it to.

Tom
 
T

tshad

tshad said:
I worked on this all night and finally got it working, but the problem is
that it only works if you connect the value to an html button where there is
no postback.

I am using the RegisterClientScriptBlock you suggested.

I found that if I set the onClick to an asp.net object (asp:button), I lose
any value I wrote to the page during postback. For example:

<asp:textbox id="test" text="something" runat="server" />

If I set this "test" to "Yes", it will get reset to "something" during
postback. It doesn't keep the change I set it to.
Click to expand...

I need to find some way to write the data to something that will not be
changed when it gets posted back.

I looked at somehow writing to a session variable from javascript - but
can't seem to find a way to do that.

I tried using an html input tag to store the variable ,but it gets reset on
postback.

Tom
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

JavaScript code not working!! 6
Image shifts to the right when export the page to pdf 4
Script to send email not working 1
Javascript DOM 1
Help with my responsive home page 2
Script stops working when using variables to save time typing... 4
Image upload not working in browser 4
Working on mobile css menu with plenty of frustration! 2

Members online

No members online now.
Total: 26 (members: 0, guests: 26)
Robots: 332

Forum statistics

Threads
473,769
Messages
2,569,582
Members
45,062
Latest member
OrderKetozenseACV

Latest Threads

Top