Sir Good Morning
I am facing a problem. if i select file using fileupload and select vendor after file upload. file upload controll does not maintain the file name and says "no file choosen" if i select vendor first and then select file upload there is no problem
pleas advise how can i maintain same file name if vendor is relselect.
my code is as below
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Atest_Aspsnippets.aspx.cs" Inherits="Atest_Aspsnippets" %>
<%@ Register Assembly="Microsoft.ReportViewer.WebForms, Version=11.0.0.0, Culture=neutral, PublicKeyToken=89845dcd8080cc91" Namespace="Microsoft.Reporting.WebForms" TagPrefix="rsweb" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<%-- =================================== New ============================================= --%>
<link href="../Styles/DefineCss1.css" rel="stylesheet" />
<link href="../Style/GridViewStyleNew.css" rel="stylesheet" />
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<script src="../js/jquery-1.7.2.min.js"></script>
<link type="text/css" href="../css/ui-lightness/jquery-ui-1.8.19.custom.css" rel="stylesheet" />
<script type="text/javascript" src="../js/jquery-ui-1.8.19.custom.min.js"></script>
<script src="../GridViewScrollBothSide/jquery-1.9.1.min.js"></script>
<script src="../GridViewScrollBothSide/JavaScript.js"></script>
<script src="../GridViewScrollBothSide/GridViewScrollBothSide.js"></script>
<%-- Start GridView Scroll --%>
<script type="text/javascript">
$(document).ready(function () {
$('.MyDataGridViewListOne').gridviewScroll({
width: 1090,
freezesize: 6, // Freeze Number of Columns.
height: 250,
headerrowcount: 1, //Freeze Number of Rows with Header.
arrowsize: 30,
varrowtopimg: "../GridViewScrollBothSide/ImageScroll/arrowvt.png",
varrowbottomimg: "../GridViewScrollBothSide/ImageScroll/arrowvb.png",
harrowleftimg: "../GridViewScrollBothSide/ImageScroll/arrowhl.png",
harrowrightimg: "../GridViewScrollBothSide/ImageScroll/arrowhr.png"
});
});
</script>
<script type="text/javascript">
$(document).ready(function () {
$('.MyDataGridViewListTwo').gridviewScroll({
width: 1090,
freezesize: 2, // Freeze Number of Columns.
height: 250,
headerrowcount: 1, //Freeze Number of Rows with Header.
arrowsize: 30,
varrowtopimg: "../GridViewScrollBothSide/ImageScroll/arrowvt.png",
varrowbottomimg: "../GridViewScrollBothSide/ImageScroll/arrowvb.png",
harrowleftimg: "../GridViewScrollBothSide/ImageScroll/arrowhl.png",
harrowrightimg: "../GridViewScrollBothSide/ImageScroll/arrowhr.png"
});
});
</script>
<script type="text/javascript">
$(document).ready(function () {
$('.MyDataGridViewListThree').gridviewScroll({
width: 1090,
freezesize: 6, // Freeze Number of Columns.
height: 250,
headerrowcount: 1, //Freeze Number of Rows with Header.
arrowsize: 30,
varrowtopimg: "../GridViewScrollBothSide/ImageScroll/arrowvt.png",
varrowbottomimg: "../GridViewScrollBothSide/ImageScroll/arrowvb.png",
harrowleftimg: "../GridViewScrollBothSide/ImageScroll/arrowhl.png",
harrowrightimg: "../GridViewScrollBothSide/ImageScroll/arrowhr.png"
});
});
</script>
<script type="text/javascript">
$(document).ready(function () {
$('.MyDataGridViewListFour').gridviewScroll({
width: 1090,
freezesize: 6, // Freeze Number of Columns.
height: 250,
headerrowcount: 1, //Freeze Number of Rows with Header.
arrowsize: 30,
varrowtopimg: "../GridViewScrollBothSide/ImageScroll/arrowvt.png",
varrowbottomimg: "../GridViewScrollBothSide/ImageScroll/arrowvb.png",
harrowleftimg: "../GridViewScrollBothSide/ImageScroll/arrowhl.png",
harrowrightimg: "../GridViewScrollBothSide/ImageScroll/arrowhr.png"
});
});
</script>
<%-- End GridView Scroll --%>
<%-- Start Date Picker --%>
<script type="text/javascript">
$(function () {
var date = new Date();
debugger;
$("[id*=TxtLeaveDueDate]").datepicker({
showOn: 'button',
autoclose: true,
buttonImageOnly: true,
buttonImage: '../Calendar/calender.png',
dateFormat: 'mm/dd/yy',
changeMonth: true,
changeYear: true,
readOnly: true,
minDate: "-15W",
maxDate: "+15W"
//minDate: new Date()
//yearRange: "-0:+0"
//buttonImage: 'images/calendar.png',
//yearRange: "-1:+0" // last one years
//yearRange: "-1:10" // last one years and next Ten Year
//yearRange: new Date().getFullYear().toString() + ':' + new Date().getFullYear().toString() // Only Current Year
//yearRange:'2021:' + new Date().getFullYear().toString()
});
});
</script>
<script type="text/javascript">
$(function () {
var date = new Date();
debugger;
$("[id*=TxtTravelDate]").datepicker({
showOn: 'button',
autoclose: true,
buttonImageOnly: true,
buttonImage: '../Calendar/calender.png',
dateFormat: 'mm/dd/yy',
changeMonth: true,
changeYear: true,
readOnly: true,
minDate: "-15W"
//minDate: new Date()
//yearRange: "-0:+0"
//buttonImage: 'images/calendar.png',
//yearRange: "-1:+0" // last one years
//yearRange: "-1:10" // last one years and next Ten Year
//yearRange: new Date().getFullYear().toString() + ':' + new Date().getFullYear().toString() // Only Current Year
//yearRange:'2021:' + new Date().getFullYear().toString()
});
});
</script>
<script type="text/javascript">
$(function () {
var date = new Date();
debugger;
$("[id*=TxtReturnDate]").datepicker({
showOn: 'button',
autoclose: true,
buttonImageOnly: true,
buttonImage: '../Calendar/calender.png',
dateFormat: 'mm/dd/yy',
changeMonth: true,
changeYear: true,
readOnly: true,
//minDate: new Date()
//yearRange: "-0:+0"
//buttonImage: 'images/calendar.png',
//yearRange: "-1:+0" // last one years
//yearRange: "-1:10" // last one years and next Ten Year
//yearRange: new Date().getFullYear().toString() + ':' + new Date().getFullYear().toString() // Only Current Year
//yearRange:'2021:' + new Date().getFullYear().toString()
});
});
</script>
<script type="text/javascript">
$(function () {
var date = new Date();
debugger;
$("[id*=TxtInvoiceDate]").datepicker({
showOn: 'button',
autoclose: true,
buttonImageOnly: true,
buttonImage: '../Calendar/calender.png',
dateFormat: 'mm/dd/yy',
changeMonth: true,
changeYear: true,
readOnly: true,
yearRange: "-1:+0" // last one years
//minDate: new Date()
//yearRange: "-0:+0"
//buttonImage: 'images/calendar.png',
//yearRange: "-1:+0" // last one years
//yearRange: "-1:10" // last one years and next Ten Year
//yearRange: new Date().getFullYear().toString() + ':' + new Date().getFullYear().toString() // Only Current Year
//yearRange:'2021:' + new Date().getFullYear().toString()
});
});
</script>
<%--<script type="text/javascript">
$(function () {
var date = new Date();
debugger;
$("[id*=TxtTravelDateTo]").datepicker({
showOn: 'button',
buttonImageOnly: true,
buttonImage: '../images/calendar.png',
dateFormat: 'mm/dd/yy',
changeMonth: true,
changeYear: true,
readOnly: true,
minDate: new Date(),
maxDate: "+16W"
//yearRange: "-1:+1"
//buttonImage: 'images/calendar.png',
//yearRange: "-1:+0" // last one years
//yearRange: "-1:10" // last one years and next Ten Year
//yearRange: new Date().getFullYear().toString() + ':' + new Date().getFullYear().toString() // Only Current Year
//yearRange:'2021:' + new Date().getFullYear().toString()
});
});
</script>--%>
<%-- <script type="text/javascript">
$(function () {
debugger;
$("[id*=TxtVoucherDate]").datepicker({
showOn: 'button',
buttonImageOnly: true,
buttonImage: '../images/calendar.png',
dateFormat: 'mm/dd/yy',
changeMonth: true,
changeYear: true,
readOnly: true,
yearRange: "-1:+0"
//buttonImage: 'images/calendar.png',
//yearRange: "-1:+0" // last one years
//yearRange: "-1:10" // last one years and next Ten Year
//yearRange: new Date().getFullYear().toString() + ':' + new Date().getFullYear().toString() // Only Current Year
//yearRange:'2021:' + new Date().getFullYear().toString()
});
});
</script>--%>
<%-- <script type="text/javascript">
$(function () {
debugger;
$("[id*=TxtInvoiceDate]").datepicker({
showOn: 'button',
buttonImageOnly: true,
buttonImage: '../images/calendar.png',
dateFormat: 'mm/dd/yy',
changeMonth: true,
changeYear: true,
readOnly: true,
minDate: "-10W"
//yearRange: "-1:+0"
//buttonImage: 'images/calendar.png',
//yearRange: "-1:+0" // last one years
//yearRange: "-1:10" // last one years and next Ten Year
//yearRange: new Date().getFullYear().toString() + ':' + new Date().getFullYear().toString() // Only Current Year
//yearRange:'2021:' + new Date().getFullYear().toString()
});
});
</script>--%>
<%-- End Date Picker --%>
<%-- Start Confirm (Yes/No) --%>
<script type="text/javascript">
function ConfirmOne(sender) {
//var selectedText = $(sender).find("option:selected").text();
if (confirm("Do you want to process ?")) {
$("#HfResponseOne").val('Yes');
}
else {
$("#HfResponseOne").val('No');
}
}
function ConfirmTwo(sender) {
if (confirm("Do you want to process ?")) {
$("#HfResponseTwo").val('Yes');
}
else {
$("#HfResponseTwo").val('No');
}
}
function ConfirmThree(sender) {
if (confirm("Do you want to process ?")) {
$("#HfResponseThree").val('Yes');
}
else {
$("#HfResponseThree").val('No');
}
}
function ConfirmThree(sender) {
if (confirm("Do you want to process ?")) {
$("#HfResponseFour").val('Yes');
}
else {
$("#HfResponseFour").val('No');
}
}
</script>
<%-- End Confirm (Yes/No) --%>
<%-- Start Preview Pdf Image Working --%>
<script type="text/javascript">
function PreviewPDF() {
pdffile = document.getElementById("uploadPDF").files[0];
pdffile_url = URL.createObjectURL(pdffile);
$('#viewer').attr('src', pdffile_url);
}
</script>
<%-- End Preview Pdf Image Working --%>
<%-- start input file validation --%>
<script>
function fileValidation() {
var fileInput =
document.getElementById('uploadPDF');
var filePath = fileInput.value;
// Allowing file type
var allowedExtensions =
/(\.PDF|\.pdf)$/i;
///(\.jpg|\.jpeg|\.png|\.gif)$/i;
if (!allowedExtensions.exec(filePath)) {
alert('Invalid file type');
fileInput.value = '';
return false;
}
else {
//// Image preview
//if (fileInput.files && fileInput.files[0]) {
// var reader = new FileReader();
// reader.onload = function (e) {
// document.getElementById(
// 'imagePreview').innerHTML =
// '<img src="' + e.target.result
// + '"/>';
// };
// reader.readAsDataURL(fileInput.files[0]);
}
}
</script>
<%-- End Input file validation --%>
<%-- Start Separate Loader Start --%>
<script type="text/javascript">
function showLoader1() {
document.getElementById("loader1").style.display = 'block';
}
function showLoader2() {
document.getElementById("loader2").style.display = 'block';
}
function showLoader3() {
document.getElementById("loader3").style.display = 'block';
}
function showLoader4() {
document.getElementById("loader4").style.display = 'block';
}
</script>
<%-- End Loader End --%>
<%-- Start Disable Right Click --%>
<script>
document.addEventListener("contextmenu", function (event) {
event.preventDefault();
alert('Right Click is Disabled');
}, false);
</script>
<%-- End Disable Right Click --%>
<%-- Start Disable back button in browser --%>
<script type="text/javascript">
function DisableBackButton() {
window.history.forward()
}
DisableBackButton();
window.onload = DisableBackButton;
window.onpageshow = function (evt) { if (evt.persisted) DisableBackButton() }
window.onunload = function () { void (0) }
</script>
<%-- End Disable back button in browser --%>
<%-- Start Style --%>
<style type="text/css">
table { border: 1px solid #ccc; border-collapse: collapse; }
table th { background-color: #ccc; color: #333; font-weight: bold; }
table th, table td { padding: 5px; border: 1px solid #ccc; }
.MyDataGridViewListOne { align-items: baseline; margin-left: auto; margin-right: auto; }
.MyDataGridViewListOne td { padding: 5px; }
.MyDataGridViewListOne th { padding: 5px; font-family: Arial; font-size: 12px; background-color: #fb8b03; }
.MyDataGridViewListTwo { align-items: baseline; margin-left: auto; margin-right: auto; }
.MyDataGridViewListTwo td { padding: 5px; }
.MyDataGridViewListTwo th { padding: 5px; font-family: Arial; font-size: 12px; background-color: #f4f909; }
.ComboBoxStyle .ajax__combobox_itemlist li { background-color: DarkGreen; border: 1px solid YellowGreen; color: White; font-size: medium; font-family: Arial; font-size: 12px; padding-bottom: 5px; }
.bg_Entry_Color1 { background-color: #f0f5f5; }
.bg_Entry_Color2 { background-color: #e9e4f0; }
.bg_Entry_Color3 { background-color: #e3f5ec; }
.bg_Entry_Color4 { background-color: #E6E6FA; }
.bg_Entry_Color5 { background-color: #fbf8da; }
.bg_Entry_Color6 { background-color: #FFF0F5; }
.bg_Entry_Color7 { background-color: #F5F5F5; }
</style>
<%-- End Style --%>
<%-- =================================== New ============================================= --%>
</head>
<body>
<form id="form1" runat="server">
<%-- Start Vendor Information --%>
<div class="container mb-0">
<div class="row g-0 pt-0 bg_Entry_Color4 ">
<div class="col col-12 bg-primary text-white text-center fs-5 ">
<asp:Label ID="Label42" runat="server" Text="Vendor Information"></asp:Label>
</div>
</div>
<div class="row g-0 bg_Entry_Color4">
<table class="table mb-0 mt-0" style="width: 100%" border="1">
<tr class=" table pb-0">
<td class="col col-3">
<asp:Label ID="Label41" runat="server" Text="Select Vendor"></asp:Label>
</td>
<td class="col col-9">
<asp:DropDownList ID="DdlVendorName" Width="75%" Height="35px"
AutoPostBack="true" CssClass="mydropdownlist" runat="server"
OnSelectedIndexChanged="DdlVendorName_SelectedIndexChanged">
</asp:DropDownList>
</td>
</tr>
<tr>
<td class="col col-3">
<asp:Label ID="Label43" runat="server" Text="Vendor Name"></asp:Label>
</td>
<td class="col col-9">
<asp:TextBox ID="TxtVendorName" Text="" Width="75%"
runat="server" ReadOnly="true"></asp:TextBox>
</td>
</tr>
<tr>
<td class="col col-3">
<asp:Label ID="Label44" runat="server" Text="Vendor Tin No"></asp:Label>
</td>
<td class="col col-9">
<asp:TextBox ID="TxtVendorTinNo" Width="75%" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator16" runat="server"
ErrorMessage="Value Required" ControlToValidate="TxtVendorTinNo"
SetFocusOnError="true" ValidationGroup="FinalSave"
ForeColor="Red" Display="Dynamic"></asp:RequiredFieldValidator>
</td>
</tr>
<tr class=" table pb-0">
<td class="col col-3">
<asp:Label ID="Label69" runat="server" Text="Invoice Date "></asp:Label>
<asp:Label ID="Label70" runat="server" Text=" (MM/DD/YYYY) " ForeColor="Red"></asp:Label>
</td>
<td class="col col-9">
<asp:TextBox ID="TxtInvoiceDate" runat="server" AutoCompleteType="Disabled"
ForeColor="Red" Width="75%"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator21" runat="server"
ErrorMessage="Value Required" ControlToValidate="TxtInvoiceDate"
ForeColor="Red" SetFocusOnError="True" Display="Dynamic"
ValidationGroup="Save"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="col col-3">
<asp:Label ID="Label71" runat="server" Text="Invoice No"></asp:Label>
</td>
<td class="col col-9">
<asp:TextBox ID="TxtInvoiceNo" Text="" Width="75%" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td class="col col-3">
<asp:Label ID="Label72" runat="server" Text="Invoice Amount"></asp:Label>
</td>
<td class="col col-9">
<asp:TextBox ID="TxtInvoiceAmount" Text="0" Width="75%" runat="server" OnTextChanged="TxtInvoiceAmount_TextChanged" AutoPostBack="true"></asp:TextBox>
</td>
</tr>
</table>
</div>
</div>
<%-- End Vendor Information --%>
<%-- Start Upload File --%>
<div class="container mb-0 mt-0">
<div class="row g-0 mb-0">
<div class="col col-12 bg-primary text-white text-center fs-5 ">
<asp:Label ID="Label75" runat="server" Text="Upload Document"></asp:Label>
</div>
</div>
<div class="row g-0 mb-0 mt-0">
<table class="table bg_Entry_Color1" border="1">
<tbody>
<tr>
<td class="col col-2">
<asp:Label ID="Label74" runat="server" Text="Upload Document "></asp:Label>
</td>
<td class="col col-3">
<input id="uploadPDF" type="file" name="myPDF" class="custom-file-input btn btn-danger btn-outline-info text-dark "
accept="application/pdf,application/PDF"
onchange="return fileValidation()" />
<table id="previewbtn" style="width: 100%; text-align: right" border="0">
<tr>
<td class="border-0">
<input type="button" value="Preview File"
class="btn btn-light btn-outline-primary" onclick="PreviewPDF();" />
</td>
</tr>
</table>
</td>
<td class="col col-7" rowspan="15">
<div style="clear: both; width: 100%">
<iframe id="viewer" style="width: 100%; height: 200px"></iframe>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<%-- End Upload File --%>
</form>
</body>
</html>
