function addRow() {
var medicinename = document.getElementById("medicinename");
var time = document.getElementById("time");
var duration = document.getElementById("duration");
var when = document.getElementById("when");
var table = document.getElementById("myTableData");
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
row.insertCell(0).innerHTML= '<input type="button" value = "Delete" onClick="Javacsript:deleteRow(this)">';
row.insertCell(1).innerHTML= medicinename.value;
row.insertCell(2).innerHTML= time.value;
row.insertCell(3).innerHTML= duration.value;
row.insertCell(4).innerHTML= when.value;
var cell2=row.insertCell(1);
var element2 =document.createElement("input");
element2.type = "text";
element2.setAttribute("name", "productDynamic");
var get=medicinename.value;
element2.value = get;
cell2.appendChild(element2);
}
here i am going to insert value in table by using onclick function of javascript. I have 5 columns and in first column I am inserting delete button. Its all ok with it.but var cel2=row.insertcell(1) going wrong something it shows me 6 columns. I tried but i can not figure it out. Is there anybody in javascript can help me?one more thing is when i pass the value to table by textfield it is ok, but when i use select field by using option value it passed but value not catch by using like this element2.setattribute("name","productDynamic"); what should i have to do for that also
row.insertCell insert a new row with given index.
If index is -1 or equal to the number of cells, the cell is appended
as the last cell in the row. If index is greater than the number of
cells, an IndexSizeError exception will result. If index is omitted it
defaults to -1. Link
So I think if you create a new cell at an existing Index, it will be append. If you want to overwrite the cell, just get it with row.cells[index] an give it a new value.
Related
I am facing a difficulty in passing variable for a cell value to get the content in the table cell.
Passing the row variable will detect but not the col variable.
var col = $(this).parent().children().index($(this));
var row = $(this).parent().parent().children().index($(this).parent());
//displaying row and col variables do work.
//This is the result I am getting <button style="display:block; width: 100%;">Actual Cell Value</button>
var cellValue;
cellValue = document.getElementById("dataTable").rows[row].cells[col].innerHTML;
alert(cellValue);
//This one returns correct cell value
alert(document.getElementById("dataTable").rows[row].cells[0].innerHTML);
You are not accessing DOM properly, also note that index method returns index position from 0.
Your code works fine if i pass below.
var col = 2;
var row = 3;
var cellValue;
cellValue = document.getElementById("dataTable").rows[row].cells[col].innerHTML;
console.log(cellValue);
console.log(document.getElementById("dataTable").rows[row].cells[0].innerHTML);
I am trying to remove columns from a table on the click of a button, however; when I use the button and it removes the last column, if I then want to remove another column I run into an issue where a critical variable isn't updated.
JS:
function deleteCol(){
debugger;
var tds = document.getElementById("icol").value;
var cold = document.getElementsByClassName(tds-1);
for (var i = 0; i < tds; i++) {
var inc = 0;
var lastCol = cold[inc];
lastCol.remove();
}
tds--;
}
Here I am trying to alter the value of tds after the loop has taken place, but when I next use the button it uses the initial tds value over again and not the updated version, can someone explain to me why it doesn't re assign the tds variable for when I use it next time? edit the function I have here is basically removing the last cell on each row.
You're only updating a variable rather than the live attribute value, instead do this:
var input = document.getElementById("icol");
var tds = input.value;
.
.
.
input.value = --tds
The thing is this: I have a GridView control which is populated with data from an SQL table. Each column has simple data such as strings or int numbers. My last column is a "Select CommandField", which pops up a form when clicked. I am trying to make a function in JavaScript which needs to use the value of the first column of the selected row; how is the syntax for this?
Like in C# it would be
myGridView.Rows[myGridView.SelectedIndex].Cells[0].Text
so in JavaScript it should be something like
var grid = document.getElementById('myGridView');
var gridRow = grid.rows[<what_Should_I_Type_Here?>].cells[0].text
Thank you very much in advance!
var grid = document.getElementById('myGridView');
var gridRow = grid.rows[document.getElementById("myGridView").selectedIndex].cells[0].text;
function Redirect(row) {
var rowData = row.parentNode.parentNode;
var rowIndex = rowData.rowIndex;
var grid = document.getElementById('ContentPlaceHolder1_Grd_Dashboard');
var value = grid.rows[rowIndex].cells[0].innerText;
alert(value);
window.location = "PoTracking.aspx?Pid=" + value;
return false;
}
I have a googlescript which creates a form that allows for existing entries to be edited, or for new entries to be added to a google spreadsheet. If it's a new entry, it takes the field values from the google form and places them into the last row of the google spreadsheet.
var lastCell = sheet.getLastRow(); //entry holds value of current last row position
var entry = sheet.getLastRow()+1; //entry holds value of new last row position
var IDCell = sheet.getRange("C"+entry); //IdCell is in column C, last row of table
The above code is fine..
The part I am hoping to get some help with is the part where I set IDCell to equal ((IDCell of the previous row) +1)
Something like:
IDCell.setValue((sheetData [lastCell][2]) +1);
but this gives me errors "Error encounter: cannot read property "2" from undefined"
Was able to solve on my own:
var lastcell = sheet.getLastRow();
var entry = sheet.getLastRow()+1;
var IDCell = sheet.getRange("C"+entry);
var prev_ID = sheet.getRange("C"+lastcell);
var prev_IDV = prev_ID.getValue();
IDCell.setValue((prev_IDV)+1);
This might have been obvious to some, but I am very new at JavaScripts so it wasn't immediately clear
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.