I have been trying to find out why the following lines of code do not work:
$('#add-cloud > select').change(function() {
var selected = parseInt($('#add-cloud select option:selected').val());
$("#cloud-calculator table tr:eq(selected)").css("color", "red");
});
If I change :eq(selected) to :eq(4) for example - works fine. How do you pass variable as an argument to :eq() ?
You have to concatenate your variable with your selector:
$("tr:eq("+selected+")");
The way you're doing it, you're embedding the actual string "selected" in the selector. You need to construct a string using your selected variable as a part of it:
$("#cloud-calculator table tr:eq(" + selected + ")").css("color", "red");
Also, you can simply use the 'this' object to get the seleted value.
$('#add-cloud > select').change(function()
{
var rowSelector = '#cloud-calculator table tr:eq(' + parseInt(this.val()) + ')';
$(rowSelector).css("color", "red");
}
Yes we can pass variable to eq() function. But you need to disable Firebug. Otherwise it wont work.
Please check this example.
var index = 3
$('#sidebar_menu li:eq('+index+')').css({"color":"#050959"});
Related
I need to programmatically set an option of an existing select box when I only know the text of the option and not the value.
Here is my code:
$("#" + eventQuestions[x].code).find('option[text="' + eventAnswers[x].vAnswerString + '"]').attr("selected");
Don't focus too much on selecting the right html element or the right text being inside the vAnswerString - I can confirm those are correct.
Basically the option is not being selected. What is wrong with my code?
Check out this answer.
You can use that filter to check the inner text and then you put the selected attribute like this:
.attr("selected", true);
Example I tested it with:
$(function() {
$("#select").find("option").filter(function() {
return this.innerHTML == "InnerText";
}).attr("selected", true);
})
Here is a working example for jquery 1.6+.
Select the option using the filter function:
var text = "theTextToFind";
var matchingOption = $("select#myselect option").filter(function () {
return $(this).text() == text;
});
Set the value using the property function:
matchingOption.prop('selected', true);
Also check out this Answer.
I need to find exactly that td row which contains value priview '2'
I know the td row first half id, but it is dynamic: MovementNumber_M_* (Where * can be from 1 to Milion)
So need to search all rows from MovementNumber_M_1 to MovementNumber_M_9999 which contains MovementNumber_M_*.value=2 and returning directly that td row id which contained that value.
Can you help me? Thanks in advice.
Right and helpfull answers guaranteed ;)
//EDIT
function DgIdOnClick (e,r){
var MovementNumber = document.getElementById(e).value;
//alert('MovementNumber: '+MovementNumber+' Type :'+r);
var result = $('[id^="MovementNumber_M_"][value='+MovementNumber+']');
result.each(function(){
alert($(this).attr("id"));
});
}
OK value=1 is for init and thats why are alerting all rows but if value is 2 then jq is not finding him WHY ?
The function DgIdOnClick is inicialized #
$( document ).ready(function() {
var SecondDiagnosis=$( "span[id^='lov_Dg2Id_D_']" );
var SpanBlock2=SecondDiagnosis.find('a');
var eventH2=SpanBlock2.attr( "onclick" );
SpanBlock2.attr("onclick", "DgIdOnClick(document.getElementById('MovementNumber_D_'+parentElement.getAttribute('id').substring(12)).id,2);"+eventH2);
var FirstDiagnosis=$( "span[id^='lov_DgId_D_']" );
var SpanBlock=FirstDiagnosis.find('a');
var eventH=SpanBlock.attr( "onclick" );
SpanBlock.attr("onclick", "DgIdOnClick(document.getElementById('MovementNumber_D_'+parentElement.getAttribute('id').substring(11)).id,1);"+eventH);
});
function DgIdOnClick is on other .js file
If i am alerting IN DgIdOnClick alert(document.getElementById('MovementNumber_M_2').value)//MovementNumber_M_2 Then value is 2 but jq is not founding it
This alerts the ID's of each row containing that value
var result = $('[id^="MovementNumber_M_"][value="2"]');
result.each(function(){
alert($(this).attr("id"));
});
http://jsfiddle.net/q8QaG/
Update:
This alerts the id of all inputs with the value of 2, even on input update
$("#button").click(function(){
$('[id^="MovementNumber_M_"]').each(function(){
var value = $(this).val();
if(value == 2){
alert($(this).attr("id"));
}
});
});
http://jsfiddle.net/q8QaG/3/
$('#TableID').find('td').filter(':contains("SOME_TEXT")');
The previous 2 answers have the string encoding similarly incorrect. This should be it:
$('[id^="MovementNumber_M_"][value="2"]');
You can use combination of Attribute Starts With Selector [name^="value"] and Attribute Equals Selector [name="value"]
var myElement= $("[id^='MovementNumber_M_'][value=2]");
As per comment, if you need id use attr()
var myElementId = $("[id^='MovementNumber_M_'][value=2]").attr('id');
I have created several div with id's such as window1, window2 and so on. Now all I want to is find the tag from these above created divs. I am doing this inside the for loop but it is not working for me. Here is what I am doing
for(connectWindow=1;connectWindow<=xmlLength;connectWindow++)
{
//look for the to tag inside the html
var windo = "window"+connectWindow;
var to = "to"+connectWindow;
alert("Making connections" + windo +to)
//$("div#windo").find('strong#to')(function())
$("div#windo").find('p#to').each(function(){
alert("####################");
var name = $(this).text();
//display_function(name,country);
alert("Name is :::"+name);
});
}
Please let me know where I am going wrong. Also please let me know if there is any solution in JavaScript either.
Thanks !
You need to do it like this
$("div#" + windo).find('p#' + to).each(function(){ // <-- this uses your variable
alert("####################");
var name = $(this).text();
//display_function(name,country);
alert("Name is :::"+name);
});
Your code looks for an id="window" and id="to" instead of your variable
$("div#windo").find('p#to')
You really can just do it by ID since you are using the #(id selector)
$("#" + windo).find('#' + to)
Well, you need to actually use the variables:
$("div#" + windo).find('p#' + to).each(function(){
By the way - jQuery is written in JavaScript. If you're using jQuery, you're using JavaScript.
I am looking to move or copy the contents of an HTML element. This has been asked before and I can get innerHTML() or Jquery's html() method to work, but I am trying to automate it.
If an element's ID begins with 'rep_', replace the contents of the element after the underscore.
So,
<div id="rep_target">
Hello World.
</div>
would replace:
<div id="target">
Hrm it doesn't seem to work..
</div>
I've tried:
$(document).ready(function() {
$('[id^="rep_"]').html(function() {
$(this).replaceAll($(this).replace('rep_', ''));
});
});
-and-
$(document).ready(function() {
$('[id^="rep_"]').each(function() {
$(this).replace('rep_', '').html($(this));
});
});
Neither seem to work, however, this does work, only manual:
var target = document.getElementById('rep_target').innerHTML;
document.getElementById('target').innerHTML = target;
Related, but this is only text.
JQuery replace all text for element containing string in id
You have two basic options for the first part: replace with an HTML string, or replace with actual elements.
Option #1: HTML
$('#target').html($('#rep_target').html());
Option #2: Elements
$('#target').empty().append($('#rep_target').children());
If you have no preference, the latter option is better, as the browser won't have to re-construct all the DOM bits (whenever the browser turns HTML in to elements, it takes work and thus affects performance; option #2 avoids that work by not making the browser create any new elements).
That should cover replacing the insides. You also want to change the ID of the element, and that has only one way (that I know)
var $this = $(this)
$this.attr($this.attr('id').replace('rep_', ''));
So, putting it all together, something like:
$('[id^="rep_"]').each(function() {
var $this = $(this)
// Get the ID without the "rep_" part
var nonRepId = $this.attr('id').replace('rep_', '');
// Clear the nonRep element, then add all of the rep element's children to it
$('#' + nonRepId).empty().append($this.children());
// Alternatively you could also do:
// $('#' + nonRepId).html($this.html());
// Change the ID
$this.attr(nonRepId);
// If you're done with with the repId element, you may want to delete it:
// $this.remove();
});
should do the trick. Hope that helps.
Get the id using the attr method, remove the prefix, create a selector from it, get the HTML code from the element, and return it from the function:
$('[id^="rep_"]').html(function() {
var id = $(this).attr('id');
id = id.replace('rep_', '');
var selector = '#' + id;
return $(selector).html();
});
Or simply:
$('[id^="rep_"]').html(function() {
return $('#' + $(this).attr('id').replace('rep_', '')).html();
});
From my question, my understanding is that you want to replace the id by removing the re-_ prefix and then change the content of that div. This script will do that.
$(document).ready(function() {
var items= $('[id^="rep_"]');
$.each(items,function(){
var item=$(this);
var currentid=item.attr("id");
var newId= currentid.substring(4,currentid.length);
item.attr("id",newId).html("This does not work");
alert("newid : "+newId);
});
});
Working Sample : http://jsfiddle.net/eh3RL/13/
I am trying to get all elements with an id starting with some value. Below is my jQuery code. I am trying to use a JavaScript variable when searching for items. But it does not work. What am I missing below? So the id 'value' am searching is the value of the clicked element
$(document).ready(function() {
$('input[name$="_chkmulti"]').click(function(){
var value = $(this).val();
$("td[id^= + value +]").each(function(){
alert("yes");
});
});
});
try:
$("td[id^=" + value + "]")
Here you go:
$('td[id^="' + value +'"]')
so if the value is for instance 'foo', then the selector will be 'td[id^="foo"]'.
Note that the quotes are mandatory: [id^="...."].
Source: http://api.jquery.com/attribute-starts-with-selector/