I have a display of some data through jquery. now I want to put some textbox in front of data but it doesn't show the 'n' numbers of textbox only single box display. see my code
$("#jobcard").html(data[i]['jobcard_id']);
var qty = data[i]['jobcard_material_qty'].split(",");
for(var j =0; j<qty.length; j++){ //qty.length =5
$("#issue").html('<input type="text" name="qty_issue_"'+j+ '><br>');
}
i alert(qty.length) //got ans 5
so i just need input 5 input boxes but i got sinlge box only.
You can use the JQuery method append() for this!
var qty = {
length: 5
};
var data = [{
jobcard_id: 1
}];
var i=0;
$("#jobcard").html(data[i]['jobcard_id']);
for (var j = 0; j < qty.length; j++) { //qty.length =5
$("#issue").append('<input type="text" name="qty_issue_"' + j + '><br>');
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="jobcard"></div>
<div id="issue"></div>
Related
When use jQuery display list dict to html, how to letdifferent dict with different color, for example, 1 in dict set red, 2 set blue and 3 set purple? I use below code to get aggregated data, for example, each quessionId has many related reasons. Below is my partial code of .js code in jQuery:
function fmtQuestionsByID(id,callback){
if(!DATA.questions[id] || !$('#card_'+id) )return;
var project = DATA.projects[DATA.questions[id].projectId];
if(!project)return;
var issueQuestionLists = DATA.alltags.reduce(function(a,b){
if(a[b['quessionId']]) {
a[b['quessionId']].push({name:b['name'],color:b['color'],description:b['description'],reason:b['reason'],question:b['question'],issueId:b['issueId'],department:b['department'],_id:b['quessionId']})
} else{
a[b['quessionId']] = [{name:b['name'],color:b['color'],description:b['description'],reason:b['reason'],question:b['question'],issueId:b['issueId'],department:b['department'],_id:b['quessionId']}]
}
return a;
},{});
var d = 0;
for(var i=0;i < DATA.questions[id].tags.length;i++){
var lid = DATA.questions[id].tags[i];
for(var l in issueQuestionLists){
var lb = issueQuestionLists[l]
for(var c=0;c< lb.length;c++){
var lc = lb[c];
if(lc._id == lid){
d++;
var info = lc;
console.log('info', info);
$('.tags_question').append(d + '['+info.name+']' + info.description + '。' + 'Reason: '+info.reason+ '。' ||'[no data]' );
}
}
}
}
}
And I use below html to get above data
<div id="questioninfo">
<span class="tags_question"></span>
</div>
Thanks so much for Swati's help, to change .html to .append and set a auto-incrementing id from 1.
I have a table out of different MySQL data. I want to highlight cells with the same ID in it on hover. I did that with a simple jQuery, the script is almost working but you see I've got the var nr and want the integer i to be added to the class string. What is my mistake, why isn't it working? If you change the var nr = '.id_' + i; to a static variable like var nr = '.id_2'; it is working.
for (i = 0; i < 10; i++) {
var nr = '.id_' + i;
var bgcol = $(nr).css('backgroundColor');
$(nr).hover(
function(){
$(nr).css({"background":"yellow"});
},function(){
$(nr).css({"background":bgcol});
});
}
http://jsfiddle.net/Nkdny/210/
Solution, thanks to Karl-André Gagnon: http://jsfiddle.net/Nkdny/215 Look in the comments for details.
You're missing an echo in front of your php statement.
<?php echo $amount; ?>
I've got multiple < select > dropdown lists. Every dropdown list has its own id and is assigned like this:
for($i=0; $i<12; $i++) {
echo '<select class="selectpicker" id="select$i">
<option value="x">text</option>
</select>';
}
In jQuery, how do i get the selected option of the select dropdown list i have clicked? So far I've got the following code:
<script>
for (i = 0; i < 12; i++) {
$("#select" + i + "").change(function () {
alert("Im inside a select box!");
var selectValue = document.getElementById('select' + i + '').value;
var selectOption = $("#select" + i + " option[value=" + selectValue + "]").text();
alert(selectOption);
});
}
</script>
It does alert "Im inside a select box!" whichever select box i click. But it doesn't alert the selected option though. Any idea what I'm doing wrong?
to start off in your php you have "for($i=0; $i<10; $i++) {" and in your js you have "for (i = 0; i < 12; i++) {", shouldn't the "i < 12" be "i < 10" in your js? it may mismatch the select id
This is how I fixed it. I just check on any select dropdown list with $("select") and from there on I was able to get the selected option.
$("select").change(function () {
var selectValue = $(this).attr("id");
var selectOption = $("#" + selectValue + " option:selected").text();
});
I am trying to multiply the contents of a text box called qty1 by the price in a select box that is retrieved using ajax.
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
$('#stock1').on('change', function (){
var newValue1 = $.getJSON('select2.php', {stockID: $(this).val()}, function(data){
var options = '';
for (var x = 0; x < data.length; x++) {
options += data[x]['priceeach'];
}
$('#priceeach1').text(options);
var qty1 = $("#qty1").text();
var priceeach1 = $("#priceeach1").text();
$('#linetotal1').text(priceeach1 * qty1);
});
});
});
</script>
<script>
The script changes the values in this html :
Price Each : £<span id="priceeach1"></span> - Line Total : £<span id="linetotal1"></span>
The priceeach1 values are changed, but the linetotal1 value stay at 0, even when the select box is changed or the values in qty1 are changed. What should happen is priceeach1 from the drop down is multiplied by the text box qty1. For example if the priceeach1 = 20.00 and the qty1 was 2 linetotal1 would be 40.00 , but all I get at present is 0 .
The qty1 as you say in the description is a textbox. And you are getting its value using the text() property. That's why you get blank as an answer.
Use the .val() property to get the value of a textbox.
You have to parse the values as Float or Int using parseFloat or parseInt
var qty1 = $("#qty1").html();
var priceeach1 = $("#priceeach1").html();
var total=parseFloat(priceeach1) * parseInt(qty1);
$('#linetotal1').html(total);
i am trying to get checked radio "id" and "name" as my radio name and id are same like 1,2,3... and so on
my code is here,
var selection=new Array();
var allR = document.getElementsByTagName('input');
var a=0;
var b=0;
for(var i=0; i<allR.length; i++){
if(allR[i].type=='radio') { b++; }
if(allR[i].type=='radio' && allR[i].checked) { a++; }
}
var num=0;
alert(b);
for(var j=1;j<=b ;j++) {
//for(var i=0; i<alr.length; i++){
if(document.getElementsByName('j').checked) {
selection[num]=j;
num++;
alert(j);
//}
}
}
in this code var "b" is the number of radio counts and in second loop i am trying to get checked radio in array and printing them too but it just print the total radio button but do not print checked radio ???
hopes for your suggestions
You should change
if(document.getElementsByName('j').checked)
to
if(document.getElementsByName(j)[0].checked)
as your control has name as 1, 2 , 3. not 'j', and j is your for loop initial, so it not need to be enclosed in single quotes.
as document.getElementsByName returns a collection. you should check element by 0 index.
Just a comment.
the block inside the first for loop can be:
for (var i=0; i<allR.length; i++){
if (allR[i].type=='radio') {
b++;
a += allR[i].checked;
}
}
but there are those who dislike depending on type conversion like that.