I have an input box...
<input type="text" id="search_member" onkeyup="lookup(this.value);">
When I type in the field, it will go to function lookup(). From there I want to get the id of this input. I tried...
var This_id = $(this).attr("id");
but this won't work. Any suggestions on how I can get the id?
Because you are passing this.value to your lookup() function. It's better to pass this to your function and then use arg.value to get the value and arg.getAttribute('id') for the id
<input type="text" id="search_member" onkeyup="lookup(this);">
function lookup(arg){
var id = arg.getAttribute('id');
var value = arg.value;
// do your stuff
}
Get rid of onkeyup="lookup(this.value);
<input type="text" id="search_member">
and then use
$(function(){
$("#search_member").keyup(function(e){
var This_id = $(this).attr("id");
});
};
$(document).keyup(function(e) {
if (e.currentTarget.activeElement != undefined) {
var id = $(e.currentTarget.activeElement).attr('id');
}
});
The problem there is you're not passing the element in, you're passing the value. You need to change it to this:
<input type="text" id="search_member" onkeyup="lookup(this);">
Then the rest of your code should work fine.
why dont you give the function lookup the THIS?
lookup(this);
then u can also use the code you suggested
To get the id you should use this.id not this.value. I hope it work with you
Related
Very new to JavaScript/HTML, help!
I have 2 text boxes and a submit button. I am trying to retrieve the data from each of them using JavaScript and for the time being, simply put them into an alert box.
However, on clicking the button, the alert just reads 'undefined', help!
Here's a code snippet:
function submitApp() {
var authValue = document.getElementsByName("appAuthor").value;
var titleValue = document.getElementsByName("appTitle").value;
alert(authValue);
}
<input type="text" name="appAuthor" size="" maxlength="30" />
<input type="text" name="appTitle" maxlength="30" />
<input type="button" value="Submit my Application!" onclick="submitApp()" />
getElementsByName() returns a list. So you can grab the first item in the list:
document.getElementsByName("appAuthor")[0].value
.getElementsByName() method returns an array-like node list, so you'll need to specify an index in order to retrieve a specific input's value (because the value property only applies to DOM elements, not an entire list).
function submitApp() {
var authValue = document.getElementsByName("appAuthor")[0].value;
var titleValue = document.getElementsByName("appTitle")[0].value;
alert(authValue);
}
Just add this jQuery to a document.ready section like this:
$(document).ready(function() {
$('#submit').on('submit', function(e) {
e.preventDefault();
submitApp();
});
function submitApp() {
var authValue = document.getElementsByName("appAuthor")[0].value;
var titleValue = document.getElementsByName("appTitle")[0].value;
alert(authValue);
}
});
<input type="submit" id="submit" value="Submit my Application!">
If you want to submit the form remove the e.preventDefault();, but if you just want the value updated keep it in there to prevent form submition.
You could potentially change the button type into a submit-type and do something like this:
$('body').find('form').on('submit', function(e){
e.preventDefault();
var authValue = $('input[name="appAuthor"]').val();
var titleValue = $('input[name="appTitle"]').val();
//...here do whatever you like with that information
//Below empty the input
$('input').val('');
})
Or just interpret the form as an array to make your life easier and clean the code up.
When you use getElementsByName or getElementsByClassName, it returns array of elements, so you should put index to access each element.
authValue = document.getElementsByName("appAuthor")[0].value;
I am trying to get the values of each of the input field that are under same set. Below is my code:
Input field 1:
<input type="text" maxlength="255" name="amount[]" >
Input field 2:
<input type="text" maxlength="255" name="amount[]" >
and so on....the number of fields are variable.
Now I want to get the values the user typed in each of the field that is named . How to do that in jquery?
I have tried following code but it returns nothing:
$("input[name=amount[]]").val();
you can get all values in an array
var values = $('input[name="amount[]"]').map(function(){
return this.value;
}).get();
console.log(values);
Demo ---> http://jsfiddle.net/BFjp5/
Since there are multiple element with same name you need indexing:
$("input[name='amount[]']")[0].value;
Here is demo
and for getting all elements values:
$("input[name='amount[]']").each(function (i,v) {
alert(this.value);
});
Here is demo
by javascript
function getValues(){
var ids=document.getElementsByName('amount[]');
var ary=new Array();
for(var i=0;i<ids.length;i++){
ary[i]=ids[i].value;
}
return ary;
}
$("input[name='amount[]']")
This will get you a set of elements. You can get value of each of those elements by iterating over them.
$("input[name='amount[]']").each(function(){
$(this).val();
});
Try to pass the attribute value as a string since [ and ] are meta-characters,
var values = $("input[name='amount[]']")
.map(function(){ return $(this).val() })
.get().join('');
DEMO
You don't!
The whole point of ID's in the DOM is that they are unique.
I need to get values of all textboxes with same name attributes using jquery.
<input type="text" id="text1" name="text[]">
<input type="text" id="text2" name="text[]">
<input type="text" id="text3" name="text[]">
How can I get all values of textbox text[] and compare it using jquery.
I tried using
var values = $("input[name='text[]']")
.map(function(){return $(this).val();}).get();
but am no successful.
You can use map method and store the values into an array.
$(function(){
var values = $('input[name="text[]"]').map(function(){
return this.value
}).get()
})
http://jsfiddle.net/UugWW/
This one should work :
$('input[name="text[]"]');
You can loop on it to get all values.
$('input[name="text[]"]').each(function() {
alert($(this).val());
});
Let's split the requirement into smaller problems.
First you want to select all those inputs.
var $inputs = $("input[name='text[]']")
It returns a jQuery object, containing all the input named text[].
You also might not need to use square brackets into the name.
var inputs = $inputs.get();
Extract the matching elements into a plain Array, so that we can now access Array's prototype methods, such as Array.prototype.map.
var values = inputs.map(function takeValue(input) {
return input.value;
});
Use a selector like this:
$('input[type="text"][name="text[]"')
var textboxcount = document.getElementsByName("text").length;
var textvalue="";
for (var i = 0; i < textboxcount ; i++) {
textvalue= textvalue + document.getElementsByName("text").item(i).value;
}
alert(textvalue);
If I have a input textbox like this:
<input type="text" id="searchField" name="searchField" />
How can I set the value of the textfield using javascript or jQuery?
You would think this was simple but I've tried the following:
Using defaultvalue
var a = document.getElementById("searchField");
a.value = a.defaultValue;
Using jQuery
jQuery("#searchField").focus( function()
{
$(this).val("");
} );
Using js
document.getElementById("searchField").value = "";
None of them are doing it... :/
In Javascript :
document.getElementById('searchField').value = '';
In jQuery :
$('#searchField').val('');
That should do it
With jQuery, I've found that sometimes using val to clear the value of a textbox has no effect, in those situations I've found that using attr does the job
$('#searchField').attr("value", "");
Use it like this:
$("#searchField").focus(function() {
$(this).val("");
});
It has to work. Otherwise it probably never gets focused.
To set value
$('#searchField').val('your_value');
to retrieve value
$('#searchField').val();
I know this is an old post, but this may help clarify:
$('#searchField')
.val('')// [property value] e.g. what is visible / will be submitted
.attr('value', '');// [attribute value] e.g. <input value="preset" ...
Changing [attribute value] has no effect if there is a [property value].
(user || js altered input)
Try using this:
$('#searchField').val('');
First, select the element. You can usually use the ID like this:
$("#searchField"); // select element by using "#someid"
Then, to set the value, use .val("something") as in:
$("#searchField").val("something"); // set the value
Note that you should only run this code when the element is available. The usual way to do this is:
$(document).ready(function() { // execute when everything is loaded
$("#searchField").val("something"); // set the value
});
This worked for me:
$("#searchField").focus(function()
{
this.value = '';
});
this is might be a possible solution
void 0 != document.getElementById("ad") && (document.getElementById("ad").onclick =function(){
var a = $("#client_id").val();
var b = $("#contact").val();
var c = $("#message").val();
var Qdata = { client_id: a, contact:b, message:c }
var respo='';
$("#message").html('');
return $.ajax({
url: applicationPath ,
type: "POST",
data: Qdata,
success: function(e) {
$("#mcg").html("msg send successfully");
}
})
});
HTML:
<input type="text" id="priceperperson1" name="priceperperson1" />
<input type="text" name="personsvalue1" class="countme" readonly="readonly" />
JS:
jQuery(document).ready(function($) {
$('div.pricerow input.countme').each(function(){
var id = this.name.substr(this.name.length-1);
alert($('input#priceperperson'+id));
this.value = parseInt($('priceperperson'+id).value) * parseInt($('countpersons'+id).value);
});
});
Shortened as possible. All I've in alert is "Object"... Value is NaN. I've tried to "parseInt" on id. I've tried:
$('[name=priceperperson'+id+']');
$('priceperperson'+id);
What I'm doing wrong?
You are retrieving jQuery objects when you do the $(..)
To get the value (string) use the .val() method.
so
alert( $('input#priceperperson'+id).val() );
You should probably put the $ in the function definition.
I'm guessing it's causing the $ variable to be re-defined, in the function -- and not point to the jQuery's $() function anymore.
I'm thinking about this one :
jQuery(document).ready(function($) {
Try using, instead :
jQuery(document).ready(function() {
When you are looping through jquery objects, I believe you have to use:
$(this).attr('name'); instead of this.name
also, to call values from objects you have to use $.val() or $.attr('attributename');
// Shortcut for doc ready
$(function()
{
// Loop through values
var id = $(this).attr('name');
alert($('input#priceperperson' + id).val());
});
Are you perhaps looking for .val()?
this.val(parseInt($('priceperperson'+id).val()));
All I've in alert is "Object"... Value
is NaN. I've tried to "parseInt"
Try giving a base to parseInt:
parseInt(variable, 10);
There are some mistakes... to get the value of a jQuery object you must use .val() method, not .value.
Then, the parseInt() requires, as second parameter, the radix. Something like:
...
this.value = parseInt($('priceperperson'+id).val(), 10) * parseInt($('countpersons'+id).val(), 10);
...
your code may contain errors
your code
id = lenght 1 OK
if id lenght > 1 ?? possible exception
priceperperson1 to priceperperson_1
# option # proposal
<input type="text" id="priceperperson_1" name="priceperperson_1" /> // => use "_"
<input type="text" name="personsvalue_1" class="countme" readonly="readonly" />
jQuery(document).ready(function($) {
$('div.pricerow input.countme').each(function(){
var id = this.name.split("_")[1]; // => get array value
this.value = parseInt($('[name=priceperperson_'+id+']').value()) *parseInt($('[name=countpersons='+id+']').value());
});
});