We Keep Coding

Google docs embedded document not showing until resize?

I have a problem in which sometimes (not clear when exactly), displaying an embedded document with docs.google.com does not show the document until I resize the browser window.
Grab some popcorn, here's a movie that shows the problem:
Here's my code:
HTML:
<iframe runat="server" id="frame" style="width:100%;height:600px;border:0;"></iframe>
C# Code begind (in Page_Load method):
frame.Attributes["src"] = "https://docs.google.com/gview?url=https://example.com/1.doc&embedded=true";
I tried reproducing it by browsing directly to https://docs.google.com/gview?url=https://example.com/1.doc&embedded=true but it never happens this way.
Note: Sometimes the document is never displayd at all, as if it was never loaded, and the iFrame remains totaly blank.
Any ideas how to fix this?

You could try to setup a default document size. This is what I do to print envelopes from Google Docs
var envelope10={};
envelope10[DocumentApp.Attribute.PAGE_HEIGHT]=296;
envelope10[DocumentApp.Attribute.PAGE_WIDTH]=684;
envelope10[DocumentApp.Attribute.FONT_FAMILY] = 'Calibri';
envelope10[DocumentApp.Attribute.FONT_SIZE] = 18;
envelope10[DocumentApp.Attribute.BOLD] = true;
envelope10[DocumentApp.Attribute.LINE_SPACING]=1;

itextsharp hyperlink a image and have it open in default viewer when picked

I have a pdf file created with itextsharp with images in the file. I would like to put a hyperlink in the file that if you pick the picture it will open that picture in a picture viewer. I can set a hyperlink to a web address but have no idea how to get it to open a file. Below is the code, yes I know that c:\test.jpg is a bad hardcoded file name but it is just a test. When you click the picture it does nothing but I have no idea how to tell it what to do.
iTextSharp.text.Image pic =TextSharp.text.Image.GetInstance(comment.examplePic);
pic.ScaleToFit(200f, 200f);
Chunk cImage = new Chunk(pic, 0, 0, false);
Anchor anchor = new Anchor(cImage);
anchor.Reference = "c:\\test.jpg";
doc.Add(pic);
doc.Add(anchor);

A PDF is self-contained. This means that all the resources needed to show the PDF are (usually) stored inside the PDF (exceptions are for instance fonts that can be retrieved from the operating system).
When you have an image that is shown on a PDF page, the bytes of that image are stored in what we call an Image XObject. An XObject is an object that is external to the page, but that is stored as a separate object inside the PDF file.
You are asking to serve the image bytes stored inside this separate object to a viewer on the operating system. This is impossible. I don't know of any viewer that can take those bytes and somehow forward them to an image viewer.
I can think of three possible workarounds. I don't know if any of these workarounds is acceptable to you.
1. Serve the image online
You could put the image on a server and use the code you have in your snippet to link to that online image. Of course: this will only work if the person viewing the document is online and clicks OK when his viewer asks him if it's OK to link to a resources on the internet.
2. Serve the image as an annotation
In this case, you create an annotation for which you create an appearance that renders that same image XObject in the annotation layer (all annotations are shown on top of the page content). You can easily change the visibility status of an annotation to make it invisible (in your case, this would be the default status) or visible (in your case, this would be triggered by a JavaScript action when clicking the link).
There's an example of such an annotation here: Advertisement. If you open advertisement.pdf, you see an image with a button that says "Close this advertisement". Once you click that, the status of the annotation will be changed to invisible. You could do something similar, but the other way round: click a link to make it visible instead of invisible.
This solution doesn't depend on an external viewer, the image is shown in the PDF viewer.
3. Add the image as optional content
Starting with PDF 1.5, PDF supports optional content. See for instance the OptionalContentExample. In this example, we have some questions and answers, but the answers are not visible by default. See layer_actions.pdf. There are links "on / off / toggle" to make the answers visible or invisible.
You could do the same with images: you could add them to a layer that is invisible by default, but that can be made visible if somebody clicks a link. However: this requires a viewer that supports OCG (optional content groups) and the actions to change the status of these OCGs. For instance: if you would try the layer_actions.pdf example in the PDF viewer in Chrome, it won't work, but if you download the PDF and open it in Adobe Reader, you'll see the behavior I described.
Summarized:
You are asking something that is impossible, but there are workarounds. Please post another question if you have chosen a workaround and you don't succeed in making that workaround word (but please take into account that not all viewers support every workaround).

no offence but too much knowledge sometimes makes you ignorant of small things.
simple solution to this problem is here
http://kuujinbo.info/iTextSharp/imageAnchor.aspx
sample code that i implemented works like charm
PdfPCell p1 = new PdfPCell();
p1 = new PdfPCell();
p1.Padding = 0;
p1.Border = 0;
PdfPTable nav = new PdfPTable(1);
nav.WidthPercentage = 100;
nav.SpacingAfter = 12;
navbarImg.Annotation= new Annotation(0, 0, 0, 0, ur);
p1.Image = navbarImg;
nav.AddCell(p1);
_doc.Add(nav);

Converting HTML Table into Image File

Is there any way to Convert HTML table to Image file? I have one HTML table which contains controls like Labels, GridView, and CheckBoxes. How can we convert this table into Image file for creating a PDF file?

This is not a trivial task. Ultimately, you need an HTML renderer to convert the HTML to pixels.
Fortunately, you don't need to write your own. You can use the WebBrowser control.
You can see some code I wrote to extract a thumbnail image from a given URL in the article Creating Website Thumbnails in ASP.NET.

If this is a one-off, load it up in your browser and take a screenshot (Alt-PrtScr on windows for just the current application)
If you need to do this repeatedly/in an automated way, you can either automate a browser control or you can use a headless browser
You should also look into WebKit2Png which will render the page in the same manner as Chrome/other webkit browsers and then save that as a png. It can optionally simulate javascript/etc too
Similarly, there's a wkhtmltopdf which works on all platforms

Converting HTML Table into Image File
$("#selfAssessmentPowerPointDownload").on('mouseover', function () {
var element = $("#html-content-holder"); // global variable
var getCanvas; // global variable
html2canvas(element, {
onrendered: function (canvas) {
getCanvas = canvas;
var imgageData = getCanvas.toDataURL("image/png");
var newData = imgageData.replace(/^data:image\/png/, "data:application/octet-stream");
$("#selfAssessmentPowerPointDownload").attr("download", "gridData.png").attr("href", newData);
}
});
});
<button id="selfAssessmentPowerPointDownload">Download</button>
<table id="html-content-holder"></table>

Datatables is a powerful jquery plugin for working with tables. One of the option that datatables offered is make a pdf or excel from your table. You can see find many examples in it's website.

Set an image in UI

Im using .net c# MVC3 Model. I need to show a gif called loading when I click save on the page. I used <img src="sourcepath" alt="loading" style="display:none"/> and trying to display it whenever user clicks save button using jquery. I have stored the image temporarily in views folder. Unfortunately, i could not see image on the screen. I can see its division with a small red cross cancel button.
Pls Help

If you're seeing the broken image icon, it means your src "sourcepath" is wrong. You would normally put static content in the Content folder of your site, and access it using /Content/imagename.jpg or /Content/Images/imagename.jpg or similar.

Try to use the search, here you can find an solution the show an spinner when doing ajax requests:
How to show loading spinner in jQuery?

Having trouble obtaining Telerik HTML Editor's content using jQuery

I have an editor that built as follows:
EditorBuilder builder = context.Html.Telerik().Editor()
.Name(ID)
.Encode(false)
.HtmlAttributes(new { style = string.Format("width:100%;height:{0}px", height) })
.Value(HttpUtility.HtmlEncode(value));
return builder.ToHtmlString();
Everything works as expected. What I want to do now, is get the contents of the editor to allow the user to "preview" it in another window. After some searching, I came across $find(<%=RadEditor.ClientID%>);, but I am not using this form of generating the editor (and it's in razor).
So, my question is, how do I get at the contents of the editor using jQuery? val() does not work.
Thanks in advance!

Telerik stores the content of the editor using the jQuery data()
method. To access the content of the editor use the following code:
var editor = $("#<your editor ID goes here>").data("tEditor");
alert(editor.value());
The ID passed to jQuery must match the ID you passed to the
Html.Telerik().Editor().Name() function.
The code above only works if you have setup the necessary scripts
for the telerik editor.
For more information please see the telerik client side api documentation.