How to change 9 digit uploaded data into 10-digit number in angular

Question

0.00/5 (No votes)

See more:

Hi Team,
I am totally new to angular. I have angular UI where we upload a .CSV file with 6 columns and their respective data, so before I invoke .net API , I need change If the 1st column has data with 9 digits then we need to change to 10 digits just by prefixing ‘0’, For example If the excel 1st (AccountNumber )column data as ‘609878837’ this number has to be changed to ‘0609878837’, after the changed value I need pass to API.

Here is my working Code for uploaded data is being passed to API. Now I need to add a condition to change the number to 10 digits If I found 9-digit number this is applicable only to 1st (AccountNumber) column in .csv file which was uploaded.

UserNumber 876876876
DESCRIPTION Hello
AccountNumber State Current Premium Interest Total
1207614641 FL GG 200.51 24.58 225.09
217614234 FL GG 474.65 51.77 526.42

https://i.stack.imgur.com/mynhP.png

What I have tried:

JavaScript

<pre><input #fileUpload type="file" class="file-upload" name="fileUpload" id="fileUpload" accept=".xlsx,.xls,.csv" required (change)="onFileChange($event)">
<button (click)="UploadFile(form.value)" type="button" mat-raised-button color="primary" [disabled]="!fileSelected">Upload</button>

onFileChange(event: any): void {
   this.file = event.target.files[0];

   if (this.file) {
     console.log("this.file.type: " + this.file.type);

       const fileName = this.file.name;

       this.fileSelected = true;
       this.invalidFileType = false;
       this.invalidFileSize = false;
       this.invalidFileRecords = false;
       let file: File = this.file;
       var value;
       const fileReader = new FileReader();

       fileReader.onload = (e: any) => {
         value = e.target.result;
         
        this.data = value;

        var rows = e.target.result.split("\n");
        if (rows.length > 6003) {
          LoggerService.error(`upload records less than 6K.`, true, true);
       }

       };
   
       fileReader.readAsBinaryString(this.file);
     }
   }


UploadFile(filevalue) {
  
  const reqbody = {
    filename: this.file?.name,
    destinationPath: '',
    lines: this.data.replace(/[^a-zA-Z0-9,\n\r.'" ]/g, "").split('\r\n')
  };

  var route = "CallNETAPI";
  this.dataService.post(reqbody, route).subscribe(
    (data: any[]) => {
      console.log("Response data: " + data);
      LoggerService.success(`File successfully uploaded to server`, true, false);
      this.responseData = data;
    },
    (error: Response) => {
      this.displayError = true;
      this.errorText = `Error from CallNETAPI API service ${error.status}`;
    });
}

Posted 26-Mar-24 5:11am

techno pack

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Pete O'Hanlon · Accepted Answer · 2024-03-26T05:28:00

Solution 1

There are a few ways you can accomplish this. If you are using a version of ES that's high enough, you can use padStart[^] (this is available from ES2017 onwards). If you don't have that available, you can write your own easily enough.

TypeScript

padStart(num:number, size:number): string {
    let baseString = num+"";
    while (baseString.length < size) baseString = "0" + baseString;
    return baseString;
}

There are other versions of this code, but that's a simple way to accomplish this. Use padStart without adding this code and, if you're on ES2015 or so, then add this code.

Posted 26-Mar-24 5:28am

Pete O'Hanlon

Comments

techno pack 26-Mar-24 11:33am

Thank you Pete for your response, can you please suggest where I need to add your code block in my existing code flow, basically I need to pass the entire file (Including changed values)content to API

Pete O'Hanlon 26-Mar-24 11:43am

I see that you're uploading the file to the server. The code to change the value would have to be in the handling code at the server.

techno pack 26-Mar-24 11:50am

OK, basically we should make changes in C# (API) not in angualr code , in API that should change 9 digits to 10 digits , is that correct ?

Pete O'Hanlon 26-Mar-24 12:15pm

That's correct.

techno pack 26-Mar-24 12:19pm

Thank you, I made the required code changes in C#, I am good now. Just curiosity one question is this possible to handle this in Angualr UI side ? this is mycode : Number.Trim().PadLeft(10, '0')

Pete O'Hanlon 26-Mar-24 12:22pm

The only way to do this would be to open the file, and transmit the individual parts of the file.

techno pack 26-Mar-24 12:24pm

Thank you Pete

Pete O'Hanlon 26-Mar-24 12:24pm

My pleasure.