File Upload control unable to browse - asp.net

i am using fileupload control on my master page enable asp.net form . When i try to browse it should pop up a dialog box to show files but it does not work . i tried to debug it on console using chrome when i hit browse button it shows me this error .
Uncaught ReferenceError: $ is not defined
here is my html code
<div id = "browse" margin-left:auto; margin-right:"100px";>
<asp:FileUpload id="FileUploadControl" runat="server" />
<asp:Button runat="server" id="UploadButton" text="Upload" />
<asp:Label runat="server" id="StatusLabel" text="Upload status: " />
</div>

I realized that my jQuery reference was too old in my solution. I did following steps and it worked:
downloaded latest jQuery library and removed previous one
Added new reference tag it worked perfectly:
<script type="text/javascript" src="/JS/jquery-2.1.1.min.js"></script>

Related

Create an ASP.net Web App that takes pdf files as input (upload) in Visual Basic

I need to add a button to my ASP.net web app that takes a pdf file and does some stuff to it.
I already have the "stuff" code working, I just need the working button that supplies it with a pdf file.
I have found various resources specifying how to do this, but they are all in C# and Windows Forms, which is not what I am using, I'm using an ASP.net web App with Visual Basic.
So far I have this HTML
<INPUT id="oFile" type="file" runat="server" NAME="oFile">Select the image file to upload to the server:
<asp:button id="btnUpload" type="submit" text="Upload" runat="server"></asp:button>
<asp:Panel ID="frmConfirmation" Visible="False" Runat="server">
<asp:Label id="lblUploadResult" Runat="server"></asp:Label>
</asp:Panel>
I know I need a Click event handler for the Upload button, but I can't figure out how to write it.

Why I need to include “ng-app” directive on each page of asp.net web page application

I work on VS2012 C# Asp.net web page application, want to apply angular on my application , At first I include angular files containing a file “angular.min.js” in my project and Include its reference in my master page
<script src=”Scripts/angular.min.js” type=”text/javascript”></script>
So far I know AngualrJS has several directives which perform different tasks. At first write “ng-app” directive in a div or master page body tag. It initializes an AngularJS application. It is the root element of the application allowing behavior to be modified through custom HTML tags.
I add on master page then on child page(default.aspx) add bellow syntax:
<div >
<asp:TextBox ID="TextBox1" runat="server" ng-model="name"></asp:TextBox>
<br />
<asp:Label ID="Label1" runat="server" Text="Label" ng-bind="name"></asp:Label>
</div>
The ng-bind directive not binds application data to the HTML view. I can not see the value of data on runtime.
when I use bellow syntax it’s work perfectly
<div ng-app="">
<asp:TextBox ID="TextBox1" runat="server" ng-model="name"></asp:TextBox>
<br />
<asp:Label ID="Label1" runat="server" Text="Label" ng-bind="name"></asp:Label>
</div>
Both syntax are same except the additional ,why I need to add ng-app="" on child page ,I already add this on master page body .
if have any query please ask.Thanks in advanced ,any type of suggestion will be acceptable

ASP File Upload control not working within a previously hidden panel

I'm utilizing an ASP file upload control on a web page, and I want it hidden until the user wants to upload a file, so the update panel's visible property is false by default. When the button prompting the file upload is clicked, the upload control shows, and a file can be selected, but when the upload button is clicked, an error shows that the PostedFile property of the upload control show "Object reference not set to an instance of an object", even though a file path is visible in the conrrol. This works if the upload control is never hidden. Here is the source:
<asp:UpdatePanel ID="updUploadTestDoc" runat="server" Visible="false">
<ContentTemplate>
<asp:Panel ID="pnlUploadTestDoc" runat="server" GroupingText="Upload Test
Document">
<asp:Label ID="Label3" runat="server" SkinID="FieldLabel" Text="Select File to Upload : " /> &nbsp
<asp:FileUpload ID="uplUploadFile" runat="server" />
<br />
<br />
<asp:Button ID="btnUpload" runat="server" text="Upload" SkinID="ConfirmButton" /> &nbsp
<asp:Button ID="btnCancelUpload" runat="server" Text="Cancel" SkinID="CancelButton" />
</asp:Panel>
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="btnUpload" />
</Triggers>
</asp:UpdatePanel>
I've tried hiding/showing updUploadTestDoc, pnlUploadTestDoc and the upload control itself, all with the same results. The VB code where the error occurs is:
strAttachmentPath = pUploadControl.PostedFile.FileName
I'm using VS 2010, framework 4.0. This is my first post here, so let me know if more info is needed. Thanks.
You can't retain/assign value in FileUpload control. This is because of due to browser security reasons. The file submission is possible only on the first submission to server. You can't retain or assign a value to it.
In an UpdatePanel the same thing happens. An Ajax post submission will happen asynchronously and thus the browser won't retain the file. Read this
And the solution is to keep the fileUpload outside the UpdatePanel.
you cant use asp:fileupload inside update panel, it's kinda of issue in asp file upload ,
so get it out of the update panel and it will work perfectly

asp.net how to access route data from an iframe

I have a basic asp.net page with an image upload loaded through an iframe:
<asp:Panel runat="server">
<asp:TextBox runat="server" id="imgCaption" CssClass="imgCaption" PlaceHolder="caption(optional)" />
<asp:FileUpload runat="server" ID="programmImages" Width="200px" CssClass="offScreen" />
<asp:Button runat="server" id="hiddenImageUpload" OnClick="UploadImage" CssClass="insButton" Text="Upload" />
</asp:Panel>
the image upload depends on the route data in order to upload but whenever i try to upload the image i get this error:
Object reference not set to an instance of an object
on this line:
var ProgName = Page.RouteData.Values["prog"].ToString();
this line works fine in other pages.
so how can i retrieve the route data through the iframe.
Thanks
i figured out the problem, the iframe is a seperate page than the page it resides in so i had to pass the data as querystrings and it worked fine.

AjaxControlToolkit CalendarExtender Control not working in my website

I' using the AjaxControlToolkit CalendarExtender in my web site but after uploading it does how show the calendar control. I have registered the control on the page itself. The page postback when I click the image on which I applied the control.
What can be the reason of this?
Check whether you added ToolkitscriptManager in your page, which is in AjaxToolkit
If you are using an ImageButton to show the calendar,
then use ajax control toolkit and put these controls
<asp:ToolkitScriptManager runat="server" />
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:ImageButton ID="ImageButton1" runat="server"
ImageUrl="calIcon.jpg" />
<asp:CalendarExtender ID="CalendarExtender1" TargetControlID="TextBox1"
PopupButtonID="ImageButton1" runat="server">
</asp:CalendarExtender>
If you are still getting the page postback when clicking the ImageButton, you can add onClientClick='return false;' to the imageButton
<asp:ImageButton ID="ImageButton1" runat="server"
ImageUrl="calIcon.jpg"
OnClientClick="return false;" />
Drag and place Script manager at top of the ajax control or at top of the form.
As you said that ajax calender works fine on local but when you uploaded it it started creating problems following are the workarounds give them a try.
Check that whether you uploaded the ajax toolkit dll on the server or not.
secondly make sure that you uploaded updated web.config file.
let me know if its helpful otherwise i will try finding other workarounds

Resources