Get to Post function - html

I got an URL in a html tag, so in a GET format :
http://toto.fr/grc/start.swe?SWECmd=ExecuteLogin&SWEAC=SWECmd=InvokeMethod&SWEMethod=GotoView&SWEService=GRC+Debranchement+Generique&BusObject=Contact&BusComp=Contact&ViewName=GRC+Contact+Synthetic+View&SWEUserName=titi&SWEPassword=toto&ValeurChamp=35925436&Champ=Person UId
I want to call it in POST. Is there a way to do this easily ?

You need to create an HTML form with all the URL parameters as hidden variables.
e.g.
<form action="http://toto.fr/grc/start.swe" method="POST">
<input type="hidden" name="SWECmd" value="ExecuteLogin" />
<!--- repeat for all other parameters --->
</form>

Replace the <form method="GET"> to <form method="POST">
if this doesn't work, could you post your code?

I've just been thinking about this again and if you really do need to have a link submit a POST request then it may be possible by giving the form an id attribute, create your link with an id attribute and then you can add a click event handler which will submit the form in Javascript.
See the mock-up code below (syntax may not be perfect!)...
HTML.
<form id="loginForm" action="http://toto.fr/grc/start.swe" method="POST">
<input type="hidden" name="SWECmd" value="ExecuteLogin" />
<!--- repeat for all other parameters --->
</form>
<a id="LoginLink" href="#">Login</a>
Javascript.
<script type="text/javascript">
var loginForm = document.getElementById('loginForm');
var loginLink = document.getElementById('loginLink');
loginLink.addEventListener('click', login);
var login = function() {
loginForm.submit();
}
</script>

Related

How do I remove a parameter with blank response from URL generated by the <form> tag?

I am writing a search box in HTML that takes the user input and append it to the URL as a parameter. The code of the form looks like this.
<form name="form" action="" method="get">
<input type="text" name="id" id="idresponse">
<input type="submit" value="Submit">
</form>
This will bring the user from example.com/test.html to example.com/test.html?id=12345678 assuming they entered 12345678 at the text box.
However, if the user inputted nothing and clicked Submit, they will be brought to example.com/test.html?id=, which I don't want. How can I modify the code so that the form knows that a certain field is left blank and do not send the parameter with the URL? In this case, the desired URL would be example.com/test.html.
edit 20210405 2057 changed the id of the input from idresposne to idresponse to avoid confusion
The so-called URL parameters is the querystring of the URL.
The following code does not use jQuery, but achieves a similar effect. (written by RobG)
<form name="form" onsubmit="disableEmptyInputs(this)" action="" method="get">
<input type="text" name="id" id="idresponse">
<input type="submit" value="Submit">
</form>
<script>
function disableEmptyInputs(form) {
var controls = form.elements;
for (var i=0, iLen=controls.length; i<iLen; i++) {
if (controls[i].value == '') controls[i].disabled = true;
}
}
<script>
This will remove all the parameters but the ? will still trail the URL. i.e. the URL will be example.com/test.html? instead. However, this does not matter because they both point to the same address.
Refer to these links (kindly provided by Progman) for other ways of doing this, including using jQuery.
Delete empty values from form's params before submitting it
Delete empty values from form's params before submitting it
How can I remove empty fields from my form in the querystring?
Thanks.

How would I post an html form but, still redirect to a thank you page after the form has posted? [duplicate]

This is my form code:
<form enctype="multipart/form-data" name="upload-file" method="post" action="http://example.com/upload">
<div class="formi">
<input id="text-link-input" type="text" name="url" class="link_form" value="your link" onfocus="if(this.value==this.defaultValue) this.value='';" onblur="if(this.value=='') this.value=this.defaultValue;" />
<input type="submit" value="OK" class="link_but" />
</div>
<div class="upl" title="Upload"><img src="http://example.com/example.png" alt="" style="vertical-align:middle;"/>Upload
<input type="file" name="file" size="1" class="up" onchange = "document.getElementById('text-link-input').value = String(this.value).replace('C:\\fakepath\\','')"/>
</div>
</form>
Now, I want to redirect the submitter to any page of my choice after the form data has been submitted, but the action resides on another website where I cannot edit. Is it possible to redirect the user to any page after he has submitted the data to that site?
From some Googling, this is what I have found. Adding this to form code:
onSubmit=window.location='http://google.com'
This didnt work. Maybe I didnt implement it correctly? This is what I did:
<form enctype="multipart/form-data" name="upload-file" method="post" onSubmit=window.location='http://google.com' action="http://example.com/upload">
Another person says adding a hidden field should work:
<input type="hidden" name="redirect" value="http://your.host/to/file.html">
How should I implement this is my code?
Suggestions and help awaited...
Try this Javascript (jquery) code. Its an ajax request to an external URL. Use the callback function to fire any code:
<script type="text/javascript">
$(function() {
$('form').submit(function(){
$.post('http://example.com/upload', function() {
window.location = 'http://google.com';
});
return false;
});
});
</script>

Remove "?query=" from my URL

So I am making a VERY simple Chrome extension which allows someone to click it, then type in a French word, it will then take the word and redirect you to a french dictionary.
Here is the relevant code:
<div id="pattern" class="pattern">
<form action="http://www.wordreference.com/fren/" method="get" class="f" target="_blank">
<input type="search" name="query" placeholder="Search Videos.." />
<input type="submit" class="btn search-submit" value="Search">
</form>
However this does not work, when I enter in a word, instead of taking me to
www.wordreference.com/fren/Bonjour
It takes me to
http://www.wordreference.com/fren/?query=Bonjour
Thanks in advance guys!
Should be noted changing the text query to 'a' will take me to
http://www.wordreference.com/fren/?a=Bonjour
Use POST method in form.
<form id="my_form" class="f">....</form>
target="_blank" is for a tag (not in form):
Test url
If you want to change the output URL.
Try to use redirect method (script) like:
window.location.href = custom_url+'?'+form.serialize();
Sample script for Form submit:
<script type="text/javascript">
$(document).readY(function(){
$("form#my_form").on("submit", function(event){
event.preventDefault();
var parameters = $(this).serialize();
window.location.href = "?a=" + parameters;
});
});
</script>
Modify the url as you wish.

HTML Form Redirect After Submit

This is my form code:
<form enctype="multipart/form-data" name="upload-file" method="post" action="http://example.com/upload">
<div class="formi">
<input id="text-link-input" type="text" name="url" class="link_form" value="your link" onfocus="if(this.value==this.defaultValue) this.value='';" onblur="if(this.value=='') this.value=this.defaultValue;" />
<input type="submit" value="OK" class="link_but" />
</div>
<div class="upl" title="Upload"><img src="http://example.com/example.png" alt="" style="vertical-align:middle;"/>Upload
<input type="file" name="file" size="1" class="up" onchange = "document.getElementById('text-link-input').value = String(this.value).replace('C:\\fakepath\\','')"/>
</div>
</form>
Now, I want to redirect the submitter to any page of my choice after the form data has been submitted, but the action resides on another website where I cannot edit. Is it possible to redirect the user to any page after he has submitted the data to that site?
From some Googling, this is what I have found. Adding this to form code:
onSubmit=window.location='http://google.com'
This didnt work. Maybe I didnt implement it correctly? This is what I did:
<form enctype="multipart/form-data" name="upload-file" method="post" onSubmit=window.location='http://google.com' action="http://example.com/upload">
Another person says adding a hidden field should work:
<input type="hidden" name="redirect" value="http://your.host/to/file.html">
How should I implement this is my code?
Suggestions and help awaited...
Try this Javascript (jquery) code. Its an ajax request to an external URL. Use the callback function to fire any code:
<script type="text/javascript">
$(function() {
$('form').submit(function(){
$.post('http://example.com/upload', function() {
window.location = 'http://google.com';
});
return false;
});
});
</script>

Form value creates a URL

I am trying to create a very simple form with a little bit of extra code to get the results as described below: the problem is I don't know how to go about doing it.
What I am trying to achieve:
I have a form which has one text input box with the name 'url'. I want the user to be able to input a number into the box. When the user submits the form they should be redirected to a new website. The new website's URL will be based on the number inputted into the form.
The first part of the URL will always be: http://name.com/
Then the number that the user inputted will be attached to the end. So if 123456 is entered into the form then on submission of the form the user would be taken to http://name.com/123456
How can I get this working? I am guessing it will require JavaScript or something.
<script>
function process()
{
var url = "http://name.com/" + document.getElementById("url").value;
location.href = url;
return false;
}
</script>
<form onSubmit="return process();">
URL: <input type="text" name="url" id="url">
<input type="submit" value="go">
</form>
You can add onsubmit="this.action='http://google.com/'+this.fieldName.value;" to your tag.
This should do it:
<script type="text/javascript">
function goToPage() {
var page = document.getElementById('page').value;
window.location = "http://name.com/" + page;
}
</script>
<input type="text" id="page" />
<input type="submit" value="submit" onclick="goToPage();" />