You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

771 lines
31 KiB
Plaintext

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="OrderPostInfo.aspx.cs" Inherits="TradeManageNew.OrderPost.OrderPostInfo" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> Order Ship Info</title>
<link rel="stylesheet" type="text/css" href="../themes/default/easyui.css" />
<link rel="stylesheet" type="text/css" href="../themes/icon.css" />
<link rel="stylesheet" type="text/css" href="../themes/New.css?a=1" />
<link rel="stylesheet" type="text/css" href="../themes/DataGrid.css" />
<script src="../Scripts/MicrosoftAjax.js" type="text/javascript"></script>
<script src="../Scripts/jquery.min.js" type="text/javascript"></script>
<script src="../Scripts/jquery.easyui.min.js" type="text/javascript"></script>
<script src="../Scripts/DataGrid.js?a=3445" type="text/javascript"></script>
<script src="../Scripts/DataPager.js" type="text/javascript"></script>
<script src="../Scripts/jquery.bgiframe.min.js" type="text/javascript"></script>
<script src="../Scripts/Global.js" type="text/javascript"></script>
<script src="../Scripts/jquery.url.js" type="text/javascript"></script>
<script src="../Scripts/WindowLoad.js" type="text/javascript"></script>
<script src="../Scripts/jquery.cookies.min.js" type="text/javascript"></script>
<script src="../Scripts/MaskedTextBox.js" type="text/javascript"></script>
<script src="../Scripts/ajaxfileupload.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="../Scripts/fancybox2.1/source/jquery.fancybox.css?v=2.1.5"
media="screen" />
<script type="text/javascript" src="../Scripts/fancybox2.1/lib/jquery.mousewheel-3.0.6.pack.js"></script>
<script type="text/javascript" src="../Scripts/fancybox2.1/source/jquery.fancybox.js?v=2.1.5"></script>
<script src="../Scripts/DatePicker/WdatePicker.js" type="text/javascript"></script>
<script type="text/javascript" src="../Scripts/highcharts.js"></script>
<script src="../Scripts/kindeditor/kindeditor-min.js" type="text/javascript"></script>
<script src="../Scripts/kindeditor/lang/zh_CN.js" type="text/javascript"></script>
<script type="text/javascript">
var datagrid1 = new nblf.ui.DataGrid("DataGrid1");
var WindowLoadModel = new WindowLoad();
var Id = 0;
$(document).ready(function () {
WindowLoadModel.ApplicationPath = "../";
WindowLoadModel.ControlID = "WindowLoad";
WindowLoadModel.Isbgiframe = true;
WindowLoadModel.Load();
var day1 = new Date();
var s1 = day1.getFullYear() + "-" + (day1.getMonth() + 1) + "-" + day1.getDate();
$("#txt_SDate,#txt_EDate").val(s1);
ajaxInit(WindowLoadModel);
CreateDataGrid();
ReadData();
$("#btn_sch").bind("click", function () {
ReadData();
});
$("#btn_add").bind("click", function () {
Id = 0;
Clear();
fopen();
});
$("#" + datagrid1.TableID + " [CommandName='cmdEdit']").live("click", function () {
var RowIndex = $(this).parentsUntil("tr").parent().attr("index");
var model = datagrid1.Get_Model(RowIndex);
Id = model.ID;
Clear();
$("#add_wareHouse").val(model.WareHouse);
if (model.PostDate != null)
$("#add_shipDate").val(model.PostDate.localeFormat("yyyy-MM-dd"));
$("#add_sku").val(model.SKU);
$("#add_orderCode").val(model.OrderCode);
$("#add_newSKU").val(model.NewSKU);
$("#add_quantity").val(model.Qty);
$("#add_location").val(model.LocationCode);
$("#add_trackCode").val(model.TrackCode);
$("#add_shipState").val(model.PostState);
$("#add_printState").val(model.PrintState);
$("#add_shipQuantity").val(model.PostQty);
$("#add_remark").val(model.Remark);
fopen();
});
$("#btn_Excel1").click(function () {
if ($("#ip_wareHouse").val() == "") {
alert("Import WareHouse can not be empty"); return;
}
if ($("#ip_date").val() == "") {
alert("Import Date can not be empty"); return;
}
ajaxFileUpload();
});
$("#btn_Excel2").click(function () {
var url = '../ServerCookies/ShipOrdersTemplate.xls';
// 创建隐藏的 <a> 元素
var link = document.createElement('a');
link.href = url;
link.download = url.split('/').pop(); // 设置下载文件的名称
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
})
//上传快递面单图片
$("#uploadImage").click(function () {
var formData = new FormData();
var files = $('#fileInput')[0].files;
if (files.length <= 0) {
return;
}
for (var i = 0; i < files.length; i++) {
formData.append('files', files[i]);
var fileName = files[i].name.toLowerCase();
if (!fileName.endsWith('.png') && !fileName.endsWith('.jpg') && !fileName.endsWith('.jpeg') && !fileName.endsWith('.pdf')) {
alert("Please select image file")
return;
}
}
WindowLoadModel.Show();
$.ajax({
url: "../SysManageServiceNew.asmx/UploadTrackCodeImages",
type: 'POST',
data: formData,
contentType: false,
processData: false,
success: function (data) {
WindowLoadModel.Hide();
if (data != "" && data.Code == 0) { alert(data.Message); return; }
},
error: function (xhr, status) {
if (status != "success") alert(xhr.responseText);
}
});
});
$('#btn_delete').click(function () {
DeleteSelectData();
})
});
function fopen() {
$.fancybox({
'width': '40%',
'height': '40%',
'autoScale': false,
'transitionIn': 'elastic',
'transitionOut': 'elastic',
'href': '#test',
'onComplete': function () {
}
});
}
function Clear() {
$("#add_wareHouse").val("W");
$("#add_shipDate").val("");
$("#add_orderCode").val("");
$("#add_sku").val("");
$("#add_newSKU").val("");
$("#add_quantity").val("");
$("#add_location").val("");
$("#add_trackCode").val("");
$("#add_shipState").val("0");
$("#add_printState").val("0");
$("#add_shipQuantity").val("");
$("#add_remark").val("");
}
//#region 初始化DataGrid
function CreateDataGrid() {
var col = new nblf.ui.DataGridColumn();
col.HeaderText = "WareHouse";
col.CellTemplate = "<span>{Bind WareHouse}</span>";
Array.add(datagrid1.Columns, col);
col = new nblf.ui.DataGridColumn();
col.HeaderText = "Ship Date";
col.CellTemplate = "<a>{Bind PostDate,yyyy-MM-dd}</a>";
Array.add(datagrid1.Columns, col);
col = new nblf.ui.DataGridColumn();
col.HeaderText = "OrderCode";
col.CellTemplate = "<a>{Bind OrderCode}</a>";
Array.add(datagrid1.Columns, col);
col = new nblf.ui.DataGridColumn();
col.HeaderText = "SKU";
col.CellTemplate = "<a>{Bind SKU}</a>";
Array.add(datagrid1.Columns, col);
col = new nblf.ui.DataGridColumn();
col.HeaderText = "NewSKU";
col.CellTemplate = "<a>{Bind NewSKU}</a>";
Array.add(datagrid1.Columns, col);
col = new nblf.ui.DataGridColumn();
col.HeaderText = "Quantity";
col.CellTemplate = "<a>{Bind Qty}</a>";
Array.add(datagrid1.Columns, col);
col = new nblf.ui.DataGridColumn();
col.HeaderText = "LocationCode";
col.CellTemplate = "<a>{Bind LocationCode}</a>";
Array.add(datagrid1.Columns, col);
col = new nblf.ui.DataGridColumn();
col.HeaderText = "TrackCode";
col.Width = "200px";
col.CellTemplate = "<a style='max-width:200px;word-wrap:break-word;display:inline-block;'>{Bind TrackCode}</a>";
Array.add(datagrid1.Columns, col);
col = new nblf.ui.DataGridColumn();
col.HeaderText = "label_cost";
col.CellTemplate = "<a>{Bind label_cost}</a>";
col = new nblf.ui.DataGridColumn();
col.HeaderText = "Ship State";
col.SortExpression = "Ship State";
col.CellTemplate = "<span>{Bind PostState}</span>";
col.CellFormatter = function (value) {
switch (value) {
case 2: return "All Ship";
case 1: return "Partial Ship";
default: return "No Ship";
}
};
Array.add(datagrid1.Columns, col);
col = new nblf.ui.DataGridColumn();
col.HeaderText = "Shipped Quantity";
col.CellTemplate = "<span>{Bind PostQty}</span>";
Array.add(datagrid1.Columns, col);
col = new nblf.ui.DataGridColumn();
col.HeaderText = "PrintState";
col.CellTemplate = "<span>{Bind PrintState}</span>";
col.CellFormatter = function (value) {
switch (value) {
case 0: return "UnPrint";
case 1: return "Printing";
case 2: return "Printed";
}
};
Array.add(datagrid1.Columns, col);
col = new nblf.ui.DataGridColumn();
col.HeaderText = "Remark";
col.CellTemplate = "<span>{Bind Remark}</span>";
col.SortExpression = "Remark";
Array.add(datagrid1.Columns, col);
col = new nblf.ui.DataGridColumn();
col.HeaderText = "Options";
col.Width = "150px";
col.CellTemplate = "<input CommandName='cmdEdit' class='btnClass dgbtnEdit' type='button' value='Edit'></input>&nbsp<input onclick='DelCol(this)' class='btnClass dgbtnDel' type='button' value='Delete'></input>";
Array.add(datagrid1.Columns, col);
datagrid1.SetPageSize(200);
datagrid1.SetPageIndex(1);
datagrid1.SortExpression = "Id ";
datagrid1.ViewSortDirection = "desc";
datagrid1.IsFixHeader = true;
datagrid1.ShowIndexColumn = true;
datagrid1.AllowPaging = true;
datagrid1.AllowPaging2 = true;
datagrid1.ShowIndexColumn = true;
datagrid1.Width = "100%";
datagrid1.SelectMode = nblf.ui.SelectMode.CheckBox;
datagrid1.Init();
datagrid1.Sorting(function () {
ReadData();
});
datagrid1.add_PageIndexChanged(function () { ReadData(); });
}
//#endregion
//#region 读取数据
function ReadData() {
debugger;
var param = new Object();
param.searchType = $("#select-searchType").val();
param.searchCode = $("#searchTxt").val();
param.wareHouse = $("#select-wareHouse").val();
param.postState = $("#select-shipState").val();
param.printState = $("#select-printState").val();
param.sDate = $("#txt_SDate").val();
param.eDate = $("#txt_EDate").val();
param.PageSize = datagrid1.Get_PageSize();
param.PageIndex = datagrid1.Get_PageIndex();
WindowLoadModel.Show();
$.ajax({
url: "../PostGoodServiceNew.asmx/GetOrderPostInfoList",
data: Sys.Serialization.JavaScriptSerializer.serialize(param),
success: function (data) {
WindowLoadModel.Hide();
datagrid1.Set_RowCount(data.d.RowCount);
datagrid1.DataBind(data.d.DataSource);
}
});
}
//#endregion
function Save() {
var md = new Object();
var param = new Object();
md.ID = Id;
md.WareHouse = $("#add_wareHouse").val();
if ($("#add_shipDate").val() == "") {
alert("Ship Date can not empty");
return;
}
md.PostDate = $("#add_shipDate").val();
if ($("#add_orderCode").val() == "") {
alert("OrderCode can not empty");
return;
}
md.OrderCode = $("#add_orderCode").val();
if ($("#add_sku").val() == "") {
alert("SKU can not empty");
return;
}
md.SKU = $("#add_sku").val();
md.NewSKU = $("#add_newSKU").val();
if ($("#add_quantity").val() == "") {
alert("Quantity can not empty");
return;
}
md.Qty = $("#add_quantity").val();
if ($("#add_location").val() == "") {
alert("LocationCode can not empty");
return;
}
md.LocationCode = $("#add_location").val();
if ($("#add_trackCode").val() == "") {
alert("TrackCode can not empty");
return;
}
md.TrackCode = $("#add_trackCode").val();
md.PostState = $("#add_shipState").val();
md.PrintState = $("#add_printState").val();
md.PostQty = $("#add_shipQuantity").val();
md.Remark = $("#add_remark").val();
param.md = md;
WindowLoadModel.Show();
$.ajax({
url: "../PostGoodServiceNew.asmx/SaveOrderPostInfo",
data: Sys.Serialization.JavaScriptSerializer.serialize(param),
dataType: "json",
success: function (data) {
WindowLoadModel.Hide();
if (data.d.Code == 0) {
alert(data.d.Message);
} else {
ReadData();
$.fancybox.close();
}
}
});
}
function DelCol(obj) {
if (window.confirm('Are you sure to delete it ?') == false) return;
var rowindex = $(obj).parent().parent().attr("index");
var param = new Object();
var model = datagrid1.Get_Model(rowindex);
param.id = model.ID;
$.ajax({
url: "../PostGoodServiceNew.asmx/DeleteOrderPostInfo",
data: Sys.Serialization.JavaScriptSerializer.serialize(param),
dataType: "json",
success: function (data) {
if (data.d.Code == 0) {
alert(data.d.Message);
} else {
ReadData();
}
}
});
}
function ajaxFileUpload() {
var filename = $("#fileToUpload").val();
if (!filename.endsWith('.xls') && !filename.endsWith('.xlsx')) { alert("Please select an Excel file"); return; }
$.ajaxFileUpload({
url: '../GlobalAshx/AjaxFileUpdate.ashx?DirectoryName=ServerCookies',
secureuri: false,
fileElementId: 'fileToUpload',
dataType: 'json',
success: function (data, status) {
ImportGoods("ServerCookies/" + data.FileName);
},
error: function (data, status, e) {
alert(e);
}
});
}
function ImportGoods(FileName) {
if ($("#ip_wareHouse").val() == "") {
alert("Import WareHouse can not be empty"); return;
}
if ($("#ip_date").val() == "") {
alert("Import Date can not be empty"); return;
}
var param = new Object();
param.wareHouse = $("#ip_wareHouse").val();
param.ipDate = $("#ip_date").val();
param.fileName = FileName;
WindowLoadModel.Show();
$.ajax({
url: "../PostGoodServiceNew.asmx/ImportShipOrderDatas",
data: Sys.Serialization.JavaScriptSerializer.serialize(param),
success: function (data) {
WindowLoadModel.Hide();
if (data.d != "") { alert(data.d); ReadData(); return; }
},
error: function (xhr, status) {
if (status != "success") alert(xhr.responseText);
}
});
}
function ExportSelectData() {
var param = new Object();
var selectlist = datagrid1.GetSelectListModel();
if (selectlist == null || selectlist.length == 0) {
alert("Please select the data to export");
return;
}
var ids = "";
$(selectlist).each(function () {
ids += this.ID + ",";
});
param.ids = ids;
param.wareHouse = $("#select-wareHouse").val();
var fname = "PickGoodList.xls";
$.ajax({
url: "../PostGoodServiceNew.asmx/MakePickGoodListForIds",
data: Sys.Serialization.JavaScriptSerializer.serialize(param),
async: false,
success: function (data) {
if (data.d != null && data.d.Code == 1) {
params = { FilePath: data.d.Message, FileName: fname };
window.location = "../GlobalAshx/DownFile.ashx?" + jQuery.param(params);
ReadData();
alert("Success");
} else {
alert(data.d.Message);
}
}
});
}
function ExportTemuOrderTrackFile() {
var param = new Object();
param.wareHouse = $("#select-wareHouse").val();
param.sDate = $("#txt_SDate").val();
param.eDate = $("#txt_EDate").val();
var currentDate = new Date();
var month = ('0' + (currentDate.getMonth() + 1)).slice(-2); // 加 1 是因为月份从 0 开始计数
var day = ('0' + currentDate.getDate()).slice(-2);
var fname = $("#select-wareHouse").val() + month + day + ".zip";
debugger;
WindowLoadModel.Show();
$.ajax({
url: "../PostGoodServiceNew.asmx/DownLoadTemuTrackCodeImg",
data: Sys.Serialization.JavaScriptSerializer.serialize(param),
async: false,
success: function (data) {
WindowLoadModel.Hide();
if (data.d != null && data.d.Code == 1) {
params = { FilePath: data.d.Datas, FileName: fname };
window.location = "../GlobalAshx/DownFile.ashx?" + jQuery.param(params);
alert("导出成功:" + data.d.Message);
} else {
alert(data.d.Message);
}
}
});
}
function ExportAllData() {
var param = new Object();
if ($("#select-wareHouse").val() == "") {
alert("The value of WareHouse must be W or E");
return;
}
param.searchType = $("#select-searchType").val();
param.searchCode = $("#searchTxt").val();
param.wareHouse = $("#select-wareHouse").val();
param.postState = $("#select-shipState").val();
param.printState = $("#select-printState").val();
param.sDate = $("#txt_SDate").val();
param.eDate = $("#txt_EDate").val();
if ($('#fgcheckbox').is(':checked')) {
// 复选框被选中
param.isFG = 1;
} else {
// 复选框未被选中
param.isFG = 0;
}
var fname = "PickGoodList.xls";
WindowLoadModel.Show();
$.ajax({
url: "../PostGoodServiceNew.asmx/MakePickGoodListForAllDatasNew",
data: Sys.Serialization.JavaScriptSerializer.serialize(param),
async: false,
success: function (data) {
WindowLoadModel.Hide();
if (data.d != null && data.d.Code == 1) {
params = { FilePath: data.d.Message, FileName: fname };
window.location = "../GlobalAshx/DownFile.ashx?" + jQuery.param(params);
ReadData();
alert("Success");
} else {
alert(data.d.Message);
}
}
});
}
function DeleteSelectData() {
var param = new Object();
var selectlist = datagrid1.GetSelectListModel();
if (selectlist == null || selectlist.length == 0) {
alert("Please select the data to delete");
return;
}
var ids = "";
$(selectlist).each(function () {
ids += this.ID + ",";
});
param.ids = ids;
$.ajax({
url: "../PostGoodServiceNew.asmx/DeleteOrderPostInfoForIDs",
data: Sys.Serialization.JavaScriptSerializer.serialize(param),
async: false,
success: function (data) {
if (data.d != null && data.d.Code == 1) {
ReadData();
} else {
alert(data.d.Message);
}
}
});
}
</script>
</head>
<body class="headbody">
<div class="title_ico">
Ship Orders</div>
<div style="display: none">
<div id="test" title="Order Ship Info" style="width:600px; height:400px;">
<table width="95%" class="tableAll" border="1" ellspacing="0" cellpadding="2">
<tr>
<td style="width: 110px;" class="f1">
<font color="red" style="font-weight: bolder">*</font>WareHouse
</td>
<td><select id="add_wareHouse"><option value="W" selected>W</option><option value="E">E</option></select></td>
<td style="width: 110px;" class="f1">
<font color="red" style="font-weight: bolder">*</font>Ship Date
</td>
<td>
<input id="add_shipDate" class="editTextbox" onfocus="WdatePicker()" style="width: 120px;" type="text" autocomplete="off" />
</td>
</tr>
<tr>
<td style="width: 110px;" class="f1">
<font color="red" style="font-weight: bolder">*</font>OrderCode
</td>
<td>
<input id="add_orderCode" class="editTextbox" style="width: 120px;" type="text" />
</td>
<td style="width: 110px;" class="f1">
<font color="red" style="font-weight: bolder">*</font>SKU
</td>
<td>
<input id="add_sku" class="editTextbox" style="width: 120px;" type="text" />
</td>
</tr>
<tr>
<td style="width: 110px;" class="f1">
NewSKU
</td>
<td>
<input id="add_newSKU" class="editTextbox" style="width: 120px;" type="text" />
</td>
<td style="width: 110px;" class="f1">
<font color="red" style="font-weight: bolder">*</font>Quantity
</td>
<td>
<input id="add_quantity" min='0' max='1000000000' precision='0' class="editTextbox" style="width: 120px;" type="text" />
</td>
</tr>
<tr>
<td style="width: 110px;" class="f1">
<font color="red" style="font-weight: bolder">*</font>LocationCode
</td>
<td>
<input id="add_location" class="editTextbox" style="width: 120px;" type="text" />
</td>
<td style="width: 110px;" class="f1">
<font color="red" style="font-weight: bolder">*</font>TrackCode
</td>
<td>
<input id="add_trackCode" class="editTextbox" style="width: 120px;" type="text" />
</td>
</tr>
<tr>
<td style="width: 110px;" class="f1">
<font color="red" style="font-weight: bolder">*</font>Ship State
</td>
<td><select id="add_shipState"><option value="0" selected>No Ship</option><option value="1">Partial Ship</option><option value="2">All Ship</option></select></td>
<td style="width: 110px;" class="f1">
<font color="red" style="font-weight: bolder">*</font>Print State
</td>
<td><select id="add_printState"><option value="0">UnPrint</option><option value="1">Printing</option><option value="2">Printed</option></select></td>
</tr>
<tr>
<td style="width: 110px;" class="f1">
Shipped Quantity
</td>
<td>
<input id="add_shipQuantity" min='0' max='1000000000' precision='0' class="editTextbox" style="width: 120px;" type="text" />
</td>
<td style="width: 110px;" class="f1">
Remark
</td>
<td><input id="add_remark" class="editTextbox" style="width: 120px;" type="text" /></td>
</tr>
<tr>
<td align="center" colspan="2">
<input
id="btn_Save" type="button" class="btnClass btnClassSave" value="Save" onclick="Save();" />
</td>
</tr>
</table>
</div>
</div>
<table id="tb1" class="tableAll" style="width: 100%;">
<tr>
<td class="f1" width="10%"><select id="select-searchType"><option value="1" selected>OrderCode</option><option value="2">SKU</option><option value="3">LocationCode</option><option value="4">TrackCode</option></select></td>
<td><input id="searchTxt" class="editTextbox" style="width: 120px;" type="text" autocomplete="off" /></td>
<td class="f1" width="10%">WareHouse</td>
<td><select id="select-wareHouse"><option value="W" selected>W</option><option value="E">E</option></select></td>
<td class="f1" width="10%">Ship State</td>
<td><select id="select-shipState"><option value="-1" selected>All</option><option value="0">No Ship</option><option value="1">Partial Ship</option><option value="2">All Ship</option></select></td>
<td><input id="btn_sch" class="btnClass btnClassFind" type="button" value="Search" /> <input id="btn_delete" class="btnClass dgbtnDel" type="button" value="Delete Select Data" /></td>
</tr>
<tr>
<td class="f1" width="10%">Print State</td>
<td><select id="select-printState"><option value="-1" selected>All</option><option value="0">UnPrint</option><option value="1">Printing</option><option value="2">Printed</option></select></td>
<td class="f1" width="10%">Ship Date:</td>
<td>
<input id="txt_SDate" class="editTextbox" onfocus="WdatePicker()" style="width: 120px;" type="text" autocomplete="off" />-<input id="txt_EDate" class="editTextbox" onfocus="WdatePicker()" style="width: 120px;" type="text" autocomplete="off" /></td>
<td class="f1" width="10%">
<input id="btn_add" class="btnClass btnClassAdd" type="button" value="Add" />
<input id="fgcheckbox" type="checkbox" name="fuGaiPick" checked />覆盖生成
</td>
<td>
<input id="btn_Download2" type="button" class="btnClass btnClassExcelTemplate" value="All Data Make Pick List" onclick="ExportAllData()" />
</td>
<td>
<%-- <input id="btn_Download1" type="button" class="btnClass btnClassExcelTemplate" value="Select Data Make Pick List " onclick="ExportSelectData()" />--%>
<input id="btn_DownloadTemu" type="button" class="btnClass btnClassExcelTemplate" value="导出TEMU面单" onclick="ExportTemuOrderTrackFile()" />
</td>
</tr>
<tr>
<td >Import WareHouse</td>
<td><select id="ip_wareHouse"><option value="W">W</option><option value="E">E</option></select></td>
<td>Import Date:</td>
<td>
<input id="ip_date" class="editTextbox" onfocus="WdatePicker()" style="width: 120px;" type="text" autocomplete="off" />
</td>
<td >Import Orders</td>
<td>
<input id="fileToUpload" accept="excel/xls" name="fileToUpload" type="file" style="width: 200px" />
</td>
<td>
<input id="btn_Excel1" type="button" class="btnClass btnClassEdit" value="Confirm Import" />
<input id="btn_Excel2" type="button" class="btnClass btnClassEdit" value="Download Template" />
</td>
</tr>
<tr><td >Import TrackCode Images</td><td> <input type="file" id="fileInput" multiple /></td><td><button id="uploadImage">Upload Images</button></td></tr>
<tr>
<td valign="top" colspan="7">
<div id="DataGrid1" class="DataGridStyle"></div>
</td>
</tr>
</table>
</body>
</html>