Hi i use w3schools autocomplate tutorial. Link https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_autocomplete
I want to make multi choose. For example ; France and England for Country. Actually i saw multi choose example on Javascript but i need a variables. When i click send button my query executed so i need variables.
How can i do it ? and how can send value from input area to sql query ?
Image
It is difficult to understand what you're looking for in the way you phrased the question, but I will try answer based on how I understood the question.
First, I would add hidden input to contain array values under input ID: #myInput.
Try the following:
<input id="countries" type="hidden" value="countries[]" />
<input type="button" value="add" onclick="addCountry">
As you see, I bind click event to the button so function would be:
function addCountry(){
const countries = document.querySelector('#countries');
const country = document.querySelector("#myInput");
countries.value = [...countries.value, country.value];}
So, when you submit form, you will be able to get this from a PHP file
with []
$countries = $_POST['countries'];
Alternatively you can use $_GET instead.
Related
I'm trying to prepare my first Greasmonkey script (with no experience in javascript/websites technologies) and I have problem with selecting field on a page. It is:
<input data-testid="user/fullName" autocomplete="name" class="form-control u-text-normal">
I've tested:
document.querySelectorAll("input.form-control");
document.querySelectorAll("input.form-control.u-text-normal");
document.getElementById("user/fullName").value
but non of them is returning what I need... and what I need is possibility to fill that form field with the script. Could you help, please?
EDIT:
The methods given in the following answers I try to run in the browser console and they do not return me any element. Maybe someone could try to run it and tell me what I'm doing wrong? The website is a shopping cart on the pizza site :) But to see it you need to add pizza to cart ("Do koszyka") for a minimum of 20 zł and then go to payment ("Do kasy"). Then the first field "Imie i nazwisko" is what I would like to fill at the beginning.
If you need to get a single element, give the html element an id example:
<html>
<input id='id_here'data-testid="user/fullName" autocomplete="name" class="form-control u-text-normal">
</html>
then get the element using
document.getElementById('id_here');
For multiple elements that share the same class you could use the query selector
document.querySelector('.form-control')
Is this what you wanted?
var example = document.querySelector('.form-control').value;
document.write(example);
<input data-testid="user/fullName" autocomplete="name" class="form-control u-text-normal" value="test">
If you only want to select this element, use the most specific thing, in this case data-testid:
var x = document.querySelectorAll("[data-testid='user/fullName']")
console.log(x[0].value)
to select the element (here we select with the class and the data property to be the most accurate) =>
var element = document.querySelector('.form-control[data-testid="user/fullName"]');
After if you want add some value in this input =>
element.value = "My_value";
Regards
You can add 'id' or select your field by querySelector
let input = document.querySelector('[data-testid="user/fullName"]')
input.value='abc';
myField.value += '123';
<input id="myField" data-testid="user/fullName" autocomplete="name" class="form-control u-text-normal">
Update
I try my method and it works pizza site which you mention in your question update:
But it looks like that console 'see' dom input element after you find it using right click> inspect element - strange
I am using localStorage where in I am able to store in previous page and retrive it in this page. (Checked it using alert).
name12=localStorage.getItem("content");
Now my requirement is to display it into the input field and make it non-editable.
Please help me out with it. I have tried different things but I am not able to get it right.
Used onblur="localStorage.setItem(this.name, this.value) in the input tag
and also tried to use
if name_2.value = name12; in script tag
To make a field uneditable, you can use the html attribute disabled on the input field. http://www.w3schools.com/tags/att_input_disabled.asp
To set a default value for a field, you can use the html attribute value. In your case since the value is dynamic, you probably want do not want to do that inline in the html. One possible solution is to set the value attribute through javascript like below.
<script type="text/javascript">
var name2 = document.getElementById("name_2");
name2.value = localStorage.getItem("content");;
</script>
Set the value of an input field
You have to assign the value to input using javascript.
<input username" id="name_2" type="text" placeholder="name" name="name_2" required="required" autofocus="autofocus">
<script>
var n = "5"; // read from storage here
var inpt = document.getElementById("name_2");
inpt.value = n;
inpt.disabled = true;
</script>
There are many places to find this information. Try reading the jquery documentation when you get stuck. For example, here is a page that describes how to set the value of an input element. StackOverflow also has many questions about this topic. A quick google search brings up this question about setting the value of input elements. We can also find SO questions about disabling input elements easily, like this one.
I encourage that you attempt to use more resources to find what you need before bringing your questions here.
Based on the answers to the questions I linked, we can set the input and then disable it to keep the value from changing:
$('#input').val(name12);
$('#input').prop('disabled', true);
I have an input field that I want to make it readonly for the users, and only the admin can change it .
<input value="http://google.com" class="form-control" readonly></div>
if you want do this as other said, you must have a database gestion, anyway the code that you must have is like:
<input id ="label1" value="http://google.com" class="form-control" readonly></div>
<script type="text/javascript">
var isAdmin = "1" //this variable must be valorized with a flag or something that is supposed to be, for example 0 for users 1 for admins
if(isAdmin==1){
var checkVisible = document.getElementById("label1");
checkVisible.readOnly= false;
}
</script>
for sure it's not a professional solution but this can give to you and idea how it works
2 simple ways to do this.
1st you can incorporate javascript inside in your jsp. Then create function that would hide your the field that can be editted if the user is not admin.(Then show only the read-only or text field) Then show it otherwise which seemed a little complicated this way.
But anyway, 2nd is you can use jsp standard tag library or jstl.. use . It works like a switch with case statements :) for reference please see: http://www.tutorialspoint.com/jsp/jstl_core_choose_tag.htm
First post on Stack, thanks in advance.
I have a webpage that has 8 different forms, and on submit, I would like each one to display a different set of strings that I have stored in JavaScript arrays. The code to display the array works fine when used with only one form on the page, but I can't get it to work with all 8.
I have assigned each submit button an id, and am trying to assign that id to a variable called "chosen button" on submit. "chosen button" ultimately corresponds to the appropriate array, but only if the id is assigned to the variable. Here is html code:
<form id="ipsum-form" action="#" method="post">
<input type="submit" class="button" id="corporate" value="And So Forth.." />
And Javascript (my array variables and switch statement are obviously much longer):
var chosen_button = $("#ipsum-form submit").id;
var corporateIpsum = ["corporate jargon", "etc etc"];
switch (chosen_button){
case "corporate":
words = corporateIpsum;
break;
}
Is this the correct way to assign the submit button's ID to the variable? If not (or if this doesn't work for what I want), how can I make this work?
Cheers and I look forward to posting and learning more here in the future.
easy:
var chosen_button = $("#ipsum-form [type='submit']")[0].id;
or plain js:
document.forms[0].querySelectorAll('input[type="submit"]')[0].id;
Try var chosen_button = $('#ipsum-form .button').attr('id');. You can also use handlers to get the object (more useful in some situations) ex:
$('#ipsum-form input[type="submit"]').click(function () {
var chosen_button = $(this).attr('id');
// more code.
});
EDIT: Little bit more correct.
I want to copy the content of a sharepoint form field to a variable using Javascript.
Eg. I have a field named "Language" in my sharepoint edit form. Now I just want to get the value of that field to a varaible x.
Please help.
BR
It depends on the type (e.g. user, lookup, multilookup, text, note, etc.) of field. I am using jQuery in my custom list forms and the name of the field for any given content type will be added to the id of the corresponding html control with the text 'Field' appended to it. However, like any typical asp.net control, the id of the html form control rendered to the client will reflect its control hierarchy so you have to account for that when searching for a field. anyhow, the following works for me if i need to reference fields in my custom forms. ** notice the +Field which implies that the name of the field is concatenated with 'Field'
var $titleField = $('input[id*=TitleField]');
var $lookupField = $('select[id*=Name_Of_Field+Field]')
var $multiLookUpCandidate = $('select[id*=Name_Of_Field+Field][id*=SelectCandidate]')
var $multiLookUpResult = $('select[id*=Name_Of_Field+Field][id*=SelectResult]')
var $note = $('textarea[id*=Name_Of_Field+Field]');
You can pick up on the trend by viewing source and seaching for your contenttype/sitecolumn field name. You will find it in an html form control id. use that information to learn how to reference other field types.
Without posting your code its very difficult to understand what you want to do.... to get a value from a form you can do the following :
HTML
<form id="myform">
<input id="myinput" type="text" value="something" />
</form>
JavaScript:
var myinputval = document.getElementById("myinput").value;
myinputval would be "something" in this example
Demo : http://jsfiddle.net/Qk6FZ/
This might help:
http://depressedpress.com/2012/09/24/obtaining-a-javascript-reference-to-a-sharepoint-field/
Using that function you'd get the reference using something like:
var LanguageFld = getFieldRef("Language");
Once you have the refernece it's easy to get the value:
var CurValue = LanguageFld.value;
Hope this helps!