How can I add text to a entered input value - html

How can I add a string to the text written by the user of my form?
For example, if he wants to search for "test", my form should submit "site:mysite.de test".
(The name where I'm trying to send the string to is q.)
I tried with
<form action="https://searx.me" method="get" accept-charset="UTF-8">
<input type="text" name="q" placeholder="Search with Searxes" required>
<input type="hidden" name="q" value="site:mysite.de">
</form>
How expected only the first value is submitted https://searx.me/?q=test
I would prefer a solution with pure html without javascript.

Here is an ugly way to do that, looks like binding ;)
var hidden = document.getElementsByClassName('hidden')[0];
var hidden_attr = hidden.getAttribute('value');
var show = document.getElementsByClassName('show')[0];
function magic(){
hidden.setAttribute('value', hidden_attr + show.value);
console.log(hidden.getAttribute('value'));
}
<form action="https://searx.me" method="get" accept-charset="UTF-8">
<input class="show" onkeyup="magic()" type="text" name="q" placeholder="Search with Searxes" required>
<input class="hidden" type="hidden" name="q" value="site:mysite.de ">
</form>

Related

html form input method get prevent name in url if value is not filled

Let's say this is my html in reactjs/jsx:
<form action="/search-list" method="GET">
<label for="fname">First name:</label><br>
<input type="text" id="fname" name="fname"><br>
<label for="lname">Last name:</label><br>
<input type="text" id="lname" name="lname"><br><br>
<input type="submit" value="Submit">
</form>
and when i click on the submit buttoin without inputing anything, it make the url like this fname=&lname=
and when i fill anly fname and submit, the url become like this fname=JhonDoe&lname=
Notice here, i didn't fill the lname, yet the lname is here in url which i dont want.
I want, if a field has value, that field should be in url as query params, if not field, that field should not be in url query params.
is it possible to do? how can I do it? All the fields should be optional.
You can use this plain JavaScript to remove the empty inputs from submitting.
<form method="GET" id="myForm">
<label for="fname">First name:</label><br>
<input type="text" id="fname" name="fname"><br>
<label for="lname">Last name:</label><br>
<input type="text" id="lname" name="lname"><br><br>
<input type="submit" value="Submit">
</form>
<script>
Form = document.getElementById("myForm");
Form.addEventListener('submit',()=>{
if(Form.fname.value == ""){
Form.fname.name ="";
}
if(Form.lname.value == ""){
Form.lname.name ="";
}
Form.submit();
});
</script>

post not send form data

I have a problem with sending posts in codeigniter, reading other posts I set the variable max_input_vars = 1000. but does not send the data.
the resulting in html is:
<form id="0" action="CO_controller" method="post">
<input id="idric_0" value="0.02508800 154401490122">
<input id="name_0" value="val0">
<input id="per_0" value="10">
<input id="unit_0" value="g">
<input id="ric_0" value="0.02508800 1544014901">
<input id="command0">
<input id="mod0" type="submit" value="Modific" onclick="document.getElementById('command0').value = 'modific';">
<input id="eli0" type="submit" value="Deleta" onclick="document.getElementById('command0').value = 'deleta';">
<input id="id_sal0" value="0.02508800 1544014901">
</form>
<form id="1" action="CO_controller" method="post">
<input id="idric_1" value="0.02508800 154401490122">
<input id="name_1" value="val0">
<input id="per_1" value="10">
<input id="unit_1" value="g">
<input id="ric_1" value="0.02508800 1544014901">
<input id="command1">
<input id="mod1" type="submit" value="Modific" onclick="document.getElementById('command1').value = 'modific';">
<input id="eli1" type="submit" value="Deleta" onclick="document.getElementById('command1').value = 'deleta';">
<input id="id_sal1" value="0.02508800 1544014901">
</form>
the operation is correct ie when I click the button, set the value of the command and submit.
in debug, I go to see the variable $ _POST and it is empty
As said in the comment, you should use name instead of id. By using id you are not passing the values correctly.
Unless you have a route defined so that CO_controller points to a method (and not just a controller) this is not going to work:
<form id="0" action="CO_controller" method="post">
Your form action should point directly to the method within the CO_controller controller which will process the form input.
Assuming the method within the controller is called process_form your form should point to:
<form id="0" action="CO_controller/process_form" method="post">
give it a go and let us know how it works

Form submit to a text field

How to make a form that submit to a text field below
<form action="">
Text: <input type="text" name="firstname">
<input type="submit" value="Submit"><br><br>
Post text: <input type="text" name="firstname">
</form>
You will need to use JavaScript for that:
<script>
function submitted() {
formValue = document.getElementsByName("firstname")[0].value;
document.getElementsByName("firstname")[1].setAttribute("value", formValue); // Copy the value
return false;
}
</script>
<form onsubmit="return submitted()"> <!-- Call submitted when the form is submitted -->
Text: <input type="text" name="firstname">
<input type="submit" value="Submit"><br><br> Post text: <input type="text" name="firstname">
</form>
However, there is no need for a form for that. The onsubmit attribute is mostly used for when you want to alert the user that the form was submitted; the actual submission is done on the server through PHP or something else, and not through JavaScript (since the user has access to the JavaScript code and could change the input checking process as he wishes). Here you could simply have something like this:
<script>
function submitted() {
formValue = document.getElementById("firstname").value;
document.getElementById("postFirstname").setAttribute("value", formValue); // Copy the value
}
</script>
Text: <input type="text" id="firstname">
<button onclick="submitted()">Submit</button>
<br><br> Post text: <input type="text" id="postFirstname">

HTML label control doesn't pass form data to controller

This format of html form control doesn't pass form data
<form action="index.php?action=createNewCustomer"
method="POST">
<fieldset>
<label class="field" for="firstName">First Name:</label>
<input type="text">
</fieldset>
<input type="submit">
</form>
but this one does
<form action="index.php?action=createNewCustomer"
method="POST">
<fieldset>
<label>First Name:</label>
<input type="text" name="firstName">
</fieldset>
<input type="submit">
</form>
Unless I'm missing something obvious, the difference is in the label control..Are both valid and if so, can anyone explain to me why only the second one passes form data to my PHP controller method.
<input type ="submit"> is not part of the fieldset in the first bit of code, but I don't think that's really the issue.
I believe changing the code on the first bit to:
<form action="index.php?action=createNewCustomer"
method="POST">
<fieldset>
<label for = "firstName">First Name: </label>
<input type="text" name = "firstName">
<input type="submit">
</fieldset>
</form>
will work. You need to make sure the name of the input is the same as the property you are trying to set.

Passing parameter and user input

I am trying to pass a few parameter and a user input to a search_form.asp page.
<form action="search_form.asp" method="Post">
<input type="text"name="fname"/></th>
<input type="submit" value="Update">
</form>
And on search_form.asp...
lname=request.QueryString("Lname")
fname=request.form("fname")
But I am unable to see lname when i place Response.Write("<p>Name: " & lname) in search_form.asp
The query string is not preserved when you submit the form, so search_form.asp will not have a query string. As an alternative, could you include the query string as a hidden field:
<form action="search_form.asp" method="Post">
<input type="text"name="fname"/></th>
<input type="submit" value="Update">
<input type="hidden" name="lname" value="<%=Request.QueryString("lname")%>" />
</form>
And then refer to Request.Form("lname") in search_form.asp.
Alternatively, could you include the query string in the form action?
<form action="search_form.asp?<%=Request.ServerVariables("QUERY_STRING")%>" method="Post">
<input type="text"name="fname"/></th>
<input type="submit" value="Update">
<input type="hidden" name="lname" value="<%=Request.QueryString("lname")%>" />
</form>
This should pass the query string on the original page when the form is submitted.