i am using java-script function when i click a td the value is stored in a variable and display in a textarea its works good. but when i click another td value in the textarea changed to new one.
I am using java script for creating table and with javascript itself i generate the id
str += "<td id='R" + i + "C" + j"'>Demo</td>";
Here my code execute when click is triggered
$(this).addClass('active');
var id = $(this).closest('td').attr('id');
document.getElementById('hit').value += id; //hit- id of textarea
is it any way for append the values one by one when user clicks multiple td
I've created a fiddle which hopefully is what you are looking for.
$('#tbl td').click(function() {
$('#txta').val($('#txta').val() + $(this).text());
});
http://jsfiddle.net/B8fqK/2/
i don't know if i grasped your question clearly but if you want to append to the textarea the value of the td clicked instead of replacing it you can do something like this:
$("td").click(function(){
$(this).addClass('active'); //i let this but i don't get what you need it for
$('#hit').val($('#hit').val()+$(this).text());
});
if you want to store the value of the td you can just put an additional :
var value = $(this).text();
Related
I want to update text in html element on AJAX post.
Element is in td. Problem is I have many td so I named it id="someTab.#user.UserId" so every td has binded UserId.
I have this id in variable var someTabId = "someTab." + userId
Then I want to update its text on some action.
$("#" + someTabId).text("some text here")
And its not updating. I used console.log to check if someTabId is equal to its element id and it is
HTML Element I want to update:
<td id="someTab.#user.UserId">I want to update value here</td>
you can use instead of
var someTabId = "someTab." + userId
to
var someTabId = "someTab_" + userId
it will work.
because "." is a class selector in jQuery.
Since I got no answer I found a workaround.
I just refresh whole table in background by writing $("#someTab").load(location.pathname + " #someTab"); in AJAX.
Hi I have some code where i'm inserting a span on a page each time a change is made to a dropdown item. What i want to achieve is the content inside the span to be changed/replaced each time a change in the dropdown is made. But what I'm currently getting is a new span being created each time instead. An example of how my code looks is below, any help on this would be appreciated.
doSomething.addEventListener('change', function() {
document.querySelector('.className').insertAdjacentHTML("afterend", "<span>" + somethingDynamic + "</span>");
});
I needed the span content to be inserted into a certain place on the page so I created a new Div to be inserted onto the page where i needed it and then to replace the content inside it using innerHTML as suggested to get what I needed.
doSomething.addEventListener('change', function() {
document.querySelector('.className').insertAdjacentHTML("afterend", "<div class='new'></div>");
document.querySelector('.new').innerHTML = "<span>"+ dynamicContent + "</span>";
});
The API method I am using takes a list of parameters in the form of Dictionary<string,string>. I am building the inputs for this dynamically with JavaScript, where I have a DIV row and then two inner DIV cells, one for the parameter name and one for the parameter value input.
I can use .each() to loop through each of the parameter name DIVs but need to figure out how to get the value of the input which is displayed directly after it.
With the following pseudo code to show the idea, what would be the best approach where I could get the parameter values together?
CSS Table:
consumedValues.innerHTML += "<div class='valuesRow'>";
consumedValues.innerHTML += "<div class='valuesCellName'>" + consumesItem + "</div><div class='valuesCellValue'><input type='text'></div>";
consumedValues.innerHTML += "</div>";
Parameter Dictionary:
var parameters = {};
$('.valuesCellName').each(function(index)
{
parameters[$(this).html()] = "INPUT_VALUE_HERE";
});
Since they are siblings, Use next()
$(this).next().find("input").val()
So, I created the code where user clicks on the button and then jQuery reads the value inside the input text and I stored that in variable. But if I want to use that variable and append that value to the element, jQuery returns undefined is not a function and it doesn't work. Here is the fiddle:
Fiddle: http://jsfiddle.net/2cf1y8Lc/1/
Is this about adding menu div element form text field. Here is update of fiddle code you send hope it helps.
$('#btnSubmit').on('click',function(e){
var newMenu = $('#add_list').val();
var elem = '<li><span class="glyphicon glyphicon-briefcase"></span> '+newMenu+'</li>';
$('.nav-pills.nav li').last().append(elem);
});
http://jsfiddle.net/2cf1y8Lc/2/
One possible reason may be if the value from text input is null and you are using parseInt() or parseFloat() on this variable. So check its value before use
$("#btn").click(function(e){
var myvar= $("#myhiddenfld").val();
if(myvar=="") myvar=0;
else myvar=parseInt(myvar);
$("#storeinput").val(myvar);
//or use your append code here as you like
})
I am creating dynamic drop down in my template. I can't get the selected value of those.
var newjobDropDown = $(document.createElement('div')).attr("id", 'jobDropDown' + counter);
newjobDropDown.after().html('<label><?php echo __(Job Vacancy); ?></label>' +
'<select id="jobDropDown' + counter +'"'+' onchange="validate()"'+' class="vacancyDrop"'+'>'+buildVacancyList()+'</select>'+
'<span onclick="removeDrop(event)"'+'class="removeText"'+ 'id="removeButton'+counter+'">'+remove+'</span>'+'<br class="clear" />');
newjobDropDown.appendTo("#TextBoxesGroup");
I used the following code to get the value, but i got a null value.
$('#jobDropDown1').val()
You call
$('#jobDropDown1').val()
but you select looks like
<select id="jobDropDown'
Add 1 to its id and it will do the trick
You have repetated ids (you shouldn't have).
You have 2 choices:
1) Change to different id, then select it with jquery normally
2) If you can't don't want, you should do:
$('select#jobDropDown1').val()
With this, we're differentiating both equal ids by tag name.
Hope this helps. Cheers
From the code you have posted it looks like you are creating two elements with the same id—the select and a preceding div. From the jQuery docs:
If more than one element has been
assigned the same ID, queries that use
that ID will only select the first
matched element in the DOM.
This means your code is trying to get the value of the div element, rather than that of the select. Try giving the div a different id:
var newjobDropDown = $(document.createElement('div')).attr('id', 'jobDropDown_div' + counter);
newjobDropDown.after().html('<label><?php echo __(Job Vacancy); ?></label>' +
'<select id="jobDropDown' + counter +'"'+' onchange="validate()"'+' class="vacancyDrop"'+'>'+buildVacancyList()+'</select>'+
'<span onclick="removeDrop(event)"'+'class="removeText"'+ 'id="removeButton'+counter+'">'+remove+'</span>'+'<br class="clear" />');
newjobDropDown.appendTo('#TextBoxesGroup');