export javascript table to excel or to console table - javascript

I have build a table:
function insertTable(elementName, text, textColor, backgroundColor, relativeOffsetArea, fatherBC, scrollArea, offsetArea, clientArea) {
this.elementName = elementName;
this.text = text;
this.textColor = textColor;
this.backgroundColor = backgroundColor;
this.relativeOffsetArea = relativeOffsetArea;
this.fatherBC = fatherBC;
this.scrollArea = scrollArea;
this.offsetArea = offsetArea;
this.clientArea = clientArea;
}
And i'm adding to this table data during the running process..
but when I'm viewing the filled table in console log with this code:
console.table(consoleResult,["elementName", "text", "textColor", "backgroundColor", "relativeOffsetArea", "fatherBC", "scrollArea",
"offsetArea", "clientArea"]);
the maximum number of the lines is 1000.
does console table is limited to length of 1000 ?
Do you familiar with another way (maybe excel) to export this table ?

console.table only works in some browser versions. If you want this data in excel just loop it to a server script and download it as an xls with and html table in it. ( its a bit hacky but excel will happily open an html table saved as an xls file)
in php heres an example:
HTML table to excel - PHP

Related

reading Excel file on Javascript

I want to read only one row each time on excel. I can read all datas in excel but I couldn't limit it. Either I can read only 1 column in all rows or the all data. How can I read just 1 row on javascript?
I use this script and this src:
<script src="https://unpkg.com/read-excel-file#4.x/bundle/read-excel-file.min.js"></script>
<body>
<input type="file" id="input">
<script>
var input = document.getElementById('input');
input.addEventListener("change", function (){
readXlsxFile(input.files[0]).then(function (data){
data.map((row,index)=>{
var location= document.createTextNode(row);
console.log(location)
If you need one row, don't map over entire file:
readXlsxFile(input.files[0]).then(data => {
console.log(data[0]) // supposed to print the first row
})

fetching data from external JSON file into an innerHTML table using JQuery

I have created an HTML table called players_table consisting of 3 variables(ID, Name, Country)
The table should display the fetched JSON data into its rows. I don't know what's wrong and why it isn't fetching anything. Could you please help me out fix this error and display results into the table?
<script>
$(document).ready(function()
{
$.getJSON("GameDb.json", function(data)
{
var player_data = '';
$.each(data,function(key,value)
{
player_data +='<tr>';
player_data +='<td>'+value.Id+'</td>';
player_data +='<td>'+value.Name+'</td>';
player_data +='<td>'+value.Country+'</td>';
player_data +='</tr>';
});
$('#players_table').append(player_data);
});
});
</script>
The console is not showing any errors. However, the entire table cells are showing the word "Undefined".
This is the view from my end.

CasperJS loop through table and scrape data for JSON output

I'm actually trying to get some data from a website in CasperJs. The datas are stocked in a table.
I'm trying to get a proper JSON file after the scrap. A json with :
- name of the company,
- mail,
- website
- description of activity.
Until now I've been able to open the page and get the data but not precisely (mail and website are on the same ). So I've found how to select precisely each element I want.
But in this case I don't get all table information's, only first row...
I would know if somebody could help me, telling me where to look or how to make loop in my case ? Assume I'm not a professional developper, I'm training myself.
Here my code :
var casper = require('casper').create();
var url = 'http://www.rent2016.fr/pages/exposants';
var fs = require('fs');
var length;
casper.start(url);
casper.then(function() {
this.waitForSelector('table#myTable');
});
casper.then(function(){
var info = this.evaluate(function(){
var table_rows = document.querySelectorAll("tr"); //or better selector
return Array.prototype.map.call(table_rows, function(tr){
return {
nom : document.querySelector(".td-width h3").textContent,
description: document.querySelector(".td-width p").textContent,
mail : document.querySelector("td span a").textContent,
site : document.querySelector('td span a[href^="http"]').textContent,
};
});
});
fs.write('test_rent_stringify.json', JSON.stringify(info), 'w');
this.echo(JSON.stringify(info, undefined, 4));
});
casper.run(function() {
});
Here, we don't have loop : JSON repeat the first row information's. To get every rows informations you have to replace
nom : document.querySelector(".td-width h3").textContent,
by
nom : tr.children[1].textContent,
but in this case you can't precisely target the H3, the links... you get all the information. So actually I can :
loop through the rows and get informations, but they unusable
have only the first row informations but with good presentation
Thanks in advance !
In order to take information inside every element, you have to use tr.querySelector rather than document.querySelector.
The following loop works fine with the page:
var table_rows = document.querySelectorAll("tbody tr"); //or better selector
return Array.prototype.map.call(table_rows, function(tr) {
return {
nom: tr.querySelector(".td-width h3").textContent,
description: tr.querySelector(".td-width p").textContent,
mail: tr.querySelector('td span a[href^="mailto"]').textContent,
site: tr.querySelector('td span a:not([href^="mailto"])').textContent
};
});

String manipulation/extract a substring & PDF file produced from a HTML file using iTextSharp, a .NET PDF library for creating the PDF file

I have an issue with using iTextSharp and String manipulation/extract a substring that contains “[number]” and producing the PDF file. My previous question was posted here:
String manipulation & PDF output file
I am using this function to extract the substring that contains "[..]"
<script>
</script>
<script>
function extract() {
var str = "van4[15]";
return str.substring(0, str.lastIndexOf("["));
}
document.getElementById("demo").innerHTML = extract(); </script>
It is a: ASP.Net MVC webpage. The view has a grid with Location , RoomName.... and a checkbox for PDF printing. The records/data on the grid comes from SQL db. This Location field data contains for couple of records at the end "[number]". If the user select the checkbox for one record after clicking on "Print into PDF " button should produce the PDF file.
I am using string contents = System.IO.File.ReadAllText(HTMLFilePath) to read the file where Location, RoomName. It is part of this Html file.
The code behind Print button starts with:
public ActionResult ReportsPDF(PrintFormReportModel Obj) { string HTMLFilePath = Server.MapPath("~/Views/Reports/RoomSignReport.htm");
Where this file RoomSignReport.htm is the one that I am trying to modify by extracting the substring that contains[..] form the Location data ). The task is to extract the substring that contains [number] , the reason why I came up with idea of using the function extract(). Unfortunately using the <script> function extract(..</script> displays at the top of PDF file the content of <script> tag instead of displaying the result here : <p id="demo"></p>
I solve this task by myself. For anyone that might need help with this topic, I am adding the code snippet here:
if (ReportList.Count > 0)
{
PdfWriter writer = PdfWriter.GetInstance(Report, new FileStream(FullPath, FileMode.Create));
Report.Open();
try
{
if (ListRoomSign.Count > 0)
{
foreach (var ObjReportList in ReportList)
{
foreach (var ObjRoomSignList in ListRoomSign)
{
.....
string contents = System.IO.File.ReadAllText(HTMLFilePath);
//Remove square brackets value from room name
if (ObjReportList.Location.Contains("["))
{
ObjReportList.Location = ObjReportList.Location.ToString().Substring(0, ObjReportList.Location.ToString().LastIndexOf("["));
}
//
contents = contents.Replace("[RoomName]", ObjReportList.Location);
var parsedHtmlElements = HTMLWorker.ParseToList(new StringReader(contents), null);
foreach (var htmlElement in parsedHtmlElements)
{
Report.Add(htmlElement as IElement);
}
Report.NewPage();
}
}
}
Report.Close();
}
catch (Exception)
{
FullPath = string.Empty;
}
}
return FullPath;

How to render custom html in bootstrapTable but when using sidePagination and url?

I am using https://github.com/wenzhixin/bootstrap-table on some project.
I find that is really easy to use and implement pagination. However I have some problem regarding custom html in different rows. This is just peace of code.
$('#selector').bootstrapTable({
pagination: true,
url : some_rest_url,
sidePagination: 'server',
onLoadSuccess: function (res) {
var data_ = [];
var rows = res.rows;
for (var i =0; i < rows.length; i ++) {
var data = {};
var item = rows[i];
$.each(item, function (key, value) {
if (key == "cost") value = "< span class="cl" >"currency + " " + parseFloat(value).formatNumber(2, '.', ',')."< / span >";
//and so on some more styling and formatting for other elements/columns of table
data[key] = value;
});
data_.push(data);
}
$('#selector').bootstrapTable("load", data_);
So table should have one column and in each row span element with that class but that is not happening.
I just have that default plain text data from boostrapTable default load (json data).
BTW when using plain ajax call instead of that default boostrapTable pagination thingy everything works great but then i have to make custom pagination (and using sidePagination = client is just wrong and working slow when have like 1000 records ).
After wasting couple of hours, solution was to use formatter for columns. For example:
field: 'column_name',
formatter: operateFormatter
function operateFormatter(value, row, index){
//value is text from json
//row is all values from json for that row
}
well this way, code will be much more clearer.

Categories

Resources