Popup needed for lookup values...

DGK101 · Jan 24, 2005

Hi everybody,

I wonder if anyone would mind helping me to solve a small problem I have stumbled upon?

I have a search form with two text boxes - “Field Name” and “Search Criteria”.

What I would like to do is have a link that opens a popup window – this popup window will take the value from the ‘Field Name’(from parent window) text box and query the DB to pull a list of ‘Look Up’ values into a select box(in the popup window). Once the user has selected a value in the select box and clicked on a button to close the popup, the value needs to be passed across to the “search criteria” text box in my parent window…

Can this be done? I am familiar with basic Javascript functions, but this seems to be more difficult than anticipated.

Any help would be greatly appreciated.

D

BillyRayPreachersSon · Jan 24, 2005

If you split the task down into 3 pieces, it might look a bit less daunting:

1: Open popup window and somehow transfer "field name" to it.
2: Do database searching.
3: Transfer chosen value back and close popup.

I will assume that step 2 will be done server-side, so won't go into that.

There are two basic (and many convoluted!) ways that I can think of to get the contents of the field to the popup window:

1. Pass it in the URL when the window is opened.
2: When the popup opens, have it query the form in the opening window directly.

Given, however, that you will probably need the value server-side (to do the db lookup), we will ignore option 2!

The first method is fairly straightforward. Lets assume that your form is called "myForm", the field is called "fieldName":

Code:

<html>
<head>
	<script type="text/javascript">
	<!--
		function openLookupWin() {
			var fieldName = document.forms['myForm'].elements['fieldName'].value;
			window.open('lookup.html?fieldName=' + escape(fieldName), '', '');
		}
	//-->
	</script>
</head>

<body>
	<form name="myForm">
		<input type="text" name="fieldName" />
		<input type="text" name="searchCriteria" />
	</form>
	
	<br /><a href="javascript:openLookupWin();">Lookup</a>
</body>
</html>

The parameter could then be picked up by the server-side code on the db lookup page.

Returning the data to the opening page is also fairly easy:

Code:

<html>
<head>
	<script type="text/javascript">
	<!--
		function simulateReturnData() {
			window.opener.document.forms['myForm'].elements['searchCriteria'].value = 'your new value here';
			window.close();
		}
	//-->
	</script>
</head>

<body>
	<a href="javascript:simulateReturnData();">choose and close</a>
</body>
</html>

You would need to insert your own values, of course.

Hope this helps,
Dan

DGK101 · Jan 24, 2005

Thanks Dan,

This works perfectly - exactly what I needed.

Just another quick question.

What Javascript/CSS book would you recommended?

I know the basics of javascript, so I am looking fo a book just past a 'beginners' book. Something that can be referenced easily.

Thanks again,

D

BillyRayPreachersSon · Jan 25, 2005

For reference, I would recommend the O'Reilly books - both the JavaScript and DHTML ones. That, and MSDN online:

http://msdn.microsoft.com

Hope this helps,
Dan

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!

Popup needed for lookup values...

DGK101

Programmer

BillyRayPreachersSon

Programmer

DGK101

Programmer

BillyRayPreachersSon

Programmer

Similar threads

Part and Inventory Search

Sponsor