I have a Telerik Grid. In that I have the following code in an .aspx page. What I want to happen is that when the user click on the imagebutton control it launches a new window to show that image. Note, I have seen some code which use Postback but they are blocked by popup blockers. The control's image is set via codebehind but that should not matter for this question. Here is my code. Thanks!
<asp:ImageButton ID="prod_image_main" runat="server" AlternateText="Product Main Image"
Height="500PX" Width="540PX" />
Instead of using an asp:ImageButton control why not just use a link? That way you can simply set the target attribute of the link to _blank and have it open in a new window.
Something like this:
<img src="wherevertheimageis.jpg" />
Try to open a new window with a javascript function:
function OpenW() {
window.open('NewForm.aspx', '', "height=200,width=200");
}
And in your imageButton set the onclientclick:
<asp:ImageButton ID="prod_image_main" runat="server" AlternateText="Product Main Image"
Height="500PX" Width="540PX" onclientclick="OpenW()" />
And load the image at the onload of NewForm.
Based on Mike Evan's answer here is what works for me.
ASPX FILE:
<asp:HyperLink runat="server" ID="hpl_mainimg" Target="_blank">
<asp:Image ID="prod_image_main" runat="server" AlternateText="Product Main Image"
Height="500PX" Width="540PX" /> </asp:HyperLink>
Code Behind C#
prod_image_main.ImageUrl = File.Exists(Server.MapPath("images_products/" + rdr["image_1"].ToString())) ? "images_products/" + rdr["image_1"].ToString() : "images_missing/NotAvailable_RS.jpg";
prod_image_main.ToolTip = rdr["itemtitle"].ToString();
hpl_mainimg.NavigateUrl = prod_image_main.ImageUrl.ToString();
Related
I made it work but I want to know why it is happening)
So I have my rad window:
<telerik:RadWindowManager ID="wndManager" runat="server">
<Windows>
<telerik:RadWindow ID="rwShippingAddressEdit" runat="server" Modal="True" VisibleStatusbar="False" VisibleOnPageLoad="false" ShowContentDuringLoad="false">
<ContentTemplate>
//content
</ContentTemplate>
</telerik:RadWindow>
</Windows>
</telerik:RadWindowManager>
And I have my button to open it:
<telerik:RadButton ID="" Width="90" CssClass="button-next" runat="server"
ID="btnOpen" OnClientClicking="windowOpen" Text="Open" />
function windowOpen(sender, args) {
var oManager = GetRadWindowManager();
oManager.open(null, "rwShippingAddressEdit");
args.set_cancel(true);
}
This code shows regular default blank window but on another page the same code works perfectly fine and opens window with my content.
In order to make it work I added this code to page_load event
rwShippingAddressEdit.OpenerElementID = btnOpen.ClientID;
And now when I press btnOpen it opens two windows (blank one and window with content).
Both pages inherit same master page, I do not work with rad window in code behind. But somehow same code works different on pages pages. What can the problem be?
It's not about validators. I tried CausesValidation="False" for btnOpen.
So, if you have any ideas I would be glad to hear)
Try this alternative and see if you have a better results:
var oWnd = $find("<%=rwShippingAddressEdit.ClientID%>");
oWnd.show();
Don't set the OpenerElementID with this approach to verify it does work.
I would guess you have several managers on the page and radopen() is not using the one you expect, read more here: http://www.telerik.com/help/aspnet-ajax/window-troubleshooting-wrong-window-opened.html
is it possible to set the src of a image with a button click.
Each of my buttons represents a picture that should be displaying in my "image" area. I need the image Area's SRC property to be affected by the button click.
Im using visual studio 2012 with c#.
-Edit : Using AJAX Update panel in visual studio 2012 with C#
If a postback is acceptable to you for every image change, you may do something like :
In C#:
protected void btnClick(object sender, EventArgs e) {
Button btn = (Button) sender;
switch (btn.ID) {
case "btn1": img.ImageUrl = "<Image_Url>"; break;
case "btn2": img.ImageUrl = "<Image_Url>"; break;
}
}
In ASPX Page:
<asp:Image ID="img" runat="server" />
<asp:Button ID="btn1" runat="server" OnClick="btnClick" />
<asp:Button ID="btn2" runat="server" OnClick="btnClick" />
Yes. You will be able to accomplish this by using JavaScript and attaching a click handler to the button (onclick="loadImage1()").
loadImage1 function would require you to write the javascript necessary to access the src attribute of the image element and alter it.
You can achieve this with plain javascript (see above concept), or with some javascript library such as jQuery. For cross browser compatibility and to save you from having to write your cross browser safe logic, I would suggest jQuery to handle this.
<img id="img1" src="initialimagehere.jpg"/>
And then you can change the src attribute like this:
$("#img1").attr("src","newimagehere.jpg");
jQuery: this link
I noticed if I had not first specified a value for ImageUrl in my .aspx code, I could not then set it in the .aspx.cs code.
Ie, if I had my .aspx code as:
<asp:Image runat="server" id="imgPickLg0101" class="ImgSzLarge" />
I could not set it in the code behind.
However, if I first specified a value for ImageUrl:
<asp:Image runat="server" id="imgPickLg0101" class="ImgSzLarge" ImageUrl="../Images/somepic.jpg" />
Then I could set it in the .aspx.cs code:
imgPickLg0101.ImageUrl = "../Images/DifferentPicture.jpg";
Inside aspx:
<img id="imagenCabecera" runat="server" />
And inside aspx.vb:
imagenCabecera.Attributes("src") = "url-image.jpg"
My case is I have an asp.net page has a form
<form id="form1" runat="server" target="_blank">
and a button redirect to another page and this page will open in a new window because of the target attribute of the form .
<asp:Button ID="button1" runat="server" PostBackUrl="~/kindofpage.aspx" Text="Generate" />
and I have a dropdownlist has auto postback = true to post the past to fill another dropdownlist by selected data .
<asp:dropdownliast id="Make" name="Make" runat="server" autopostback="true"></asp:dropdownlist>
the question is : why when I select item from the auto postbacked dropdown an blank page opened ?
I need a way to post the page by the dropdownlist without openning a blank page ..
Thank you,
For lack of a better idea, you could just remove the target="_blank" attribute from your markup, and when your button is clicked, modify the form tag with JavaScript and set the attribute.
You can set the OnClientClick property and run JavaScript when it's clicked. For example:
<asp:Button ID="button1" OnClientClick="document.getElementById('form1').setAttribute('target', '_blank')" runat="server" PostBackUrl="~/kindofpage.aspx" Text="Generate" />
You could always just adjust your buttonpress code to open a new window such as this:
<asp:Button ID="myBtn" runat="server" Text="Click me"
onclick="myBtn_Click" OnClientClick="window.open('kindofpage.aspx', 'kindofpage');" />
then remove the:
target="_blank"
From the form tag.
I struggled with a similar situation but solved it in the following way.
As mentioned in this answer, you can use the OnClientClick property to set the target to "_blank". E.g.
<asp:Button ID="button1" OnClick="codebehind_method" OnClientClick="document.forms[0].target = '_blank';" runat="server" Text="targets new window" />
Then, in the aspx page that my "codebehind_method" function redirects to, I reset the target of the opener form like so:
<script type="text/javascript">
function resetTarget() {
opener.document.forms[0].target = '';
}
</script>
<body onload="resetTarget()">
Now, if you go back to your opener form and use a control that does not have the "OnClientClick" property set, the AutoPostBack should occur in the same tab.
If you want to find your form by ID, replace "document.forms[0]" with:
document.getElementByID('yourFormName')
<form id="form1" runat="server">
I have a Image button on the aspx page that is server side button.
Now I want to get image url for this from my code class. but this is not working.
<asp:ImageButton ID="total" runat="server" ImageUrl='<%=myappnamespace.Utility.GetImageURL("chckout_p.png")%>'>
Function GetImageURl is public in Utility calls and return the full image path.
If I used this for the following then its working fine
<img src='<%=myappnamespace.Utility.GetImageURL("chckout_p.png")%>'>
So what is wrong with the server side controls.
You can't use <%= codeBehindData.Here %> on server controls. You can use
<asp:ImageButton ID="total" runat="server" ImageUrl='<%# myappnamespace.Utility.GetImageURL("chckout_p.png") %>'>
Notice the <%#
Then call Page.DataBind() or total.DataBind() on Page_Load
I have a link button:
<asp:LinkButton ID="LinkButtonPrint" runat="server" OnClick="OnPrint_Click">
<img src="img/print-icon.png" alt="" />
<asp:Literal runat="server" Text="<%$ Resources:PrintPage %>" />
</asp:LinkButton>
In code behind I add an onclick handler in Page_Load like this:
LinkButtonPrint.Attributes["onclick"] = "StartLoadTracking(this, '" + GetLocalResourceObject("Loading") + "')";
The rendered HTML is like this:
<a href="javascript:__doPostBack('ctl00$LinkButtonPrint','')"
id="ctl00_LinkButtonPrint" onclick="StartLoadTracking(this, 'Loading...');">
<img alt="" src="img/print-icon.png">Print page
</a>
If I click this button it is working OK (it will respond with a PFD file so no HTML is sent back to the browser), but if I click another button on the page (which makes a full postback) the LinkButtonPrint will not have the inner content, it will be rendered like this:
<a href="javascript:__doPostBack('ctl00$LinkButtonPrint','')"
id="ctl00_LinkButtonPrint" onclick="StartLoadTracking(this, 'Loading...');"></a>
If I remove the LinkButtonPrint.Attributes["onclick"] = ... line from Page_Load everything works fine (except my js function is not called, but that is normal).
What am I missing here?
EDIT
This is duplicate of
asp.net Link button image not visible after postback
but that one is not solved either :(
This problem is now known to Microsoft, and they have published an official statement and workaround on the Microsoft Connect issue 718810: LinkButton controls collection lost on postback.
Microsoft statement is:
Thank you for the feedback. This seems like an oddity with the fact that the LinkButton control allows either direct text content via the Text property or in markup, or sub-controls via the Controls collection or markup. The workaround is to use a placeholder as the root content for the control and place the desired mixed content in there, e.g.
<asp:LinkButton runat="server">
<asp:PlaceHolder runat="server">
This is some text.</br>
<asp:Label runat="server">This is a control</asp:Label>
</asp:PlaceHolder>
</asp:LinkButton>
I found the solution:
I had to add runat="server" to the <img> tag inside the <asp:LinkButton>:
<img src="img/print-icon.png" alt="" runat="server" />
Just a note to add to the solution above.
I found this specifically occuring when I had enabled=false (to show disabled style) my linkbutton and then caused a postback from the page via another control.
The .Text component of the linkbutton got wiped out after postback.
BUT by putting runat="server" on my .Text / html tags (em, span), they now are retained after postback.
the problem is that the Attributes["onclick"] = override the handler of the onclick operation.
2 thing you could try :
LinkButtonPrint.Attributes.Add("onclick", "StartLoadTracking(this, '" + GetLocalResourceObject("Loading") + "');");
or
LinkButtonPrint.Attributes["onclick"] = "StartLoadTracking(this, '" + GetLocalResourceObject("Loading") + "');" + LinkButtonPrint.Attributes["onclick"];