<form action="search.php?q=VALUE" type="post" />
<input type="text" id="textbox" name="poster" size="25" />
<input type="submit" class="button" value="Go" />
</form>I have this form....What I want is for where it says VALUE to change in the forms action to be the same as what is in the textbox.
I cant find anything on the internet that will do this seemlessly without the user noticing.
By the way Im a complete javascript newbie, so treat me gently :p
Jump to Postthis is an example I found elsewhere (http://www.dynamicdrive.com/forums/showthread.php?t=8900):
<select size="1" onChange="this.form.action=this.options[this.selectedIndex].value;"> <option value="default.php">Select action</option> <option value="bob.php">Bob</option> <option value="joe.php">Joe</option> </select>Obviously not the same situation as yourself, but it should be modifiable to fit your needs.
Jump to PostThis should do it!
This demo will include the value of textbox in the action attribute and replace "VALUE" equals to the user inputed text-value. I've included some alert, so you can see (or check) if the value in action has been replaced by the inputed text.
If you're done …
this is an example I found elsewhere (http://www.dynamicdrive.com/forums/showthread.php?t=8900):
<select size="1" onChange="this.form.action=this.options[this.selectedIndex].value;">
<option value="default.php">Select action</option>
<option value="bob.php">Bob</option>
<option value="joe.php">Joe</option>
</select>Obviously not the same situation as yourself, but it should be modifiable to fit your needs.
This should do it!
This demo will include the value of textbox in the action attribute and replace "VALUE" equals to the user inputed text-value. I've included some alert, so you can see (or check) if the value in action has been replaced by the inputed text.
If you're done then simply remove that alertbox from the (onsubmit) eventHandler(s).
<form action="search.php?q=VALUE" type="post" onsubmit="javascript:this.action.replace(/VALUE/\ig,(document.getElementById('textbox').value)); alert(this.action);" />
<input type="text" id="textbox" name="poster" size="25" />
<input type="submit" class="button" value="Go" />
</form>Sorry silly i didnt notice that you've got your post in here. Got it late...
essential, thanks for your code it worked great. But ive got another problem.
On my site I have a search feature which comes up in a javascript lightbox. What I want to do is to open that lightbox when the form is submitted.
My site is http://www.theflickzone.com - If you click the extras drop down menu then click poster search you will see what I mean.
So when i check your document this what i've got Click Me!
So it'l be more nice if you can provide the actual code (or the actual images that correspond to your lightbox, which you want to open before submission) that you wish to process upon submission of your form(s).
Im using a PDA, so probably i missed some of feature's of your site, that take concerns' from this recent issue that you have.
So when i check your document this what i've got Click Me!
So it'l be more nice if you can provide the actual code (or the actual images that correspond to your lightbox, which you want to open before submission) that you wish to process upon submission of your form(s).
Im using a PDA, so probably i missed some of feature's of your site, that take concerns' from this recent issue that you have.
The lightbox opens an iframe, the iframe contains this page . That page has a form in it.
I want that form to be somewhere else on the site but i want it to open that query in the iframe if you know what I mean.
You can see the lightbox by visiting http://www.theflickzone.com and clicking this link:
[IMG]http://i39.tinypic.com/2dt2al0.png[/IMG]
Well, i cant provide you the exact solution to your code(s).
But here's a simple demo, that will give you idea on how to work with such things...
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<title>JavaScript Demo</title>
<style type="text/css" media="all">
/* <![CDATA[ */
ul {
list-style-type: none;
color: #365d95; }
.show { display: normal; }
.hide { display: none; }
/* ]]> */
</style>
<script type="text/javascript">
/* <![CDATA[ */
function demo() {
extra = document.getElementsByTagName('ul')['extras'];
extra.getElementsByTagName('li')[0].onmouseover = function()
{
extra.getElementsByTagName('li')[1].className = 'show';
extra.getElementsByTagName('li')[1].onclick = function() {
document.getElementsByTagName('div')['myFrame'].className ='show';
} }
}
window.onload = demo;
/* ]]> */
</script>
<base target="_top" />
</head>
<body>
<!--
<div>
<ul id="extras">
<li>Extras</li>
<li class="hide">Poster Search</li>
</ul>
</div>
<div id="myFrame" class="hide">
<iframe src="./yourQueryPage.html" width="300" height="200"></iframe>
</div>
</body>
</html>We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.