I have a listbox that I am trying to read through all the data in it and put those values in a textbox. I thought I this would use a for loop but it only runs once and then quits.
var listbox = $('#<%=listBox.ClientID%>');
for (var count = 0 ; count <= $('#<%=listBox.ClientID%>').length; count++) {
var existing = $('#<%=stringTextBox.ClientID%>').val();
var value = listbox[count].value;
document.getElementById("<%=stringTextBox.ClientID%>").value = "," + value + existing
}
First: #<%=listBox.ClientID%> is an selector by ID. The idee of IDs is that there is always at most one element with this ID.
Second: var value = should be something like var value = $(<listboxselector>).get(count).val()
Related
We have a customized Telerik RadComboBox that builds a text string of names separated by semicolons in the textbox field of the combobox by selecting names from the dropdown. We want to improve this and replicate a behavior similar to Outlook where individual names can be selected and deleted from the textbox. The selected names are stored in a hidden input field. Another hidden field carries a CSV list of IDs. Both hidden fields are treated like arrays, and their values have a one-to-one relationship by index. The approach we are considering is to wrap some kind of tag around each name, like a span, so that when a user selects a particular name the whole name will be highlighted and can then somehow be detected. Could this be done by using an ItemTemplate?
The OnClientSelectedIndexChanged event fires the javascript shown, and appends the list of names to the textbox.
function RecipientSelectedIndexChanged(sender, args) {
var combo = $find('<%= rcbRecipients.ClientID%>');
var userid = combo.get_selectedItem().get_value();
var name = combo.get_selectedItem()._text;
var listID = $get("<%= hdnRecipientIdList.ClientID%>").value;
var listName = $get("<%= hdnRecipientNameList.ClientID%>").value;
var listIDArray = new Array();
var listNameArray = new Array();
if (listID != '') {
listIDArray = listID.split(',');
listNameArray = listName.split('; ');
}
listNameArray.pop();
for (var i = 0; i < listNameArray.length; i++) {
listNameArray[i] = listNameArray[i] + '; ';
}
var x = listIDArray.indexOf(name);
if (x == -1) {
listIDArray.push(userid);
listNameArray.push(name + '; ');
listID = listIDArray.toString();
var y = listNameArray.join('');
listName = y;
}
$get("<%= hdnRecipientIdList.ClientID%>").value = listID;
$get("<%= hdnRecipientNameList.ClientID%>").value = listName;
combo.trackChanges();
var item = combo.findItemByText(name);
item.hide();
combo.set_text(listName);
combo.commitChanges();
combo.showDropDown();
}
I am trying to get value of dynamic generated inputs. Here is my code and what I want actually
Here is my Code:
function activehead_standard(){
var cnt = 4;
for(i=1;i<=cnt;i++){
var active_head = document.getElementById('standard_'.i).value;
}
}
I want to get values of input:
standard_1
standard_2
standard_3
standard_4
but its not getting the value of input through ids I am sure its actually not getting the ids of inputs
use + for concatenation in javascript
function activehead_standard(){
var cnt = 4;
for(i=1;i<=cnt;i++){
var active_head = document.getElementById('standard_'+i).value;
}
}
I have a dynamic table which has the input field in each row. I would like to get the value entered by the user through Javascript. I am able to get the HTML code for the input field 'quantity' but not the value.
Here is the part of the javascript code :
var table = document.getElementById("mactable");
var row_count = table.getElementsByTagName("tr").length;
var grand_total = document.getElementById("grand_total");
var grand_price = 0.00;
for (var i = 1, row; row = table.rows[i]; i++)
{
var price = row.cells[4].innerHTML;
var quantity = row.cells[2].innerHTML;
alert(quantity);
if(isNumber(price))
{
var num = parseFloat(price);
grand_price = grand_price + num;
}
}
Any idea how can it be done ?
Instead of reading table cell innerHTML you can find inner input element and then read its value property:
var quantity = Number(row.cells[2].querySelector('input').value);
Here row.cells[2] is a td element. Using querySelector('input') you can find the first children input.
Also note, that since the value of the field is a string, you might want to cast it to number, for example with Number function.
Using JS Adding a table with 'rowNumber', everytime code goes round the loop, increase value by 1 and create a new variable 'Row_Num' + value of rowNumber, to keep it unique.
var rowNumber = 1;
for (var attributeIndex in table.attributes) {
var Row_Num + rowNumber = table.insertRow(rowNumber);
rowNumber += 1;
//this isnt working, how can I get the value of rowNumber and add it onto the end of the variable each time?
As Frédéric pointed out, when you want to store lots of variables together, the best way to do this is with an Array.
So you can change your code a little bit like this so that all your row objects are stored in the array tableRows:
var rowNumber = 0; // arrays start with index 0, not 1.
var tableRows = new Array(); // store the rows in here
for (var attributeIndex in table.attributes) {
tableRows[rowNumber] = table.insertRow(rowNumber);
rowNumber += 1;
}
Then when you want to get hold of a particular value, you just need to access it using the index.
// get the 2nd entry - at index 1
var someRow = tableRows[1];
Do you have to do anything special while passing in a dynamically created string as a clientID for document.getElementById?
I have a asp:gridview control that has a textbox column and a checkbox column. I added an onclick event to the checkboxes to set the textbox value of that row to the max value of all checked rows +1. I pass in the IDs of the grid and the controls of the row that was selected. I can getElementByID fine for these controls, but When I dynamically build the IDs of the other controls, I keep getting null, even though I know that the IDs are correct. My code is bellow.
function SetPriority(cbID, tbID, gridID) {
var cb = document.getElementById(cbID);
if (cb.checked) {
var tb = document.getElementById(tbID);
var grid = document.getElementById(gridID);
var maxv = 0;
for (var i = 0; i < grid.rows.length; i++) {
var indexID = 102 + i;
var cbClientID = 'LeaveInfo_pnlMain_wgbLeaveSummary_gridSubmitted_ct' + indexID + '_chkGroup';
var tbClientID = 'LeaveInfo_pnlMain_wgbLeaveSummary_gridSubmitted_ct' + indexID + '_txtPriority';
console.log("row" + i);
//just for example of how it should be working
console.log(cbID);
var cbx = document.getElementById(cbID);
console.log(cbx);
//get row checkbox
console.log(cbClientID);
var thisCB = document.getElementById(cbClientID);
console.log(thisCB);
//get row textbox
var thisTB = document.getElementById(tbClientID);
console.log(thisTB);
if (thisCB) {
if (thisCB.type == "checkbox") {
if (thisCB.checked) {
if (thisTB.value > maxv)
maxv = thisTB.value;
}
}
}
}
tb.value = parseInt(maxv) + 1;
}
}
Here is how its showing up in the console, where you can see the IDs for the first row are the same
For Those wondering about How I am calling the function, I am adding it on to a checkbox in a .net gridview control on row databind. It renders as follows:
<input id="LeaveInfo_pnlMain_wgbLeaveSummary_gridSubmitted_ctl02_chkGroup" type="checkbox" name="LeaveInfo$pnlMain$wgbLeaveSummary$gridSubmitted$ctl02$chkGroup" onclick="javascript:SetPriority('LeaveInfo_pnlMain_wgbLeaveSummary_gridSubmitted_ctl02_chkGroup','LeaveInfo_pnlMain_wgbLeaveSummary_gridSubmitted_ctl02_txtPriority','LeaveInfo_pnlMain_wgbLeaveSummary_gridSubmitted');">
The vb .net code to add the function is this...(on-_RowDataBound)
Dim chk As CheckBox = CType(e.Row.FindControl("chkGroup"), CheckBox)
Dim tb As TextBox = CType(e.Row.FindControl("txtPriority"), TextBox)
chk.Attributes.Add("onclick", String.Format("javascript:SetPriority('{0}','{1}','{2}');", chk.ClientID, tb.ClientID, gridSubmitted.ClientID))
No, you don't have to do anything special when dynamically building a string. A string in javascript is the same string whether it was built dynamically or specified directly in your code. If document.getElementById() is not working, then one of the following is likely the cause:
Your string isn't what you think it is so it doesn't match the target id.
Your DOM id isn't what you think it is.
You have multiple elements with the same id (not likely here because you won't get null)
You are calling getElementById() before the DOM is ready or before the desired elements have been added to the DOM.
In this case, it seems more likely that 1) or 2) are the issues here, but you don't show us any context to know whether 4) could be the problem.
Not 100% sure, but I think it could be a context issue. Try this:
function ( id ) {
var ID = document.getElementById;
this.id = id;
this.newvar = ID.call( document, this.id );
...
}
Also, this question may help you — it has a good explanation on context and assigning a var to getElementById Why can't I directly assign document.getElementById to a different function?
I couldnt figure out why my IDs that seemed identical were not. I will leave this question open for anyone to add insight on how to remedy this. I ended up just getting my elements by cell and not by ID.
function SetPriority(cbID, tbID, gridID) {
var cb = document.getElementById(cbID);
if (cb.checked) {
var tb = document.getElementById(tbID);
var grid = document.getElementById(gridID);
var maxv = 0;
if (grid.rows.length > 0) {
for (row = 1; row < grid.rows.length; row++) {
var thisCB = grid.rows[row].cells[5].childNodes[1];
if (thisCB == cb) {
continue;
}
var thisTB = grid.rows[row].cells[6].childNodes[1];
if (thisCB.type == "checkbox") {
if (thisCB.checked) {
if (thisTB.value > maxv)
maxv = thisTB.value;
}
}
}
}
tb.value = parseInt(maxv) + 1;
}
}