We Keep Coding

Will Telerik Document Processing Library work with JavaScript?

Right now I have an application that is currently using PrinceXML to make PDFs in our application, but we would like to move towards using Telerik as a solution. The only problem I could foresee is that it expects all the rendering to be done on the markup prior to calling it. For example, a form might have some JavaScript on the page that needs to run when the page loads to fully layout the form correctly. If Telerik's component can't handle that (meaning the form has to be fully rendered server-side prior to) then that's going to be a problem. I'm having a hard time finding documentation on whether the Telerik Document Processing Library handles this.

Telerik offers another solution for client-side export, e.g.
<telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
<telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
<div class="demo-container size-medium">
<div class="buttonsContainer">
<telerik:RadButton RenderMode="Lightweight" runat="server" OnClientClicked="exportPDF" Text="Export page to PDF" AutoPostBack="false" UseSubmitBehavior="false"></telerik:RadButton>
<telerik:RadButton RenderMode="Lightweight" runat="server" OnClientClicked="exportImage" Text="Export page to Image" AutoPostBack="false" UseSubmitBehavior="false"></telerik:RadButton>
<telerik:RadButton RenderMode="Lightweight" runat="server" OnClientClicked="exportSVG" Text="Export page to SVG" AutoPostBack="false" UseSubmitBehavior="false"></telerik:RadButton>
</div>
<telerik:RadClientExportManager runat="server" ID="RadClientExportManager1">
</telerik:RadClientExportManager>
</div>
<script>
var $ = $telerik.$;
function exportPDF() {
$find('<%=RadClientExportManager1.ClientID%>').exportPDF($("#main"));
}
function exportImage() {
$find('<%=RadClientExportManager1.ClientID%>').exportImage($("#main"));
}
function exportSVG() {
$find('<%=RadClientExportManager1.ClientID%>').exportSVG($("#main"));
}
</script>
Please take a look at the following demos:
https://demos.telerik.com/aspnet-ajax/client-export-manager/functionality/export-whole-pages/defaultcs.aspx
https://demos.telerik.com/kendo-ui/pdf-export/index and https://demos.telerik.com/kendo-ui/pdf-export/page-layout

ASP.Net Repeater Responsive Controls Binding

I have ASP.Net controls for search attributes with check box options and ASP.NET repeater. For Responsive Design, I have same bindings in two different places to match the design.
Here, CheckBoxList ID=Options1 & ID=Options2 both having same binding but the code will repeat. I have 400 lines to check the conditions for single binding. i have to duplicate all the codes again for the another view. Is there any way to optimize the code to single bind with both views handling. ( Avoid duplicate binding and checking)?
// Desktop View
<div class="hidden-sm hidden-xs narrowSearch">
//Content
<asp:Repeater ID="rptAttributes1" runat="server" EnableViewState="true" OnItemDataBound="rptAttributes_ItemDataBound">
<ItemTemplate>
<li>
<div class="form">
<asp:CheckBoxList ID="Options1" runat="server" AutoPostBack="false" Visible="false"
DataTextField="EnOptionName" DataValueField="SubCategoryAttributeOptionID" Font-Strikeout="False" />
</div>
</li>
</ItemTemplate>
</asp:Repeater>
</div>
// Mobile view
<div class="sec_left hidden-lg hidden-md">
<div class="moremenu narrowSearch">
//Content
<asp:Repeater ID="rptAttribute2" runat="server" EnableViewState="true" OnItemDataBound="rptAttributes_ItemDataBound">
<ItemTemplate>
<li>
<div class="form">
<asp:CheckBoxList ID="Options2" runat="server" AutoPostBack="false" Visible="false"
DataTextField="EnOptionName" DataValueField="SubCategoryAttributeOptionID" Font-Strikeout="False" />
</div>
</li>
</ItemTemplate>
</asp:Repeater>
</div>
</div>
Code Behind:
CheckBoxList chklOptions1 = item.FindControl("Options1") as CheckBoxList;
CheckBoxList chklOptions2 = item.FindControl("Options2") as CheckBoxList;

You can place your repeater (including the declarative code as well as what you have in the code-behind of your page) into a custom user control. Then you put the user control in each section (desktop and mobile) of your page. This is the simplest way to avoid repeated code. Having said this, since you've only provided part of the code that's in the code-behind class of your page, I can't speak to what changes might be required when you move the imperative code you have in your page's code-behind class to the user control.
Good luck!

UpdatePanel does not appear on default load, but it does when specific page is given

I got my hands on a this web application few days back and I am already stuck with a problem.
When I load the page with, say, HL1 = http://localhost:8001/, UpdatePanel does not appear at all.
Though when I load the page with HL2 = http://localhost:8001/Default.aspx, it displays in its full glory.
[EDIT: Added HL1, HL2 tags]
FYI, UpdatePanel is part of a Master page.
Any suggestions?
Thanks,
Abhinav
[EDIT: Code for update panel]
<asp:UpdatePanel ID="upan" runat="server" >
<ContentTemplate>
<fieldset style="width:320px; padding:2px;margin-top:20px;margin-bottom:5px;" onmouseover="showHelp('quickAccess')" onmouseout="g_Popup.hide()">
<legend>Quick Access</legend>
<span style="vertical-align: middle">Dummy #
<asp:TextBox ID="txtSearchDummy" clientidmode="Static" runat="server" MaxLength="9" Width="70px" Height="15px" style="margin-top: 5px"></asp:TextBox>
<asp:Button ID = "btnSearchDummy" clientidmode="Static" runat="server" OnClick="btnSearchDummy_Click" style="display:none"/>
<button onclick="return quickAccess()" lang="javascript" type="submit" class="button_enabled" style="margin-left: 5px;">
<img alt="" src="images/lightning.gif"></img><span>Find Dummy</span></button></span>
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>

Thanks for all the help guys. Issue is resolved now and, as expected, it had nothing to do with ASP.NET. In master page code behind file that search box was being made invisible.
:)

how do I show a webpage in a modal popup?

I'm having surprisingly bad luck finding a decent resource for this. But What I'm doing is creating a list of tickets using a ListView. One of the controls in the item template is a link button that shows the header of the ticket. When the user clicks the link button, I want to open a modal window that shows the ticket in readable format. To get the ticket, I'll be passing that page a variable and it'll do the rest; nothing complicated. The page will have 3 buttons and the windows needs to close when you click one of them.
Now, I figured out how to use the ModalPopupExtender from the Ajax tookit more or less. You create the panel in it's own div which stays hidden. I created a click event that basically uses a webclient to download the html from the page and insert it into that div's innerHtml. This seems to work the first time. But as soon as you click a different link, the page pukes and says something about it being in an illegal state.
I'm not sure if I'm going about this wrong, and I can't find any decent examples of how to do this. Well there's one, but the english is hard to understand and it's in VB instead of C#. Any help?

<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<form id="form1" runat="server">
<div>
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</asp:ToolkitScriptManager>
<br />
<asp:ModalPopupExtender
DropShadow="true"
OkControlID="btnOk"
CancelControlID="btnClose"
runat="server"
PopupControlID="Panel1"
id="ModalPopupExtender1"
TargetControlID="Button1" />
<asp:Panel ID="Panel1" runat="server" CssClass="modalPopup" style="display:none;">
This is basic modal popup.
<br /><br />
<asp:Button ID="btnOk" runat="server" Text="Ok" />
<asp:Button ID="btnClose" runat="server" Text="Close Me" />
<iframe src="http://www.google.com"></iframe>
</asp:Panel>
<asp:Button ID="Button1" runat="server" Text="First Modal Popup" />
</div>
</form>
Try this it should work.

How can i automatically update a user control without updating the whole asp.netpage

How can i automatically update a user control after a specific time without updating the whole aspx page. I haven't done it before. Any ideas would be appreciated.

i suppose you are using asp.net ajax and it has timer control.
check this example : http://ajax.net-tutorials.com/controls/timer-control/ and this video : http://www.asp.net/ajax/videos/how-do-i-use-the-aspnet-ajax-timer-control .

If you have the AJAX extension installed, you can use an UpdatePanel and the ContentTemplate to only refresh that region of your webpage when performing a Postback. You can put any content here, as a self created Usercontrol.
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<div>
<asp:Label ID="Label1" runat="Server"></asp:Label>
<br />
<asp:UpdatePanel ID="UpdatePanel1" runat="Server">
<ContentTemplate>
<asp:Label ID="Label2" runat="server"></asp:Label>
<br />
<br />
<asp:Button ID="Button2" runat="server" Text="Click Me Again" OnClick="Button2_Click"/>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
The idea would then be to use a Timer to perform a Postback of that UpdatePanel, as someone else has suggested a link for that.

I'm not really sure what you mean when you say "updating" but if you take a look at the life cycle of an active server page you will see that the whole page will be "refreshed" by the web server.
When the web server responds to a client request the entire content will be transformed to a page displayable by a browser and send to the client.