angularjs - How to add a Consecutive Number in Angular JS

Question

Every time the customer creates a "Proveedor (provider)", they need to fill the Numero de proveedor field in order to continue as you can see in this picture (the top-left input field):

The problem is that the DB has around 1000+ providers, and the "Numero de proveedor" was randomly selected (I've providers with 1234567890 number) so, I want to see how can I set the consecutive number not being used already in that field when the user access to that view.

What I want is to access to the create view of Proveedores and see that field filled automatically with a number not being used.

This is my code:

<div class="form-group col-md-4">
    <label for="razon_social">Numero de proveedor</label>
    <input ng-model="proveedor.codigo_empresa" class="form-control" type="number" placeholder="Codigo empresa">
</div>

If the solution can be in AngularJS it would be great!

Thanks for the help.

question from:https://stackoverflow.com/questions/65849638/how-to-add-a-consecutive-number-in-angular-js

Answer 1

I would create a server side request for a new Proveedore, and that function can generate and return a new unused number.

To generate a new number you can do that a couple of different ways:
1: generate a random number and see if it exists in the database. If it does generate another and test, repeat until you find an unused number.
2: Generate a random number and if it exists increment that number by one and test if that exists. Repeat incrementing and testing until you find one that doesn't exist.

There are other ways also. If you don't need a random number then you could restart numbering at the lowest allowed, such as 1, and test if it's available. Increment until you find an unused one. Then save this for the next request.

After your function finds an used number return that to the client - browser.

Server side would be done in Laravel (php). AngularJS browser side would be a simple http.get request, depending on the structure of your code you would do something like:

$http.get('/api/newproveedore)
        .success(function(data) {
            $scope.proveedore = data;
        })
        .error(function(data) {
          console.log('Error: ' + data);
        });