I've been using phantomjs and wkhtmltopdf to generate PDF reports of large 7000 row bootstrapped themed tables with color. Both run out of memory when trying to do so. Both uses nearly 1GB of memory to try to generate the PDF of the table. So I've been trying to figure out why. I want to first try to unlink tablesorter and clear it's cache when I'm printing a PDF report because it doesn't need any user interaction (no sorting or filtering needed). But everytime I use destroy, it destroys the look and feel of the table. I want to retain the look and feel but only destory tablesorter stuff like widgets and cache so that it doesn't consume so much memory. Is there a way to clear tablesorter but retain the look and feel of my table?
Update:
Thanx for replying Mottie!
I actually tried that and debugged and found that this is how the DOM looks like with tablesorter enabled with bootstrap theme:
<table data-bind="if: details" id="ColorTable-sticky" class="tablesorter tablesorter-bootstrap table table-bordered hasFilters containsStickyHeaders tablesorter-sticky-hidden" style="position: fixed; margin: 0px; top: 40px; visibility: hidden; z-index: 2; height: 0px; width: 1190px; padding: 0px; border: 0px; left: 36px;">
But once I destroy(false), I get this:
<table data-bind="if: details" id="ColorTable-sticky" class="tablesorter">
I would have thought that "tablesorter-bootstrap" class would be retained in the class but it appears that all classes were removed except for "tablesorter" class.
How do I get it to retain the tablesorter-bootstrap class?
The destroy method does have parameters:
// Remove tablesorter and all classes but the "tablesorter" class on the table
// callback is a function
$("table").trigger("destroy", [false, callback]);
If you pass false as the first parameter, everything is still destroyed, but the "tablesorter" class, including the theme name (e.g. "tablesorter-blue"), is retained.
The sort arrows are removed as well.
Update: Oh, I guess the "tablesorter-bootstrap" class is removed because it is part of the "uitheme" widget. I'll look into that. In the mean time, use the destroy callback function to restore the class name:
$("table").trigger("destroy", [false, function(table){
$(table).addClass('tablesorter-bootstrap');
}]);
Update 2: Ok, that didn't work as expected, you'll need to reapply the "uitheme" widget, but since the destroy method removes the API, I'll update the destroy method in the repository and have it working in the next udpate.
Related
this is a pretty specific question regarding Notepad++, or any other way you think I can separate these, frankly. I'll give you a quick example:
<div class="image" style="position: absolute; left: 260px; top: 0px;"><img src="http://www.Imagelink1.com/1"></div>
<div class="image" style="position: absolute; left: 520px; top: 0px;"><img src="http://www.Imagelink1.com/1"></div>
<div class="image" style="position: absolute; left: 180px; top: 0px;"><img src="http://www.Imagelink1.com/1"></div>
<div class="image" style="position: absolute; left: 210px; top: 0px;"><img src="http://www.Imagelink1.com/1"></div>
Despite their styling and positions, how would I delete all of these lines while maintaining the first of the duplicate lines (due to the ImageLink URLs being the same). It would be easy to just 'Search and Replace', if it weren't for the positions and some of them having the same link.
It's much more complicated than that, but how would you go about deleting this?
If I understand correctly, the URL is the part that should be unique?
My way to do that would be to seperate the url's from the rest of the HTML, for example by using a regex and replacing everything that's not the URL, or by using block-select in Notepad++ and select all the URL's.
Then I'd paste the URL's in one column in Excel and paste the complete line (including the HTML) in the second column.
Then simply filter the first column by uniqueness:
Select the first column containing the URL's
Click the data-tab
There's a button "Remove duplicates". Click that.
It will ask if you want to expand the selection or use the selected column only. Tell Excel to expand the selection (because we want to filter all columns)
Then a window will popup asking which column contains the duplicate values. Select only column A because that's the column containing the URL's.
If you then click OK (or whatever the button is named) it will remove the duplicates like it should.
Then copy the second column back to Notepad++ and you'd have the unique lines.
I realize that this topic was discussed many many times. However, none seem to apply to me. I am generating HTML page using ASP.NET MVC construct HTML.DisplayFor() which generates <div class="display-label">Label</div> <div class="display-field">Value</div> pair for every property. I am trying to display them as a column - each line would have a label and a value. I tried various combinations, the best I came is the following:
.display-label {
font-weight: bold;
float: left;
width: 25%;
}
.display-field {
margin-left: 25%;
width: 75%;
}
Looks close to what I want; however, some fields have NULL value, in which case generated HTML is <div class="display-field"></div> In this situation next label is shown on the same line (where value would otherwise be).
I tried clear and display in various combinations - but none of them shows a label, a value and an empty block if the value is missing (for example, clear shifts all values up).
I am sure I am not the first one trying to solve this problem. But I couldn't find anything relevant; and my CSS skills are clearly insufficient. And yes, I know that I can write a custom DisplayFor template; but I was hoping that it wouldn't be necessary!
<div class="display-label">Label</div> <div class="display-field"></div>
<div style="clear:both"></div>
<div class="display-label">Label</div> <div class="display-field">Value</div>
Worked for me.
I think I got something that makes it work:
.display-field::after {
content: ".";
visibility: hidden;
}
Intuitively, I don't like it; so if somebody has a better solution, I'd love to use that one. But it works, and I don't have to mess with the template for a huge class
I have a list of comments on my page that is zebra colored to aid distinction between each comment.
I achieve the zebra colouring using the rails cycle helper in the partial I use for each comment:
<div class="span9 <%= cycle("odd_response", "even_response") -%>">
I dynamically update this list via a form that prepends a new comment to the top of list via AJAX when the user submits a new call.
As I use the same partial as the template to render this new comment the comment is only colored as the "odd_response" irrespective of the color of the previous response i.e. it starts the cycle process again.
How do I get the partial to respect the order of colors present in the table that it is being prepended to?
My solution would be to drop the cycle call and use this CSS for the zebra stripes.
tr:nth-child(even) {
background-color: red;
}
tr:nth-child(odd) {
background-color: white;
}
This works in all modern browsers, no IE7/8 support.
I ended up resolving this by placing some custom JavaScript in the create.js action that first checked what the background colour of the last comment was and then altered the new comment to the opposite colour immediately after rendering the object on the page.
1) I am trying to get the Paginate to display in same line instead of new line. Currently I have
<< Previous
1
2
Next >>
My CSS is defined as follows:
.pagination{CSS Style code}
.pagination a {CSS Style code}
.pagination a.current{CSS Style code}
2) How to turn off << Previous and Next >>?
3) What is the a.(class) called for currently selected paginate?
Currently I have .pagination a.current{CSS Style} but it does not work
I am using https://github.com/mislav/will_paginate
I am a complete Newbie in Rails;
Thanks in advance! :)
In case, any body still needs help with this... because there are many things with the class .pagination all as part of the <%=will_paginate %>. You may want to refer to the parent element.
div.pagination {
max-width: 100%;
min-width: 100%;
width: 100%;
}
and any other styling you may want.
Also, ensure that the parent element to that div does allow it to be spread out..
in case it happens to be in an or which have a width of 10px and you have 3000pages or that kind of thing.
you may want to remove it from it's parent element.
How does the DiggBar work?
I'm trying to make an ASP.NET MVC DiggBar clone just for learning purposes and does anyone have a suggestion on how to specify the url of the content for the lower frame? How would you go about constructing that in MVC?
Also, I know that it is an iFrame, but how do they position it so regardless of scrolling it stays positioned at the top? Is it CSS magic?
Edit: I'm not interested in whether or not you like them. I am not putting one into production and I'm not asking for whether they are good design or not. I simply ~want~ to make one.
I find the DiggBar useful and I like it. Hell, you can turn it off in two clicks! Similarly, reddit has a reddit bar which is opt-in (probably better approach).
The basic html is:
<html>
<head>
<style type="text/css">
#toolbar {position: fixed; top: 0; height: 40px; width: 100%; ... }
#page {width: 100%; height: 100%;}
</style>
</head>
<div id="toolbar">
All your toolbar stuff here.
</div>
<iframe id="page" name="page" src="http://url.to/page" frameborder="0" noresize="noresize"></iframe>
</html>
You would have a slug on your own URLs that maps to the page's URL, e.g.
d1oKo3 => http://news.bbc.co.uk/2/hi/technology/7991708.stm
All your view would have to do is look up the mapping and put the page's URL into the iframe's src. Just make sure you have a way for users to opt out, as some people don't like this sort of toolbar.
It may well be a horrible blight on the interweb in your opinion but that wasn't what the man asked - why do you think anyone cares whether you think these tool bars should exist out there or not? no ones asking you to use em.
If you feel that they shouldn't then simply butt out and let someone else answer the question. After all if they really are so unpopular folk will vote with thier mice and go elsewhere and the sites that deploy them will dwindle to nothing. Thats whats so great about the web, it doesn't need impotent geeks dictating whats good and whats not folk can decide for themselves.
Happy coding your way.
First of all, please don't do something like that, I don't know anyone that likes those things.
Something can be kept at the top like that using the CSS:
position: fixed;
As for specifying the URL, I'm not sure exactly what you're asking. When you click on a link on digg now, the destination URL is something like this:
http://digg.com/d1oIyx
The "d1oIyx" would just be used as a primary key into a database where they're storing the URL to be loaded in the bottom iframe.
thanks , i found a solution that work ( attached ) , but how i make it full page iframe ?
working link : http://www.clalit.org/2.php?link=http://cnn.com
<?php
$link=$_GET["link"];
echo "<iframe src=\"$link\"/>";
?>