I am using ASP.NET and C# and I am using window.open() for opening the window.Now i need to set the width of that page in that window.
I am using this code on buttonclick event.
ClientScript.RegisterStartupScript(this.GetType(), "oncl", "<script language=javascript>window.open('Print.aspx','PrintMe','width=900,resizable=1,scrollbars=1');</script>");
The width inside the script is only setting the widow width. But i want to set the width of the page.
Is it possible?
Thanks..
Edit:
Sorry I didn't mention it before.I am writing the content into print.aspx dynamically.That i am using this code for fill the page.
Page pg = new Page();
pg.EnableEventValidation = false;
HtmlForm frm = new HtmlForm();
pg.Controls.Add(frm);
frm.Controls.Add(ctrl);
pg.DesignerInitialize();
pg.RenderControl(htmlWrite);
string strHTML = stringWrite.ToString();
HttpContext.Current.Response.Clear();
HttpContext.Current.Response.Write(strHTML);
This is called on pageload event. So i am printing the .aspx page in print.aspx. So i want this content should be in the static page width.
Width specified inside window.open() function will only set width of the popup window. If you want to change the width of the page then you should try changing the width inside Print.aspx.
You cannot change width of the page using window.open, it only sets the window properties.
To change the width of the page you need to change the style of print.aspx
probably if you have to change the width of the wrapped div element or body of the page
var newwindow = window.open('Print.aspx');
var elem = newwindow.document.getElementById('my-id');
elem.style.width = 'XYZpx'
P.S. :- The above code will only work if the new window has the same protocol, domain and port. If it's on another domain, you can't do this for security reasons.
You can also use
window.resizeTo(x,y);
For Instance:
function resizeWindow()
{
// you can get height and width from serverside as well
var width=400;
var height=400;
window.resizeTo(width,height);
}
On onload() event of body call the function
<body onload="resizeWindow()" >
body of page
</body>
In case which you're using that page only with the window.open method then set the width of the page respectively hard-coded, otherwise, inject the size while opening the page using window.open.
How to inject while opening:
Access child window elements from parent window using Javascript
(Notice to security issues on Cross-origin resource sharing)
In short:
var childWindow = window.open('Print.aspx','PrintMe','width=900,resizable=1,scrollbars=1');
childWindow.document.getElementById('someDivId').style.width = '400px';
Or access it at the server-side:
HtmlForm frm = new HtmlForm();
frm.style = ; //
read here
How to set it hard-coded:
Width of which element in the window you want to change?
body?div?
I guess you you're taking about the margin left & right of your page's body.
try insert the following style block to your head tag:
<style>
body{margin: 0 10px 0 10px;}
</style>
where 10px is the left and right margin.
Related
I have HTML code something like -
<html>
<body>
<table><tr><td><h1>Heading</h1></td></tr></table>
</body>
</html>
In a specific requirement, I need to know in advance that how much height will this HTML will take to display in fullscreen. So that I keep that much space calculated specifically for that content.
What I thought was to render this code in WebBrowser control, and then take the height.
this.webBrowser1.Url = new Uri(htmlFilePath);
//The below code will force the webbrowser control to load the HTML in it.
while (this.webBrowser1.Document.Body == null)
{
Application.DoEvents();
}
int height = this.webBrowser1.Document.Body.ScrollRectangle.Height;
But in console application I can't use WebBrowser control. Is there any other way I can accomplish this?
Answering my own question -
All I needed to do was adding reference of System.Windows.Forms in my console application.
After that I was able to use WebBrowser in headless form directly without creating any form element.
After using WebBrowser, I set the height/width of reasonable number. Something like below -
WebBrowser wb = new WebBrowser();
//Setting the page height and width to a reasonable number. So that whatever the content loaded in it gets aligned properly.
//For me 3000 works fine for my requirements.
wb.Width = 3000;
wb.Height = 3000;
wb.Url = new Uri(htmlFilePath);
//the below code will force the webbrowser control to load the html in it.
while (wb.Document.Body == null)
{
Application.DoEvents();
}
int height = wb.Document.Body.ScrollRectangle.Height;
[enter image description here][1]Help!
I have two svg image buttons on my page. On the page load I am displaying one of the two buttons based on the value in the DB . and I have jquery to hide that button and show another one on button click from UI. I cannot show another button after hide.
both buttons are in a single span class.
The visibility property can't be block. You should use visible instead.
Have a look at the documentation for more about this property.
EDIT
If that can help... Here is an example showing both hidden and visible for the visibility attribute...
// That is executed on load.
$("#btnXX").css("visibility", "visible");
$("#btnYY").css("visibility", "hidden");
// Handler for the toggle button.
$("#toggle").on("click", function(){
$(this).toggleClass("active");
if($(this).hasClass("active")){
$("#btnXX").css("visibility", "hidden");
$("#btnYY").css("visibility", "visible");
}else{
$("#btnXX").css("visibility", "visible");
$("#btnYY").css("visibility", "hidden");
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="btnXX">XX</button><button id="btnYY">YY</button><br>
<br>
<button id="toggle">Toggle it</button>
I figured it out. My back end code was using property btnXX.Visible = false, Changing it to display:none fixed my issue.
If you don't want to render the control at all in certain situations, set Visible="false". Since it keeps the control's HTML out of the page, slightly but if you want to show the control via Ajax/etc, this won't work and display:none css should be used
In my application i create a navigation menu dynamically. When I click on the anchor tags that refer to various content page I want to capture the anchor tags' text and display it in a div in the content page.
How can i possibly achieve this?
Can it be done through HttpHandlers? or do I need to look into something else??? Please help.
Assuming that you want your div to look different or be positioned in different places for each content page and all you want to display in that div is the page URL you can solve this using a simple script that you can add in your master page:
document.onload = function()
{
var titleDiv = document.getElementById("titleDiv");
titleDiv.innerText = window.url;
}
The only constraint is that your div must have the same id in all the content pages.
How can I select a tab programmatically of a TabContainer? and also how can I get the selected Tab?
You can set the Tab Index like...
tbcName.ActiveTabIndex = 3;
and similarly
tbcName.ActiveTabIndex// Return active tab index
Please note, tab Index start from 0
Here is a complete list of TabContainer's properties taken from here:
TabContainer Properties
ActiveTabChanged (Event) - Fired on the server side when a tab is changed after a
postback
OnClientActiveTabChanged - The name of a javascript function to attach to the
client-side tabChanged event
CssClass - A css class override used to define a custom look and feel for the tabs.
See the Tabs Theming section for more details.
ActiveTabIndex - The first tab to show
Height - sets the height of the body of the tabs (does not include the TabPanel
headers)
Width - sets the width of the body of the tabs
ScrollBars - Whether to display scrollbars (None, Horizontal, Vertical, Both, Auto)
in the body of the TabContainer
TabStripPlacement - Whether to render the tabs on top of the container or below
(Top, Bottom)
Useful links with sample code:
http://sandblogaspnet.blogspot.com/2009/04/setting-focus-to-particular-tab-in.html
tabContainer = tabContainer.control;
//Retrieving the tab using the get_activeTab method/property
var tab = tabContainer.get_activeTab();
var headerText = tab.get_headerText();
alert(headerText);
//Another way of retrieving the tab using the get_previousTab method/property
tab = tabContainer.getPreviousTab();
alert(tab.get_tabIndex());
3 Tips for Working with the AjaxControlToolkit's TabContainer Control
yourTabContainer.ActiveTab = tabIndex;
I have a label control in a page in asp.net 2.0 and a button Print.
Clicking on print button I need to print the content of the label and I need same for a panel also.
Is it possible to implement this?
If yes then how to implement that?
Please help.
What about Window.Print() method? Because execcommand method will not work other browsers that IE. Use CSS media option to control the print area.
You would need to add some client side javascript to your Print button to execute the brower's print command. The javascript below could be used to print the whole document page and would be a good place to start. Note: It isn't possible to do this without displaying the print dialog unless you use a third party component.
// Print Page
window.print();
If you wanted just to print certain sections of your page you can achieve this two ways. Firstly, you could render the content to be printed into a hidden iframe and then print just that frame. You would do this using the same code as above only from within the frame itself.
Secondly, you could use a media style print style sheet, a CSS that applies only when printing. Inside this sheet you would set the styles you wanted to print as normal and the styles you didn't want to print to "display:none". The link below contains more information on print stylesheets.
http://www.webcredible.co.uk/user-friendly-resources/css/print-stylesheet.shtml
One more approach could be to open new window and populate the contents of div you wanted to print and have print link/button on that page.
Ex:
var win = window.open(...)
win.document.body.appendChild(document.getElementById('divToPrintId'))
This is how the code will look like this approach is used to print the content/part of the page.
Use below code in button onclick event
ClientScript.RegisterStartupScript(this.GetType(), "PrintOperation", "PrintGridData()", true);
Above link will call function named PrintGridData() which is written in head section as below
<script type="text/javascript">
function PrintGridData()
{
var prtGrid = document.getElementById('<%=GridView.ClientID %>');
prtGrid.border = 0;
var prtwin = window.open('', 'PrintGridViewData', 'left=100,top=100,width=1000,height=1000,tollbar=0,scrollbars=1, status=0,resizable=1');
prtwin.document.write(prtGrid.outerHTML);
prtwin.document.close();
prtwin.focus();
prtwin.print();
prtwin.close();
}
</script>
in this script it will only print div name GridView and other part will not be printed