We Keep Coding

Get full URI of Form Action - JavaScript

I've got the following form:
<form action="/action_page.php" method="get">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit">
</form>
Once the user hits submit, the full URL will look like this: example.com/action_page.php?fname=John&lname=Doe. I want to be able to grab the full URL of the form like you would if you called document.getElementById("form").action;
Is there a native method in either JavaScript or jQuery that will allow me to grab this URI? I'm wanting to save the full URL in a cookie. I know that I could technically parse each input value and build a string but I was wondering if there was a more simple way about to do this.
Thanks in advance.

var href = $('form').attr('action')+ '?' +$('form').serialize();
Is this what you need? There may be some additional work for checkbox/radio field types.

Input button value is used to append a URL

I'm looking for a boilerplate smart way to take the input value, append it to a fixed url like /search/inputboxvalue and send the user there. Is there anyway smart robust way to do it? I could use an onlick handler and a form but I wondered if there is a more elegant way to do it, pref just using javascript.
My code:
<input name="search" id="search" value="" type="text" width="650px"></input>

Try this:
var my_value = document.getElementById('search').value;
window.location.href = window.location.href + my_value

Use following statment to get value from text box and append to current url.After append it will redirect user to that url.
input_box_value = jQuery('#search').attr('value');
window.location.href = window.location.href + input_box_value
Above 2 statement can be insert on particular event.like click

This is not really correct way to form requests. This symbol "/" should tell us, that we go to subdirectory, or its analog. So, to form this type of url, you will need to use javascript.
But, there is more easy way to create this type of request. Native:
<form id="search" method="get" action="search">
<input type="text" name="q" value="" />
<button type="submit">Search</button>
</form>
This small HTML snippet will allow you to visit an url: site.com/search?q=inputboxvalue without any JS. You may even hide submit button and just use Enter to search.

How to copy a value from one form's file upload field to another form's text field?

I have one page with two different forms on it. The first form allows a user to upload and email an image file, the second form generates a URL based on the user input.
In order to add the image name to the URL, I need to have a field in the second form that copies the image name from the field in the first form (I'd rather not have to make the user browse for and select the image twice on one page). The best way I've found to copy data from one field to another across forms is this jQuery code: http://jsfiddle.net/nA37d/, but it doesn't work for my purposes. For example it works from text field to text field beautifully, but it doesn't work from file field to text field, or file field to file field.
Is there a way to grab the value of the file field in form 1 and copy it to any kind of field in form 2? Here is my basic code:
<script type="text/javascript">
$(function(){
bindGroups();
});
var bindGroups = function() {
// First copy values
$("input[name='logotoo']").val($("input[name='logoname']").val());
// Then bind fields
$("input[name='logoname']").keyup(function() {
$("input[name='logotoo']").val($(this).val());
});
};
</script>
<form action="#..." method="post" enctype="multipart/form-data">
<input type="file" name="logoname" value="1" />
<input type="submit" value="Upload" /></form>
<form name="form2" action="/url/" method="get">
<label>Logo Name</label> <input type="text" name="logotoo" />
<input type="submit" value="Generate URL" /></form>
Thanks for any help you can give!

Just use change() handler for input type file, not keyup:
http://jsfiddle.net/nA37d/169/
$("input[name='a1']").change(function() {
$("input[name='b1']").val($(this).val());
});
For input file to input file, i dont think its possible for security reason.
BTW, this code should be refactorized.

Using GET Request submit form to the Page Itself

What I need is when the user types his query in the search Box.
<form class="navbar-search pull-left">
<input type="text" autocomplete="off" autofocus id="query" class="search-query search_input" placeholder="Type your query...">
</form>
I dont have a Button to submit the form. I want the form to be submitted when the user presses the Enter Key.
And when the user presses the Enter key I want the Query to be shown in the URL.
Like the URL before the submission
http://example.come/
And when the user enters his text and presses the enter key. I want the query to be displayed in the URL like this
http://example.come/#query
Without reloading the whole.
Is this possile using the Javascript or Jquery or whatever is more easy.
Edit:
Here's what I tried
window.location.hash = get_query ;
if (get_query.length != 0) {
$("#query").val(get_query);
$('.search_input').trigger('keyup'); // This is the Event which triggers
}

Add a input with type submit element which is hidden to support submitting by the enter key:
<form id="form1" class="navbar-search pull-left" action="">
<input type="text" autocomplete="off" autofocus id="query" class="search-query search_input" placeholder="Type your query...">
<input type="submit" style="display: none;">
</form>
On form submit change the hash with the value of the input:
$('#form1').submit(function() {
window.location.hash = '#' + $("#query").val();
return false;
});
Also see my example and the associated jsfiddle.

Form submission special behavior

I have a form that contains a "search" text input and a button.
When the user submits the form (using the button or the enter key) he is redirected to a specific page followed by the value he entered in the text field.
how could I achieve that?
I need a solution that runs correctly in different browsers !

Would it not be easier to define the method as GET and the action as the URL in the form tag?

Edit:
Yea I'm slow tonight:
<form method="GET" location="myNewPage.aspx" >
</form>
Add an onsubmit that calls a javascript function to your form tag and then in that function do a window.location to the page you want with the value of the textbox.
<script type="javascript">
function postData() {
var myVal = document.getElementById('searchbox').value;
window.location = "myNewPage.aspx?search=" + myVal;
}
</script>
<form onsubmit="javascript:postData();">
<input type="text" name="searchbox" id="searchbox" />
</form>