Issue adjusting iframe height when opened as popup using ModalPopupextender - asp.net

I am using a ModalPopupextender Ajax Control to open aspx page in a modal Popup. aspx page is opened in a iframe as shown in below code.The content which is loaded in iframe is dynamic hence I cannot give a fixed height to iframe. I want that I should be able to adjust the height as per the content every time popup is being opened. I have a function to resize the iframe height and I am using that successfully on my other pages where iframe gets populated in the window itself but not able to adjust the height when iframe is opened in a POPUP. I have already tried window onload, iframe onload events without any success.
<asp:ModalPopupExtender ID="ModalPopupExtender2" BackgroundCssClass="transparentBG"
runat="server" CancelControlID="ButtonCancel" OkControlID="ButtonDone"
TargetControlID="btnAddNew" PopupControlID="DivAddWindow" Drag="true" >
</asp:ModalPopupExtender>
<div class="popup_Buttons" style="display: none">
<input id="ButtonDone" value="Done" type="button" />
<input id="ButtonCancel" value="Cancel" type="button" />
</div>
<div id="DivAddWindow" style="display: none;">
<iframe id="IframeEdit" scrolling="no" src="MasterPage.aspx" width="700px">
</iframe>
</div>
I would really appreciate if somebody can lead me the solution to resolve this.

Try this:
<iframe id="IframeEdit" onload="iframeLoaded()" scrolling="yes" src="MasterPage.aspx" width="700px">
</iframe>
following javascript function would get height from the iframe content.
<script type="text/javascript">
function iframeLoaded() {
var iFrameID = document.getElementById('IframeEdit');
if (iFrameID) {
iFrameID.height = "";
iFrameID.height = iFrameID.contentWindow.document.body.scrollHeight + "px";
}
}
</script>
I checked it in even ModalPopupextender, it works.

Related

Disable Resize option for divs in Radeditor (WYSWYG)

RadEditor version 7.3.3.0
I am using radeditor from telerik to give editing option for creating and modifying emails.
editor contents are created in <tr> and <td> formats. each td can have div and other dom inside it.
It appears to us that resize options are provided for all divs in wyswyg editor when editing is done in firefox. whereas it is not there in other browsers. How can i disable the resizing option for firefox.
In Firefox:
In Chrome:
This comes from the browser's rich text editing engine and I do not think you can stop it.
Try adding the same HTML in a simple editable iframe to test it. Here is a simple page that you can use for that:
<body onload="SetEditable()">
<b>Set your original HTML content here:</b><br />
<textarea id="htmlArea" style="width: 783px; height: 189px"></textarea>
<br />
<input type="button" onclick="CreateHtml();return false;" value="Set Content in the IFRAME">
<br />
<b>Editable IFRAME element:</b>
<br />
<iframe
src="javascript:void(0)"
id="editor" style="width: 774px; height: 489px;border: 3px solid red;"></iframe>
<input type="button" onclick="ShowIFRAMEHTML();return false;" value="Show IFRAME HTML">
<br />
<b>HTML Mode of the IFRAME:</b>
<br />
<textarea id="htmlMode" style="width: 783px; height: 313px"></textarea>
<script type="text/javascript">
var editor1 = document.getElementById("editor"); //reference to the IFRAME element
var htmlArea1 = document.getElementById("htmlArea"); //reference to the HTML area in which we put the content
var htmlMode = document.getElementById("htmlMode"); //reference to the HTML area that displays the IFRAME content
var oDocument = editor1.contentWindow.document;
var sMarkup = "<html><head><title>New Document</title></head>" +
"<body contenteditable=true style='overflow:scroll;margin:0px;padding:0px;height:100%'>" +
" </body></html>";
function SetEditable()
{
oDocument.open();
oDocument.write(sMarkup);
oDocument.close();
oDocument["designMode"] = "on";
}
function CreateHtml()
{
oDocument.body.innerHTML = htmlArea1.value;
htmlMode.value = oDocument.body.innerHTML;
}
function ShowIFRAMEHTML()
{
alert(oDocument.body.innerHTML);
}
</script>

Link not working in asp.net master page for some reason

I am working on asp.net website using webforms & i am facing strange problems for some unknown reason.
I am different banner in different areas of teh page & one common banner in the header section of the MasterPage, Banner show up as it should but problem is that link with the banner is not working.
Below is the partial code generated after page display.
<div class="horizontalBannerBar">
<!-- Header Banner -->
<div class="pnlHeaderBanner" id="pnlHeaderBanner">
<a target="_blank" href="http://abc.com" class="bannerlink" id="hypLnkHeaderBanner"><img style="border-width:0px;" src="../images/Banners/32dfe9ee-0832-4d89-8c61-45b0ef371f1f.jpg" id="imgHeaderBanner"></a>
</div>
<!-- Header Banner -->
</div>
I am using Panel as a wrapper so that i can hide the banner in case banner is not present .
Below us the Code i use to assign value to hyperlink control & image control
DataSet ds = DataProvider.GetTopBanner(ArticleID, PageID, IssueID, CategoryID, BannerLayoutPosition, LangID);
if (ds.Tables[0].Rows.Count > 0)
{
imgHeaderBanner.ImageUrl = ds.Tables[0].Rows[0]["ImagePath"].ToString();
hypLnkHeaderBanner.NavigateUrl = ds.Tables[0].Rows[0]["BannerURL"].ToString();
}
else
{
imgHeaderBanner.Visible = false;
pnlHeaderBanner.Visible = false;
}
Actual .ASPX page code
<div class="horizontalBannerBar">
<!-- Header Banner -->
<asp:Panel ID="pnlHeaderBanner" CssClass="pnlHeaderBanner" runat="server">
<asp:HyperLink ID="hypLnkHeaderBanner" CssClass="bannerlink" runat="server" Target="_blank">
<asp:Image ID="imgHeaderBanner" runat="server" BorderWidth="0" />
</asp:HyperLink>
</asp:Panel>
<!-- Header Banner -->
</div>
It seems HTML is breaking up somewhere but i am not able to see it even on fiddle it doent work in FF & Chrome while link works in IE 9..
Example LINK
It's because of the z-index: -999; in your CSS. If you set it to 0 then your link will work.
Also the <img /> tag is not properly closed in the HTML sample you posted at the top. I doubt that's the actual HTML generated by ASP.NET though.
<div class="horizontalBannerBar">
<!-- Header Banner -->
<div class="pnlHeaderBanner" id="pnlHeaderBanner">
<a target="_blank" href="http://abc.com" class="bannerlink" id="hypLnkHeaderBanner">
<img style="border-width:0px;" src="../images/Banners/32dfe9ee-0832-4d89-8c61-45b0ef371f1f.jpg" id="imgHeaderBanner" />
</a>
</div>
<!-- Header Banner -->
</div>

hide div in aspx page and show div in aspx.vb page

I have following code in aspx page:
<div id="a" runat="server" style="display:block;">
abc
</div>
I am trying to show the div in code like this:
a.Visible = True
But this is not working. Can anyone suggest how to do this without using any scripting language?
A div with runat=server becomes a HtmlGenericControl on serverside. This has the Visible-property as every server-control. So you can hide it on serverside. But that means on clientside it won't get rendered at all.
If you instead want it to be rendered invisibly, add the Styledisplay:none:
a.Style.Add("display","none")
Then you can also switch the visibility on clientside.
Apart from that your tag is malformed, change
runat="server
to
runat="server"
You are missing doube quotes after runat Server. It should be like this..
<div id="a" runat="server" style="display:block;">
abc
</div>
Or in code Behind to hide the div
a.Style.Add("display","none")
in code Behind to show the div
a.Style.Add("display","block")
Try this:
a.Attributes.Add("style", "display:block;");
Mode details:
http://msdn.microsoft.com/en-us/library/7512d0d0(v=vs.71).aspx
http://msdn.microsoft.com/en-us/library/system.web.ui.control.visible.aspx
<div id="a" runat="server" style="visibility:hidden" >
</div>
you can try : hidden in code vb.net
a.Attributes("style") = "visibility:hidden"
you can try : visible
a.Attributes("style") = "visibility:visible"
thanx
a.Style.Add("display", "block")
for visible
a.Style.Add("display", "none")
for hide

Iframe javascript src setting opens in entire window

I have defined an IFrame in HTML.
From JavaScript I am trying to change the URL(src attribute) of the IFrame. It's working fine with most of the URLs. But when I try to set an eBay item URL more than once it opens in entire window.
Here is my code:
<html>
<head>
<script type="text/javascript">
function seturl(){
var txt=document.getElementsByName("txt");
document.getElementById('testframe').src = txt[0].value;
}
</script>
</head>
<body>
<iframe id="testframe" width= "700" height="500" >
</iframe>
<input type="text" name="txt" width="700"/>
<input type="button" value="Click me!" onclick="seturl()" />
</body>
</html>
Is there any solution to avoid opening in entire page for this eBay items URL?
http://cgi.ebay.com/Apple-iPad-Wi-Fi-32GB-BRAND-NEW-NO-RESERVE_W0QQitemZ220725228457QQcategoryZ171485QQcmdZViewItem
You are not allowed to do so.
It would seem that what you want to do is a violation of the UA.
http://pages.ebay.com/help/policies/user-agreement.html

asp net jquery popup dialog form in asp:formview

i have following problem, i am using a popup jquery dialog with asp:formview .
the purpose of this popup is for user to enter a hyperlink which is placed then in textbox control in formview
the popup dialog div is located outside a formview just after body tag
<body style="background-color: #FFFFFF; font-family:Lucida Console;">
<div id="dialog-form" title="sdfdfsdf" style="font-size:14px; ">
<form>
<fieldset>
<label for="link">sdfdf</label>
<input type="text" name="sdfsdf" id="link" size="32" />
</fieldset>
</form>
</div>
<form id="form1" runat="server" style="margin-top:50px;" >
<div>
<asp:FormView ID="FormView1"
.......
<InsertItemTemplate>
...
<sometextbox ...../>
<button id="create-user" class="ui-state-default ui-corner-all">Create link</button>
...
</InsertItemTemplate>
After clicking a button a popup window is shown BUT the page starts to refresh immediately
and of course the popup is then hidden.
If I relocate the button outside the formview - the page is not refreshed, but i need it in formview..
Any idea what to do?
add the following attribute to the button:
onclick="javascript: return false;"
this behavior should not come out because it is a button not submit button.
it seems when it is inside the form view a submit action is attached to it, check your jQuery scripts maybe you mistakenly added onclick submit while attaching the dialog.
I found my answer:
clientId must be used:
FTB_API['<%=FormView1.FindControl("AdminCommentTextBox").ClientID%>'].SetHtml(...)

Resources