Is this possible?
I have input box and a submit button.
Assigned url is: www.mywebsite.com/ after clicking the submit button, the url to open by javascript is: www.mywebsite.com/print/hello123/
Check the demo: http://jsfiddle.net/Gv5bq/
HTML:
<input type="text" id="text" />
<input type="button" id="btn" value="Submit" />
jQuery:
$("#btn").click( function() {
var url = "http://www.mywebsite.com/print/" + $("#text").val();
window.open(url);
});
UPDATED: (simple JS version) http://jsfiddle.net/Gv5bq/1/
<input type="text" id="text" />
<input type="button" id="btn" value="Submit" onClick="javascript: window.open('http://www.mywebsite.com/print/' + document.getElementById('text').value);" />
If you do not want to use jQuery for that here is an approach in pure js.
Define your html-form:
<form action="http://www.mywebsite.com/" method="get" target="_blank" id="my-form">
<input type="text" name="reference-number" id="reference-number" value="" />
<input type="submit" value="submit" />
</form>
Define and attach the handler for submission:
<script type="text/javascript">
var form = document.querySelector('#my-form'),
text_field = document.querySelector('#reference-number');
function submitHandler(){
// build the new url and open a new window
var url = form.action + 'print/' + text_field.value;
window.open(url);
// prevent form from being submitted because we already
// called the request in a new window
return false;
}
// attach custom submit handler
form.onsubmit = submitHandler;
</script>
<input type="text" value="" id="id"/>
<button type="button" id="go">GO</button>
$('#go').click(function(){
var id=$('#id').val();
var url="http://www.mywebsite.com/hello";
var new_url= url+id;
window.open(new_url);
});
