I am building a search form that has a text input and a submit button (doh!). My routes.rb file contains:
get ':dependency', to: 'pages#dependency'
This means that whatever I put after / will route to PagesController#dependency, having params[:dependency] set to whatever string is set in the URL.
I would like to build a form that, upon submission, will go to /<value-from-text-input>, dynamically using the value supplied in the text input. How can I do this? It would be great if I don't have to use JavaScript.
Yeah this is a simple form action.
<form action="/" method="get">
<input type="text" name="dependency"/>
</form>
Because Rails is configured on the root '/' this will submit the form at a get action, appending the values to the end as a query string, which rails then converts to the cleaner route.
Related
Below is my Javascript code where k and m are Javascript variables.
function javascriptfunction() {
document.forms[formname].action="gotopage.php?parameter1="+k+"¶meter2="+m;
document.forms[formname].submit();
}
The above code executes correctly when my HTML form has a POST method. Below is my HTML page:
<form name="formname" action=# method=POST>
<input type=text name="data1" value="one">
<input type=text name="data1" value="two">
<input type=button name="button1" value="send" onclick="javascritfunction();">
</form>
But when I give a GET method in my HTML form, then the HTML form data is submitted i.e
gotopage.php?data1=one&data2=two is submitting not Javascript action value i.e
gotopage.php?parameter1="+k+"¶meter2="+m
So how to submit the form with Javascript parameter when the method is GET in the HTML form?
Submitting a GET form will replace the query string in the action with the form data.
Put the data in hidden inputs instead.
In a GET request the form data has nowhere to 'go' other than in the query parameter string. So as Quentin points out, the query string gets automatically swapped out with the form field key value pairs. So you must use hidden fields to include extra data.
In a POST request you've also got the query parameter string available, if you want to use it, but the form data gets inserted into the request payload (which a GET request does not have), so does not interfere with the query string. That's why you can customise the action url with whatever query string you like.
I'm using a site builder tilda.cc.
They don't let you edit the HTML of their own elements.
But you can add an HTML block, where JS is allowed.
What I'm trying to do, is figure out, how can I add one of the form input values, to the redirect URL as a GET element.
For example:
User enters a form field.
On clicking to another form field, the code should add to the redirect URL the value that the user just entered.
For example, if user entered email#domain.com, the JS code would add it as a GET parameter to the redirect link.
Redirect.com/success?email=email#domain.com
Is it even possible to do it like this?
This is the basic code, how the form looks like:
<form action method="POST" data-success-url="redirect.com/success">
<input type="text" name="Email">
</form>
I can get the email to be displayed as an alert:
<script>
$('form').change(function() {
alert('email input value: ' +
$(this).find('input[name=Email]').val());
});
</script>
But how would I actually go about adding it to the "data-success-url"?
I have the following form which is used to redirect the user to search a particular date.
<form action="/datesearch/" method="get" id="goto_date_form" style="display:none;">
<input name="dt" type="text" />
<input type="hidden" name="csrfmiddlewaretoken" value="[my csrf token value]">
</form>
When this form is called with $('#goto_date_form').submit();, it does redirect the page, but it displays both the value of dt and the value of csrfmiddlewaretoken as URI variables.
i.e. when searching for 2016-07-06 it redirects to
`http://localhost:8000/datesearch/?dt=2016-07-06&csrfmiddlewaretoken=[my csrf token value]`
How can I get it to stop displaying the csrf token?
Simply change method="get" to method="post" (and also back end too)
When you use GET in a form, all the data in the form is placed in the URI. If you change your form to use POST instead, the data will be put in the request body - not visible in the URI (but still visible to the user if the user decides to view the Request details).
NOTE if you change from GET to POST, you might have to make some changes in your server side code as well, depending on the method you are using to fetch the data.
Use method="post" in form tag to prevent data passing in url
I have a simple form in a PHP application that I have to submit via POST method. Something like:
<form action="URL?page_id=10" method="POST">
<select name="some_name" id="some_id">
<option value='1'>...</option>
<option value='2'>...</option>
...
</select>
...
//submit button here
</form>
The goal is to go to the following URL on submit:
URL?page_id=10&selected_id=SELECTED_ID
where SELECTED_ID is the value chosen by the user from the select drop down menu in the form. I've done it by converting the whole form to post the parameters as GET as I need to have this SELECTED_ID visible in the URL. However, another requirement turned up saying that I need to pass everything through POST and still have the SELECTED_ID visible in the URL and now I'm looking for alternatives.
So the question gets down to: how can I add dynamically another GET parameter to the URL upon POST form submission with one of the values submitted with the form?
first you have to add a id to your form as below
<form id='form1' action="URL?page_id=10" method="POST">
then add call below function on your button click
function test(){
$('#form1').attr('action', $(this).attr('formaction')+'&selected_id='+$('#some_id').val());
}
use <form method="GET"> .. all the field values will be appended to the url automatically
Below is my Javascript code where k and m are Javascript variables.
function javascriptfunction() {
document.forms[formname].action="gotopage.php?parameter1="+k+"¶meter2="+m;
document.forms[formname].submit();
}
The above code executes correctly when my HTML form has a POST method. Below is my HTML page:
<form name="formname" action=# method=POST>
<input type=text name="data1" value="one">
<input type=text name="data1" value="two">
<input type=button name="button1" value="send" onclick="javascritfunction();">
</form>
But when I give a GET method in my HTML form, then the HTML form data is submitted i.e
gotopage.php?data1=one&data2=two is submitting not Javascript action value i.e
gotopage.php?parameter1="+k+"¶meter2="+m
So how to submit the form with Javascript parameter when the method is GET in the HTML form?
Submitting a GET form will replace the query string in the action with the form data.
Put the data in hidden inputs instead.
In a GET request the form data has nowhere to 'go' other than in the query parameter string. So as Quentin points out, the query string gets automatically swapped out with the form field key value pairs. So you must use hidden fields to include extra data.
In a POST request you've also got the query parameter string available, if you want to use it, but the form data gets inserted into the request payload (which a GET request does not have), so does not interfere with the query string. That's why you can customise the action url with whatever query string you like.