How to hyperlink an image in asp.net (C# / vb.net)? - c#

I have a webpage in which I am trying to hyperlink an image. The screenshot of that section of the webpage is as follows:
On clicking the pdf image, it should open a pdf.
At this moment, I am able to create a pdf image which is local to my machine.
The code in .aspx file are:
<div class="row" id="divViewAssessment" runat="server">
<div class="itemtitle">
<asp:Label ID="litBlankAssessment" runat="server"></asp:Label>
</div>
<div class="itemdata">
<asp:ImageButton ID="btnViewAssessment" runat="server" ImageUrl="~/Images/doc_pdf.gif"
CausesValidation="False" ValidationGroup="vgrp1" Enabled="true"></asp:ImageButton>
</div>
</div>
I am wondering what code do I need to put in .aspx.vb file ? I am sure what I need to put in .aspx but not sure what need to put in .aspx.vb (behind the code).
The path of the pdf local to my machine is "~/Licensee/" + CStr(Session("LicenseeCode")) + "/ViewSA/Lebanon Primary Care Standards for SW.pdf" The LicenseeCode is MPHLB.

The ImageButton control is intended for triggering a postback, not navigating to a URL.
Use a HyperLink control instead. It has an ImageUrl property to set the image that is displayed, and also a NavigateUrl property to set your target URL.

You can use the following code..
Protected Sub btnViewAssessment_Click(sender As Object, e As ImageClickEventArgs) Handles btnViewAssessment.Click
Response.Redirect("Lebanon Primary Care Standards for SW.pdf")
End Sub
Put your pdf in solution folder.

Related

In ASP.NET, how can I get an image from the code behind and display it in a <div> section?

Boss just gave me a webpage to work with, and I've never done webpages before. When I got it there was an image I need to replace
<div>
<!--<img style="padding-top:5px;" class="featured" src="path/name.jpg" />-->
html text
I had to go in to the .cs file of the .aspx file and a path to the image
Image image = new Image();
image.ImageUrl = path;
and then back where the old image was
<div>
<asp:Image style="padding-top:5px;" class="featured" runat="server" ID="image" />
html text
But I'm not sure how to get the new image to display correctly where the old one was, since I've never worked with asp files before. Any suggestions on what to do?
In the asp code, be certain to give the image element an ID:
<asp:image id="setincode" width="250" runat="server" />
In the code-behind, retrieve the control by the ID, then you can set the url:
Image img = (Image)FindControl("setincode");
img.ImageUrl = "Images/Butterfly.jpg";
As mentioned in my comment you can access the control directy by using it's Id in the C# code or you can provide the ImageUrl in your aspx page.
Providing the ImageUrl in your aspx
<asp:Image runat="server" ID="image" ImageUrl="../Path/SomeImage.png" />
Or if you want to use C#
image.ImageUrl = "../Path/SomeImage.png";
Similar but slightly different:
Mark-up
<img id="Image1" alt="image" runat="server" />
In code behind (VB or C#):
Image1.src = "Images/Butterfly.jpg"

CKeditor on Textarea implementation

I have implemented a CKeditor from the below link:-
CKEditor But the issue is that, As soon as I register the editor on my page, it gets reflected. I want the same editor just only for my asp.net textbox. What should I do and make change so that It can only be visible to my textbox only. Please help.
See my textbox
<asp:TextBox ID="txtPostdesc" CssClass="form-control" runat="server" ValidationGroup="AddNew" TextMode="MultiLine"></asp:TextBox>
As per the article CKEditor in ASP.Net it described the way of implementing CKEditor with dll.
You would require following things
1. Two dll : CkEditor.dll and CKEditor.NET.dll.
2. CKEditor folder containing all js, css and images.
Register the CKEditor control at the top of your .aspx page such as
<%# Register Assembly="CKEditor.NET" Namespace="CKEditor.NET" TagPrefix="CKEditor" %>
Now you will be able to write the CKEditor server control markup such as below
<CKEditor:CKEditorControl ID="txtPostdesc" BasePath="/ckeditor/" runat="server">
</CKEditor:CKEditorControl>
In above I just change the ID as per your textarea ID. Now you can set and get its content via .Text Property in your code behind file i.e.
string str = txtPostdesc.Text;
Hope above explanation works for you.

File downloading on postback

I have an anchor tag, an AsyncFileUpload control, and a span. The anchor tag's InnerText is set when a file exists in the database, if not, it is hidden. It also has a ServerClick event which downloads the file.
The span tag's InnerText displays the filename of the file uploaded using the AsyncFileUpload OnUploadedComplete.
When I click on the anchor, the file downloads (which is good.) But when I change the file (using the AsyncFileUpload) it posts back and the ServerClick method of the anchor tag is fired again therefore downloading the file again.
<a id="lnkDownloadFile" runat="server"></a>
<span id="spnFilename" runat="server"></span>
<input type="button" id="btnReplaceFile" value="Replace File" runat="server" />
<div>
<ajaxToolkit:AsyncFileUpload ID="fuFile" runat="server" OnUploadedComplete="UploadComplete" OnClientUploadError="UploadError" />
</div>
Is there any way around this?
Thank you.
I am not sure why this is happening but one of the work-around could be to use hidden field to confirm if post-back has happened due to click on download link. For example,
<input type="hidden" id="downloadFile" runat="server" />
<asp:LinkButton id="lnkDownloadFile" runat="server" OnClientClick="return setDownloadFile();" />
<script type="text/java-script" >
function setDownloadFile() {
document.getElementById('<%= downloadFile.ClientID>').value = 'true';
return true;
}
</script>
You can check downloadFile value in the link button click to decide whether to download file or not. Note that I have used LinkButton because I am sure about its client click attribute - you can try use click attribute with html anchor (what I am not 100% sure if it would interfare with ServerClick event handler).

Issue with asp Image and file upload controls in Mozilla Firefox

I have an Image control which is used to display image on click of a button. The code is as below:
.aspx code
<asp:Image ID="imgCorrect" runat="server" Height="175px" Width="150px" ImageUrl="~/_layouts/images/NoPreviewShareHR_Grey.jpg" />
<asp:FileUpload ID="FlUpldImage" runat="server" Width="200px" />
<asp:RegularExpressionValidator runat="server" ID="valUp" ControlToValidate="FlUpldImage"
ErrorMessage="Image Files Only (.jpg, .bmp, .png, .gif)" ValidationGroup="ImageFormat"
ValidationExpression="^(([a-zA-Z]:)|(\\{2}\w+)\$?)(\\(\w[\w].*))(.jpg|.JPG|.gif|.GIF|.jpeg|.JPEG|.bmp|.BMP|.png|.PNG)$" />
<asp:Button ID="btnImageUpload" runat="server" Text="Preview" OnClick="btnImageUpload_Click" CausesValidation="false"/>
<asp:HiddenField ID="HidnLocalImageURL" runat="server" Value=""/>
C# Code
protected void btnImageUpload_Click(object sender, EventArgs e)
{
String fileToUpload = Convert.ToString(FlUpldImage.PostedFile.FileName);
HidnLocalImageURL.Value = fileToUpload;
if (fileToUpload != "")
imgCorrect.ImageUrl = fileToUpload;
else
imgCorrect.ImageUrl = "~/_layouts/images/NoPrview.jpg";
}
The above code works fine on IE but gives issue in Mozilla Firefox:
The RE validator for file upload shows error message as invalid image even if proper
image is selected and
onclick of btnImageUpload the image control disappears. This
issue occurs on Firefox browser only and works fine in IE.
fileToUpload in C# code contains the prope path to the image including drive letter. I don't want to physically store the files into application folder as this is just to preview the image.
Kindly help me to sort out both issues.
Try to log FlUpldImage.PostedFile.FileName.
I think firefox sends only filename not full path.
If so, its better to use simple textbox and paste path in it without dialogbox.
As a security precaution, references to images on your local computer from a remote web site are disabled. If you encounter this restriction and you understand the security implications, you can disable this security measure.
for more info
http://kb.mozillazine.org/Images_or_animations_don%27t_load

click event of a button to fire fileupload control in asp.net

I have a file upload Control and I have made this invisible.
I want to enable a browse Button for that file upload control when I click another Button.
How can I do it?
First make a file up loader like this one
To upload a file you need to do 2 things
1) Select the file. (click browse button)
2) Send it to server. (click the upload button)
So first lets write a java-script to do these.`
<script type="text/javascript" >
function uploadImage() {
$('#MainContent_UploadButton').click()
}
function selectFile() {
$('#MainContent_FileUploadControl').click();
}
</script>
Now make the file upload controller upload itself as soon as a file is selected
<asp:FileUpload id="MainContent_FileUploadControl" runat="server"
onChange="uploadImage()" class="hidden"/>
Then make a new button and let it select the file as soon as it is clicked.
<asp:Button ID="MainContent_UploadButton" runat="server" Text="Upload File"
OnClientClick="selectFile(); return false;" />
The most important point is put "return false" in the onClientClick field. It will block the buttons post back and let you choose a file without refreshing the page.
Now hide the unwanted components using css and you are done !!
I think this is not possible. This would likely be a security issue if a script could upload (or at least trigger the upload process) invisible from any user interaction.
Update:
Seems that someone actually developed a solution to hide the upload control. From what I read it seems to take some effort to develop and uses JavaScript.
Personally, I wouldn't dare to guarantee that this works on all platforms (just imagine someone with a BlackBerry or Windows Phone visits your website...) and thus avoid it.
<asp:FileUpload ID="FileUpload1" runat="server" style="display:none;"/>
<input id="btnFileUpload" type="button" value="Add" runat="server" />
btnFileUpload.Attributes.Add("onclick", "document.getElementById('" + FileUpload1.ClientID + "').click();");

Categories