access the String Text before <input> in HTML using jQuery - javascript

How to access the String Text before in HTML using jQuery?
example:
First Name :<input type="text" name="first_name" id="firstName" value="" maxlength="100" />
assign this(First Name :) to a variable ?
Thank you so much inadvance :)

In this case, you can find the contents of the previous sibling of the input element
var label = $.trim($('#firstName').prop('previousSibling').nodeValue);
Demo: Fiddle

document.getElementById('firstName')['previousSibling'].nodeValue

Related

How to set contents of a BootStrap Input Group using jQuery?

Below is an example of Bootstrap Code to create a input-group. How can I use jQuery to set the contents of the input-group using the id?
<div class = "container">
<div class = "input-group-addon">Your name</span>
<input type="text" class="form-control" id="inputField" placeholder="Full Name">
</div><br>
Also, is there a way I can make the input-group not editable. I want to use it to display read-only text.
$("inputField").???? <-- What goes here??
Thanks!!
$("#inputField").attr('readonly',true).val('myValue')
if you have access to the html put directly readonly="readonly" as attribute of input.
you can put value directly in HTML with the value attribute.
ps: dont forget the "#"
$('#inputField').val('the value');

Jquery selector input fill with same id but different number

<input id="value_1" type="text" name="values_1" value="somthing">
<input id="value_2" type="text" name="values_2" value="somthing">
<input id="value_8" type="text" name="values_8" value="somthing">
Hello everyone. I searched the forum and can not find solution for this. What I want is to catch input id by low to high number and fill it with text.
I have add button for fields
$("#value_1").val("something");
this method working for exactly id number
$( "span input" ).first().val("something");
this working great but i dont know how to catch second and third.
Please help and thanks in advance.
You can use :eq()
$('input:eq(0)').val(0);
$('input:eq(1)').val(1);
$('input:eq(2)').val(2);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<input id="value_1" type="text" name="values_1" value="somthing">
<input id="value_2" type="text" name="values_2" value="somthing">
<input id="value_8" type="text" name="values_8" value="somthing">
I don't recommend this ID naming convention, but if you must,
// Iterate through input elements, checking if the beginning of the string is 'value_'
$("input[id*='value_']").each(function() {
if ($(this).attr('id').startsWith('value_')) {
// Do what you'd like with the matched input element, being $(this)
}
});
EDIT: This might work better for you:
$("input[id^='value_']").each(function() {
// Do what you'd like with the matched input element, being $(this)
});
Found here: https://stackoverflow.com/a/5413862/5169684

jQuery: check input with name attribute for hasClass

What I'm trying to do is check if input with name attribute "Name" has a class of "input-validation-error", if so apply css to the label with for attribute of "Name".
if ($("input[name='Name']").hasClass("input-validation-error"))
{
$("label[for='Name']").css("color:red");
console.log('here');
}
This doesn't seem to work. Any ideas?
Markup:
<label for="Name">Name</label>
<input class="input-validation-error" data-val="true" data-val-required="field is required" id="Name" name="Name" placeholder="Full Name" type="text" value="">
Instead of
$("label[for='Name']").css("color:red");
Try
$("label[for='Name']").css("color","red");
Read more on .css() here
OR
Instead of
$("label[for='Name']").css("color:red");
Try
$("label[for='Name']").attr("style","color:red");
The html provided in updated question and with above jquery modification its working see here.
As per the questioner comments below this answer , i think the questioner is adding HTML dynamically inside DOM so in that case use event delegation read more here.

How to retrive name property of previous attribute

hi i am newbie in jquery..
i have code like follow
<input type="text" name="name" id="name">
Remove
my question is how can i pass name property of textbox in function dele()?
i am trying to do is
<input type="text" name="name" id="name">
Remove
but it's giving me error. i don't how can i retrieve it?
Thanks in advance
try this:
<input type="text" name="name" id="name">
Remove
jQuery
$(document).ready(function(){
$('.link').click(function(){
var name = $(this).prev().attr('name');
});
});
prev is a method that comes with jQuery. this is an instance of JS Native DOM element. use $(this) to make a jQuery Instance.
dele($(this).prev().attr('name'))

GetElementsByName with array like name

i often use this notation when i name my controls in order to get an array in POST or GET.
<input name="color[1]" type="text" />
<input name="color[2]" type="text" />
<input name="color[3]" type="text" />
so in my scripts i can do
<?php $data=$_GET["color"];
for each ($color as $key=>$value) {
doSomething();
} ?>
Often happens that i need to get those id back in javascript , but i cannot get them , so i often add an ID to each element in html like that
<input name="color[3]" id="color_3" type="text" />
so that i can use document.getElementsById('color_3')
Instead i would like to find way to use document.getElementsByName(color[3])...
but i cannot really get it to work.
Any help?
If you want all of the color inputs, you can use querySelectorAll instead to query for the name attribute:
document.querySelectorAll("input[name^='color[']")
This looks through the document for all input tags whose name attribute starts with color[. Here is a fiddle for this.
If you only want color[3], you can use:
var color3 = document.getElementsByName("color[3]");
console.log(color3[0]);
<input name="color[3]" id="color_3" type="text" />
var element = document.getElementsByName("color[3]");
alert(element[0].id);
It works fine .. The thing you should have in your mind is Return type is an array of elements not a single element

Categories

Resources