Setting control value via javascript called from function

groston · Dec 28, 2003

I am trying to do the following: On a page have a button that fires a code-behind function (to perform some server-side actions) which in turn calls a javascript function to launch a dialog window. The dialog window accepts some user input and upon the user's pushing a button, fires a code-behind function (to perform some server-side actions) then return a value to the calling page.

What follows is a stripped-down test to try to accomplish this. Everything works, except...
The value is never displayed in the TextBox (txtRetval) on MainForm (see the two line in jsPopupClass.vb marked ****). I have confirmed, using 'alert', that the text typed into DialogForm is indeed being returned.

Would you please help me fix this code. Thanks!

=== MainForm.aspx ===

<%@ Page Language="vb" AutoEventWireup="false" Codebehind="MainForm.aspx.vb" Inherits="testModal.MainForm"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<title>WebForm1</title>
<meta content="True" name="vs_snapToGrid">
<meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
<meta content="Visual Basic .NET 7.1" name="CODE_LANGUAGE">
<meta content="JavaScript" name="vs_defaultClientScript">
<meta content="

http://schemas.microsoft.com/intellisense/ie5"

name="vs_targetSchema">
</HEAD>
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" runat="server">
<asp:button id="cmdOpen" style="Z-INDEX: 101; LEFT: 16px; POSITION: absolute; TOP: 56px" runat="server"
Width="184px" Height="32px" Text="Open dialog"></asp:button>
<asp:TextBox id="txtRetval" style="Z-INDEX: 102; LEFT: 16px; POSITION: absolute; TOP: 24px" runat="server"
Width="184px">Return test will go here</asp:TextBox></form>
</body>
</HTML>

=== MainForm.aspx.vb ====

Public Class MainForm
Inherits System.Web.UI.Page

<System.Diagnostics.DebuggerStepThrough()> Private Sub InitializeComponent()

End Sub
Protected WithEvents cmdOpen As System.Web.UI.WebControls.Button
Protected WithEvents txtRetval As System.Web.UI.WebControls.TextBox

Private designerPlaceholderDeclaration As System.Object

Private Sub Page_Init(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Init
InitializeComponent()
End Sub

Private Sub cmdOpen_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles cmdOpen.Click
' do some server-side stuff, like database query, etc
Dim addTestPopup As New jsPopupClass
addTestPopup.doPopup(Me)
End Sub
End Class

=== DialogForm.aspx ===

<%@ Page Language="vb" AutoEventWireup="false" Codebehind="DialogForm.aspx.vb" Inherits="testModal.DialogForm"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<title>DialogForm</title>
<meta name="vs_snapToGrid" content="True">
<meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" content="Visual Basic .NET 7.1">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema" content="

http://schemas.microsoft.com/intellisense/ie5">

</HEAD>
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" runat="server">
<asp:TextBox id="txtEntry" style="Z-INDEX: 102; LEFT: 16px; POSITION: absolute; TOP: 48px" runat="server"
Height="32px" Width="184px"></asp:TextBox>
<asp:Button id="cmdClose" style="Z-INDEX: 101; LEFT: 16px; POSITION: absolute; TOP: 88px" runat="server"
Height="32px" Width="184px" Text="Close dialog"></asp:Button>
<asp:Label id="Label1" style="Z-INDEX: 103; LEFT: 16px; POSITION: absolute; TOP: 24px" runat="server"
Height="24px" Width="176px">Text to return</asp:Label>
</form>
</body>
</HTML>

=== DialogForm.aspx.vb ===

Public Class DialogForm
Inherits System.Web.UI.Page

<System.Diagnostics.DebuggerStepThrough()> Private Sub InitializeComponent()

End Sub
Protected WithEvents cmdClose As System.Web.UI.WebControls.Button
Protected WithEvents txtEntry As System.Web.UI.WebControls.TextBox
Protected WithEvents Label1 As System.Web.UI.WebControls.Label

Private designerPlaceholderDeclaration As System.Object

Private Sub Page_Init(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Init
InitializeComponent()
End Sub

Private Sub cmdClose_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles cmdClose.Click
' do some server-side stuff, like database insert, etc
Dim Script As String = vbCrLf + "<script language=JavaScript id='CloseDialog'>" + vbCrLf
Script += "window.returnValue = '" + txtEntry.Text + "'; " + vbCrLf
Script += "window.close();" + vbCrLf
Script += "</script>" + vbCrLf

If (Not Page.IsStartupScriptRegistered("CloseDialog&quot

) Then
Page.RegisterStartupScript("CloseDialog", Script)
End If
End Sub
End Class

=== jsPopupClass.vb ===

Public Class jsPopupClass
Public Sub doPopup(ByVal myPage As System.Web.UI.Page)
Dim Script As String = vbCrLf + "<script language=JavaScript id='PopupPage'>" + vbCrLf
Script += "var retText = null;" + vbCrLf
Script += "var WinSettings = 'center:yes;resizable:no;dialogHeight:200px';" + vbCrLf
Script += "retText = window.showModalDialog('DialogForm.aspx', null, WinSettings);" + vbCrLf
Script += "var objForm = document.forms['Form1']; " + vbCrLf ****
Script += "var objFormField = objForm.elements['txtRetval']; " + vbCrLf ****
Script += "objFormField.Text = retText;" + vbCrLf
Script += "</script>" + vbCrLf

If (Not myPage.IsStartupScriptRegistered("PopupPage&quot

) Then
myPage.RegisterStartupScript("PopupPage", Script)
End If
End Sub
End Class

----

Gerry Roston
gerry@pairofdocs.net

LV · Dec 28, 2003

In DialogForm.aspx.vb:

Code:

instead of:
Script += &quot;window.returnValue = '&quot; + txtEntry.Text + &quot;'; &quot; + vbCrLf
try:
Script += &quot;window.opener.document.getElementById('txtRetval').value='&quot; + txtEntry.Text + &quot;';&quot; + vbCrLf

groston · Dec 28, 2003

LV,

You must tell me where you live so I can take you out for a beer - thanks for all of your help!

Anyway, I had tried something like this earlier. It works perfectly well when you use window.open, but not when you use window.showModalDialog. When I tried this, the error:

Microsoft JScript runtime error: 'window.opener.document' is null or not an object

was displayed.

Any other suggestions?

----

Gerry Roston
gerry@pairofdocs.net

LV · Dec 28, 2003

I know, sorry for the error in my script. ALWAYS check it before you post it - forgot about this golden rule. Let me get back to you in about 5 min.

LV · Dec 28, 2003

1. change in jsPopupClass.vb

Code:

change line:
Script += &quot;retText = window.showModalDialog('DialogForm.aspx', null, WinSettings);&quot; + vbCrLf
to:
Script += &quot;retText = window.showModalDialog('DialogForm.aspx', self, WinSettings);&quot; + vbCrLf
Having &quot;self&quot; as the second agrument, we pass the parent window as an argumnet to the dialog window.

2. change in DialogForm.aspx.vb

Code:

instead of line:
Script += &quot;window.returnValue = '&quot; + txtEntry.Text + &quot;'; &quot; + vbCrLf
add these two lines:
Script += &quot;var pnt = window.dialogArguments;&quot; + vbCrLf
Script += &quot;pnt.document.getElementById('txtRetval').value='&quot; + txtEntry.Text + &quot;';&quot; + vbCrLf

window.dialogArguments in the dialog window willl return the parent window itself - remember we passed it from the opening form. Give it a shot to make sure it works and then we'll talk about the beer

. Just kidding.

groston · Dec 28, 2003

Works as advertised! Thanks.

----

Gerry Roston
gerry@pairofdocs.net

groston · Dec 28, 2003

The key to your solution was the document.getElementById. I found that I could leave DialogForm.aspx.vb alone and in jsPopupClass replace:

Script += "var objForm = document.forms['Form1']; " + vbCrLf
Script += "var objFormField = objForm.elements['txtRetval']; " + vbCrLf
Script += "objFormField.Text = retText;" + vbCrLf

with

Script += "document.getElementById('txtRetval').value = retText;" + vbCrLf

Thanks again!

----

Gerry Roston
gerry@pairofdocs.net

groston · Dec 28, 2003

LV,

If you're still looking in, maybe you can offer some guidance.

The reason I needed a solution to this issue is that on the main form, I have a DropDownList. The first item in the list is "Add new item". When selected, the child form is opened (in dialog mode), the user enters the, and then hits 'Done' button. This causes the data to be stored into the database and the record key for the new record is returned to the main form.

What I had been trying is to set ddl.SelectedValue to the returned value. This doesn't work (duh) because the ddl does not yet have this new record as it was added to the database table after the ddl was populated.

So, what I need to do, I guess, is to rerun the query that filled the ddl upon return from the dialog window. However, that is all server side code and I do not know if it can be run from within the javascript function.

Can you offer any suggestions?

----

Gerry Roston
gerry@pairofdocs.net

LV · Dec 28, 2003

Let me run a little samle and I'll get back to you.

LV · Dec 29, 2003

OK, still haven't had a chance to run a sample, but here is what comes to mind. Since you're probably populating the dropdown on the parent while page is loading, all you need to do is refresh the page after the new item was added int the pop up. So it should be an addition to the jsPopupClass as a last line of code:

Code:

Script += &quot;window.location='MainForm.aspx';&quot; + vbCrLf

This should redirect the page to itself and refresh it so the new entry will appear in the ddl. Let's see if this works.

groston · Dec 29, 2003

LV,

I think that you are correct. However, since this reload would occur after the line in which the value for the DDL is set, I cannot imagine how this would work.

However, if I were to store the return value in a hidden control, I could, in load_page, requery the db if there is a value in the control and then set SelectedIndex to that value.

I'll give it a whirl.

----

Gerry Roston
gerry@pairofdocs.net

LV · Dec 29, 2003

OK, so the line

Code:

Script += &quot;document.getElementById('txtRetval').value = retText;&quot; + vbCrLf

was actualy for testing? In real life you're adding a new option to a ddl?

groston · Dec 29, 2003

Right. That was the surrogate for the actual line of code:

Script += "{document.getElementById('ddlSponsor').value = newSpondorID;}" + vbCrLf

Now the sad news, the suggested line fo code, when executed, prodcued the following error:

Microsoft JScript runtime error: 'contentWindow.document' is null or not an object

----

Gerry Roston
gerry@pairofdocs.net

LV · Dec 29, 2003

The suggested line fo code is the one for refreshing the window? Also, before you set the value by
Script += "{document.getElementById('ddlSponsor').value = newSpondorID;}" + vbCrLf
you have to add the new item to the ddl, right?

groston · Dec 29, 2003

Yes, sorry, was not specific enough. The suggested line of code:

Script += "window.location='MainForm.aspx';" + vbCrLf

when executed, produced the following error:

Microsoft JScript runtime error: 'contentWindow.document' is null or not an object.

Yes, the new item needs to be added to the ddl. That was the point of my first comment of today. If, instead of setting the value directly, I instead store it in a hidden field and use a line of code that causes the parent window to refresh, I can update the ddl and set the appropriate value in page_load.

p.s. The actual item is added to the underlying table as a part of the click event for the 'Done' button on the popup window.

----

Gerry Roston
gerry@pairofdocs.net

LV · Dec 29, 2003

Then probably in the click event for the 'Done' button, after you add a new item to the dll sitting on the parent, you can do a loop through all ddl's items and since you know the new item value, you can find it and set this item as selected.

Code:

for(i=0;i<ddl.length;i++){
 if(ddl.options[i].value == newSpondorID){
   ddl.options[i].selected = true;
 }
 else{
   // do not break out of the loop to uselect all other options
   // in order not to have two options selcted at the same time
   ddl.options[i].selected = false;
 }
}

groston · Dec 29, 2003

I see what you are suggesting. I guess that it is possible for the 'Done' button on dialog form to access cotnrols on the main form by passing in a reference to the main form as a window.dialogArguments.

I am working on another project right now - I'll try this out tomorrow. Great idea, thanks!

----

Gerry Roston
gerry@pairofdocs.net

groston · Jan 26, 2004

LV,

I haven't forgotten about you - I just got pulled into 17 other things. I also realized a fundamental error with my approach - I was updating the underlying DB without giving the user the chnace to cancel. So, I am fixing this, having all changes be applied to a dataset object until the update confirmation is given. however, that does not change the basic idea, and I still believe that your apporach is the correct one.

Thanks!

----

Gerry Roston
gerry@pairofdocs.net

LV · Jan 26, 2004

OK, let me know if you need any help.

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Setting control value via javascript called from function

IS-IT--Management

Programmer

IS-IT--Management

Programmer

Programmer

IS-IT--Management

IS-IT--Management

IS-IT--Management

Programmer

Programmer

IS-IT--Management

Programmer

IS-IT--Management

Programmer

IS-IT--Management

Programmer

IS-IT--Management

IS-IT--Management

Programmer

Similar threads

Log in

Part and Inventory Search

Sponsor