Whenever we are uploading file we are not getting path of file,we are getting empty string webrelative path,
webrelativepath=' '. herewith i am attaching code for ejs uploader, after uploading file i want to store on local machine like c:/file/abc.xls
<div class="page-titles">
<div>
<ol class="breadcrumb">
<li class="breadcrumb-item" tabindex="0" ng-reflect-router-link="/index">Post-Processing</li>
<li class="breadcrumb-item active">Bulk Data Ingestion</li>
</ol>
</div>
</div>
<form #justAForm="ngForm" (ngSubmit)="uploadFiles($event)">
<!-- First row -->
<div class="e-card">
<div fxFlexFill class="flex-container" fxLayout="row" fxLayout.xs="column" fxLayoutGap="20px">
<div fxFlex class="child-1">
<span id="custlabelfile">File Upload</span>
<ejs-uploader #defaultupload id='file' [asyncSettings]='path' [dropArea]='dropElement'
(removing)='onFileRemove($event)' (change)="getFileDetails($event)" (selected)='onFileSelect($event)' change="getAgreementTypeData($event)"[ngModel]="file" name="file"></ejs-uploader>
<!-- <ejs-uploader #chunkupload id='chunkfileupload' [autoUpload]=false [allowedExtensions]='allowExtensions'
(selected)='onSelect($event)'>
</ejs-uploader> -->
</div>
<div fxFlex class="child-2">
<ejs-dropdownlist floatLabelType="Always" id='documentName' name="documentName"
[dataSource]='agreementTypeDatas' [fields]='fieldsvalues' placeholder='Select Document' popupHeight='200px'
(change)='onDocumentSelect($event)' ngModel>
</ejs-dropdownlist>
</div>
<div fxFlex class="child-3">
<ejs-textbox placeholder="Identifier" [ngModel]="Identifier" name="Identifier" floatLabelType="Always" ngModel>
</ejs-textbox>
</div>
<div fxFlex="100px" class="child-4">
<button type="submit" cssClass="e-primary">Upload</button>
</div>
</div>
</div>
</form>
<br>
<ejs-grid #grid [dataSource]='data' [allowPaging]="true" [allowSorting]="true" [allowSelection]="true"
[allowPaging]="true" [selectionSettings]='selectionOptions' [allowFiltering]='true' [filterSettings]='filterOption'
showColumnChooser='true' [pageSettings]='pageSettings'>
<e-columns>
<e-column textAlign='Left' width='180' field='Identifier' headerText='Identifier'></e-column>
<e-column textAlign='Left' width='250' field='file' headerText='Transaction Name'></e-column>
<e-column textAlign='Left' width='160' field='FileType' headerText='Agreement Type'></e-column>
<e-column textAlign='Left' width='190' field='CFileType' headerText='Created Time'></e-column>
<e-column textAlign='Left' width='200' field='TypeofAgreement' headerText='Ingestion Time'>
</e-column>
<e-column textAlign='Left' width='200' field='TypeofAgreement' headerText='User'>
</e-column>
<e-column textAlign='Left' width='200' field='TypeofAgreement' headerText='Status'>
</e-column>
</e-columns>
</ejs-grid>
import { Component, OnInit,ViewChild } from '@angular/core';
import { GlobalModalComponent } from '../../global-modal/global-modal.component';
import { BsModalRef, BsModalService } from 'ngx-bootstrap/modal';
import { DocexecutionService } from '../../service/data/docexecution.service';
import { NgbModal, NgbTabChangeEvent, NgbTabset, NgbDatepickerConfig } from '@ng-bootstrap/ng-bootstrap';
import { DocumentService, DocumentType} from '../../service/data/document.service';
import { AUTHENTICATE_USER } from '../../service/hardcoded-authentication.service';
import {NgForm} from '@angular/forms';
import { SelectedEventArgs, FileInfo } from '@syncfusion/ej2-angular-inputs';
import { EmitType, detach } from '@syncfusion/ej2-base';
import { DialogUtility } from '@syncfusion/ej2-angular-popups';
@Component({
selector: 'app-bulk-data-ingestion',
templateUrl: './bulk-data-ingestion.component.html',
styleUrls: ['./bulk-data-ingestion.component.css']
})
export class BulkDataIngestionComponent implements OnInit {
@ViewChild(NgForm) form: NgForm;
dropdownSettingsDT = {};
documents: DocumentType[];
docTypeName: any;
public allowExtensions: string = '.xls, .xlsx';
public fileName: string = "";
public files: FileInfo[];
identifier: any;
public userName = sessionStorage.getItem(AUTHENTICATE_USER);
// fileName = '';
fileTypeMessage: string;
selectedFiles: FileList;
isUpload: boolean = true;
fileList = [];
text: string = "Upload";
isLoading: boolean = false;
model: any = {};
agreementTypeDatas = [];
agreementTypeDatas1 = [];
agreementTypeDatas11 = [];
fieldsvalues: Object;
documetTypeId: any;
selectedFiles1: any;
public checkFields2:Object={ text:'documentName',value:'documentTypeId'};
constructor(private docExecuteService: DocexecutionService, private bsModalRef: BsModalRef,
private bsModalService: BsModalService,
private modalService: NgbModal,private documentService: DocumentService) { }
ngOnInit() {
//this.loadDocuments();
this.getAgreementTypeData(event);
}
// Getting Data
getAgreementTypeData(event) {
this.documentService.getAllDocuments().subscribe(response => {
if (response != null) {
this.agreementTypeDatas = response
this.agreementTypeDatas.forEach(data => {
console.log(JSON.stringify(data));
console.log(JSON.stringify(this.agreementTypeDatas)+"Response Data@@@@@@@@@@@@@@@@@@@@@@@@");
this.agreementTypeDatas1.push(data.documentName);
// this.agreementTypeDatas1.push(data.documentName);
})
// for(var i in this.agreementTypeDatas1)
// {
// this.agreementTypeDatas112.push(this.agreementTypeDatas1[i])
// }
this.fieldsvalues = { text: "documentName", value: "documentTypeId" };
} else {
console.log('Data not fount');
}
});
this.agreementTypeDatas11 = this.agreementTypeDatas1;
}
onDocumentSelect(args)
{
this.documetTypeId=args.value;
console.log("in method");
console.log(args.value+"Value*******************************************************************************")
console.log(args+"args*************************************************************************************************************") ;
// console.log(JSON.stringify(args));
}
// onFileSelected(event) {
// const file:File = event.target.files[0];
// if (file) {
// this.fileName = file.name;
// const formData = new FormData();
// // formData.append("thumbnail", file);
// // const upload$ = this.http.post("/api/thumbnail-upload", formData);
// // upload$.subscribe();
// }
// }
uploadFiles(rf) {
alert("hello"+this.form.value.Identifier);
this.identifier=this.form.value.Identifier;
console.log(this.documetTypeId);
let companyId = sessionStorage.getItem("companyId");
//this.selectedFiles=this.selectedFiles1;
console.log(this.selectedFiles);
this.docExecuteService.uploadDocumentType(this.files[0].rawFile, companyId,this.documetTypeId,this.userName,this.identifier).subscribe(
response => {
alert("hi"+response);
});
}
public onFileSelect: EmitType<Object> = (args: any) => {
this.selectedFiles =args.filesData[0].name;
//this.identifier=this.form.value.Identifier;
alert(JSON.stringify(args));
this.files = args.filesData;
args.cancel = true;
if (this.files.length > 1) {
DialogUtility.alert("Please select only one file.");
args.cancel = true;
return;
} else if (this.files.length == 0) {
DialogUtility.alert("Please select a file.");
args.cancel = true;
return;
}
this.fileName = this.files[0].name;
alert(this.selectedFiles);
// console.log(args.filesData[0].name+"hiiiiiiiiiiii")
// let companyId = sessionStorage.getItem("companyId");
// this.docExecuteService.uploadDocumentType(this.selectedFiles, companyId,this.documetTypeId,this.userName,this.identifier).subscribe(
// response => {
// });
}
}