How to change numeric validation to string validation

user_15500092 0
Viewed 263

Currently I have a validation where I disable the buttons depending on the numerical value as follows:

disabled = [0,2,3,5]

/* Formatting function for row details - modify as you need */
function format(d) {
    // `d` is the original data object for the row
    $tipoproveedor = $("#txttipoproveedor").val();
    console.log(d);
    let tabla = `<table cellpadding="5" cellspacing="0" style="border-collapse: separate; border-spacing: 40px 5px;">
                    <thead>
                        <tr>
                            <th>
                                Date Order
                            </th>
                            <th>
                                Order
                            </th>
                            <th>
                                Status
                            </th>
                        </tr>
                        </thead>
                        <tbody>`;
                                                        
     d.Factura.forEach(f => { tabla += 
                               `<tr>                                                         
                                <td>${f.DateInvoice}</td>
                                <td>${f.Invoice}</td>       
                                <td>${f.Status}</td>                                                                                           
                                <td><button type="button" class="btn btn-primary" data-toggle="modal" data-target="#ModalCargaFactura" onclick="LoadInvoice('${f.PurchaseOrder}' )"`;
                 
                                if($tipoproveedor != '0'){
                                    if (disabled.indexOf(f.Estatus) > -1) {
                                        tabla += ` disabled `;
                                    }
                                }    
                                tabla += `>Upload Documents</button></td>                               
                                <td><button type="button" class="btn btn-primary" onclick="ShowDetailsInvoice('${f.Invoice}')">Details</button></td>
                                </tr>`;
     });
     tabla += '</tbody></table>';
     return tabla;    
}

Where I disable the button in the values 0,2,3,5 now these values ​​will change to strings giving the following assignment to the numeric values ​​like this:

0 = 'None'
2 = 'Accept'
3 = 'Send'
5 = 'Delivered'

What I require now is to validate no longer with the numbers but with the character string, I hope someone can give me some guidance with this validation.

Update 1:

Based on the answer I have made the following code changing my array of values ​​for strings as follows:

disabled = ['None','Accept','Send','Delivered']
    
    /* Formatting function for row details - modify as you need */
    function format(d) {
        // `d` is the original data object for the row
        $tipoproveedor = $("#txttipoproveedor").val();
        console.log(d);
        let tabla = `<table cellpadding="5" cellspacing="0" style="border-collapse: separate; border-spacing: 40px 5px;">
                        <thead>
                            <tr>
                                <th>
                                    Date Order
                                </th>
                                <th>
                                    Order
                                </th>
                                <th>
                                    Status
                                </th>
                            </tr>
                            </thead>
                            <tbody>`;
                                                            
      d.Factura.forEach(f => {tabla += 
                                   `<tr>                                                         
                                    <td>${f.DateInvoice}</td>
                                    <td>${f.Invoice}</td>       
                                    <td>${f.Status}</td>                                                                                           
                                    <td><button type="button" class="btn btn-primary" data-toggle="modal" data-target="#ModalCargaFactura" onclick="LoadInvoice('${f.PurchaseOrder}' )"`;
                     
                                    if($tipoproveedor != '0'){
                                        if (disabled.indexOf(f.Estatus) > -1) {
                                        tabla += ` disabled `;
                                        }
                                    }    
                                    tabla += `>Upload Documents</button></td>                               
                                    <td><button type="button" class="btn btn-primary" onclick="ShowDetailsInvoice('${f.Invoice}')">Details</button></td>
                                    </tr>`;
      });
      tabla += '</tbody></table>';
      return tabla;    
    }

What little I understand is that the validation no longer detects the numerical values ​​that existed in the array disabled and for this reason it marks the error and the data is not loaded into the table.

It will explain a little more in detail, currently I have in the table the column Status where the values ​​are shown 0,2,3,5 and the buttons are disabled or enabled depending on their value. In this case I have been forced to change these same values ​​for strings and in order not to complicate my life much I have decided to make this change from the query with which I show the data in the table with its simple caselike this:

CASE STATUS
                WHEN 0 THEN 'None'
                WHEN 1 THEN 'Receipment'
                WHEN 2 THEN 'Accept'
                WHEN 3 THEN 'Send'
                WHEN 4 THEN 'Process'
                WHEN 5 THEN 'Delivered'
                ELSE 'Other'
            END as 'STATUS'
javascript
6 Answers

Save the values as an object in the form:

const disabledValues = {
    0: 'None',
    2: 'Accept',
    3: 'Send',
    5: 'Delivered',
};

Later, during a comparison, cast your Estatus into the number (adding + at the beginning) and use it in the form:

if (disabledValues[+f.Estatus]) {
    tabla += ` disabled `;
}
user_145507710

Maybe I'm misunderstanding the question, but it sounds like you now expect .Estatus to contain a string instead of a number, and you still want the button disabling to work? If that's the case just change

disabled = [0,2,3,5]

to

disabled = ['None', 'Accept', 'Send', 'Delivered']

or even

disabled = [0, 2, 3, 5, 'None', 'Accept', 'Send', 'Delivered']

so you can handle both.

disabled = [0, 2, 3, 5, 'None', 'Accept', 'Send', 'Delivered']

/* Formatting function for row details - modify as you need */
function format(d) {
    // `d` is the original data object for the row
    $tipoproveedor = $("#txttipoproveedor").val();
    console.log(d);
      let tabla = `<table cellpadding="5" cellspacing="0" style="border-collapse: separate; border-spacing: 40px 5px;">
                    <thead>
                        <tr>
                            <th>
                                Date Order
                            </th>
                            <th>
                                Order
                            </th>
                            <th>
                                Status
                            </th>
                        </tr>
                        </thead>
                        <tbody>`;
                                                        
                            d.Factura.forEach(f => {                            
                                tabla += `<tr>                                                         
                                <td>${f.DateInvoice}</td>
                                <td>${f.Invoice}</td>       
                                <td>${f.Status}</td>                                                                                           
                                <td><button type="button" class="btn btn-primary" data-toggle="modal" data-target="#ModalCargaFactura" onclick="LoadInvoice('${f.PurchaseOrder}' )"`;
                 
                                if($tipoproveedor != '0'){
                                    if (disabled.indexOf(f.Estatus) > -1) {
                                        tabla += ` disabled `;
                                    }
                                }    
                                  tabla += `>Upload Documents</button></td>                               
                                <td><button type="button" class="btn btn-primary" onclick="ShowDetailsInvoice('${f.Invoice}')">Details</button></td>
                                </tr>`;
                            });
                       tabla += '</tbody></table>';
                       return tabla;    
}

user_20826730

Initialise you array like below, where you can customize your message.

const valuesToDisable = [
    {
        value: 0,
        note: 'None'
    },
    {
        value: 2,
        note: 'Accept'
    },
    {
        value: 3,
        note: 'Send'
    },
    {
        value: 5,
        note: 'Delivered'
    }
]

Iterate through the array and display it's note accordingly.

user_90870920

First, define your statuses in an object, give them a value how a button is disabled:

const statuses = {
  None: true,
  Receipment: false,
  Accept: true,
  Send: true,
  Process: true,
  Delivered: true,
  Other: false,
};

Then tune your code as:

if ($tipoproveedor != '0') {
  if (statuses[f.Estatus]) {
    tabla += ` disabled `;
  }
}
user_145550010

Just a quick idea, can be optimised further:

Your array :

const disabled = [
    {
        id: 0,
        text: 'None'
    },
    {
        id: 2,
        text: 'Accept'
    },
    {
        id: 3,
        text: 'Send'
    },
    {
        id: 5,
        text: 'Delivered'
    }
];

A function to determinate the status

isButtonDisabled = function(status) {

    const found = disabled.filter(d => { 
                      return d.text === status; 
                  });

    return found.length ? true : false
}

Usage:

if ($tipoproveedor != '0'){
    if (isButtonDisabled(f.Estatus)) { 
        tabla += ` disabled `; 
    }
}
user_26414250

After reading the question and all the answers I failed to understand why it's not working.

By saying "I have been forced to change these same values ​​for strings" if the questioner means, now the array disabled = [ "0", "2", "3", "5" ] and typeof f.Estatus === "string" then the solution is obvious.

const disabled = [ "0", "2", "3", "5" ]

if(disabled.includes(f.Estatus))
  tabla += "disabled"

user_152367610
Related