Ricardo Sauceda's questions

I am implementing a payment by card and I do everything that the process asks me:

Install the JS and the anti-fraud + the DEVICEHIDDENFIELNAME

<!-- Openpay Anti-fraud system-->
  <script type="text/javascript"
        src="https://js.openpay.mx/openpay.v1.min.js"></script>
<script type='text/javascript'
  src="https://js.openpay.mx/openpay-data.v1.min.js"></script>

<script type="text/javascript">
 $(document).ready(function() {
  OpenPay.setId('mikey'); //aqui todo OK
  OpenPay.setApiKey('mipk'); //aqui todo OK
  OpenPay.setSandboxMode(true);
  var deviceSessionId = OpenPay.deviceData.setup("payment-form", "deviceIdHiddenFieldName");
  });
</script>

Add the form:

<form action="#" method="POST" id="payment-form" class="hide-element form-group need-validation" novalidate>
            <input type="hidden" name="token_id" id="token_id">
            <input type="hidden" name="use_card_points" id="use_card_points" value="false">

            <div class="row">
              <div class="margin-t col-12">
                <h4><b>Aceptamos tarjetas de débito y crédito</b></h4>
              </div>
                <div class="col-4">
                  <h6>Tarjetas de crédito</h6>
                  <img src="assets/img/tarjeta-de-credito.png" class="img-tdc">
                </div>
                <div class="col-8">
                  <h6>Tarjetas de débito</h6>
                  <img src="assets/img/tarjeta-de-debito.png" class="img-tdc">
                </div>
                <div class="col-12"><br></div>
                <div class="col-6">
                  <label>Nombre del titular</label><input type="text" id="nombre_tarjeta" name="nombre_tarjeta" minlength="5" maxlength="400" class="form-control" placeholder="Como aparece en la tarjeta" autocomplete="off" data-openpay-card="holder_name" pattern="^[a-zA-Z0-9 ]*$" required>
                  <div class="valid-feedback">Correcto.</div>
                  <div class="invalid-feedback">Este dato es obligatorio. Min 5, Max 50 letras. No utilizar (*%/$+-.,').</div>
                </div>
                <div class="col-6">
                  <label>Número de tarjeta</label><input type="text" id="num_tarjeta" name="num_tarjeta" maxlength="30" class="form-control" autocomplete="off" pattern="[0-9]+"data-openpay-card="card_number" required="">
                  <div class="valid-feedback">Correcto.</div>
                  <div class="invalid-feedback">Ingresa un número de cuenta correcto, sin letras y sin espacios.</div>
                </div>
                <div class="col-12"><br></div>
                <div class="col-6">
                  <label>Fecha de expiración</label><br>
                  <input type="number" id="mes_tarjeta" name="mes_tarjeta" placeholder="Mes" max="12" step="1" class="form-control special-size rigth-marg" data-openpay-card="expiration_month"  required=""><input type="text" id="anio_tarjeta" name="anio_tarjeta" maxlength="2" class="form-control special-size" placeholder="Año" data-openpay-card="expiration_year" pattern="[0-9]+"  required="">
                  <div class="valid-feedback">Correcto.</div>
                  <div class="invalid-feedback">Ingresa un mes o año de vencimiento correcto, solo dos números para mes o año ej: 02/20 - 01/23 - 04/21.</div>
                </div>
                <div class="col-6">
                  <label>Código de seguridad</label><br>
                  <input type="text" id="cvv_tarjeta" name="cvv_tarjeta" class="form-control special-size rigth-marg" maxlength="3" placeholder="3 dígitos" autocomplete="off" data-openpay-card="cvv2" pattern="[0-9]{3}"  required=""> <img src="assets/img/cvv.png" class="img-cvv rigth-marg"> <img src="assets/img/cvv-v2.png" class="img-cvv-two ">

                   <div class="valid-feedback">Correcto.</div>
                  <div class="invalid-feedback">Ingresa un CVV correcto.</div>

                </div>
                <div class="col-12"><br></div>
                <div class="col-1"></div>
                <div class="col-5">
                  <small><b>Transacciones realizadas vía:</b></small>
                  <img src="assets/img/openpay.png" class="img-opn">
                </div>
                <div class="col-6">
                  <table style="width:100%">
                  <tr>
                    <th><img src="assets/img/secure.png" class="img-secure"></th>
                    <th class="secure-text"><small> Tus pagos se realizan de forma segura con encriptación de 256 bits.</small></th>
                  </tr>
                </table>

                </div>

              

            </div>
          </form>

2 more Javascript functions are added for the token, as you can see SUCCESS_CALLBACK is the one who assigns the TOKEN_ID and its value in the frontend:

 var success_callbak = function(response) {
    var token_id = response.data.id;
    $('#token_id').val(token_id);
    $('#payment-form').submit();
  };

  var error_callbak = function(response) {
   var desc = response.data.description != undefined ?
   response.data.description : response.message;
   alert("ERROR [" + response.status + "] " + desc);
   $("#pay-button").prop("disabled", false);
 };

When I make the token, everything works fine, the platform receives it without problems,

function formPay(){
          var holder_name = $('#nombre_tarjeta').val();
      var card_number = $('#num_tarjeta').val();
      var expiration_month = $('#mes_tarjeta').val();
      var expiration_year = $('#anio_tarjeta').val();
      var cvv  = $('#cvv_tarjeta').val();

      var address = orderDelivery.direccion + " " + orderDelivery.cp;

      var deviceIdHiddenFieldName  = $('#deviceIdHiddenFieldName').val();          
      
      /*AQUI HAGO EL TOKEN EN JS - Se activa success_callback y al ejecutarse esa function
      se asigna el token_id al INPUT OCULTO, pero a mi no me devuelve nada*/
      OpenPay.token.extractFormAndCreate('payment-form', success_callbak, error_callbak);   

      /* 
         INTENTE CON ESTE TOQUEN PERSONALIZADO PERO NO ME FUNCIONO TAMPOCO

          OpenPay.token.create({
          "card_number":card_number,
          "holder_name":holder_name,
          "expiration_year":expiration_year,
          "expiration_month":expiration_month,
          "cvv2":cvv,
        }, success_callbak, error_callbak);
      */
        //AQUI OBTENGO YO EL TOKEN_ID para mandarlo por POST con AJAX 
        var token_id  = $('#token_id').val();

        var formData = new FormData();
        formData.append('phone_number',orderDelivery.telefono);
        formData.append('holder_name',holder_name);
        formData.append('card_number',card_number);
        formData.append('expiration_month',expiration_month);
        formData.append('expiration_year',expiration_year);
        formData.append('cvv',cvv);
        formData.append('address',address);
        formData.append('amount',orderDelivery.total);
        formData.append('email',orderDelivery.correo);
        formData.append('token_id',token_id);
        formData.append('deviceIdHiddenFieldName',deviceIdHiddenFieldName);
        
        formData.append('function',"addPay");
                     
        $.ajax({
          data:  formData, //send data via AJAX
          url:   'controller/ctrlPago.php', //url file controller PHP
          dataType:'json',
          contentType: false,
          processData: false,
          type:  'post', //send POST data
          success:function(response) { //get request

            /*if(response.success){ 
              

            //CODE 
          }
        }); 

}

As you can see I need to collect the token_id , to POST IT to my PHP FILE and generate the charge, so I send my data without problems, but the charge fails because I can not CATCH the token_id

Here the PHP code:

$openpay = Openpay::getInstance('mikey','misk');

        // Establecer la zona horaria predeterminada a usar. Disponible desde PHP 5.1
        date_default_timezone_set('America/Mexico_City');

        $fecha = date("m.d.y");

        $customer = array(
             'name' => $_POST["holder_name"],
             'email' => $_POST["email"],
             'phone_number' => $_POST["phone_number"],
             'card_number' => $_POST["card_number"],
             'expiration_month' => $_POST["expiration_month"],
             'expiration_year' => $_POST["expiration_year"],
             'creation_date' => $fecha,
             'cvv2' => $_POST["cvv"],);

        $chargeData = array(
            'method' => 'card',
            'source_id' => $_POST["token_id"],
            'amount' => $_POST["amount"], // formato númerico con hasta dos dígitos decimales. 
            'description' => "Compra de comida rápida",
            'device_session_id' => $_POST["deviceIdHiddenFieldName"],
            'customer' => $customer
            );

        $charge = $openpay->charges->create($chargeData);

Cash Token:

{
    "holder_name": "MArian Miranda M",
    "card_number": "424242XXXXXX4242",
    "expiration_month": "11",
    "expiration_year": "23",
    "cvv2": "XXX"
}
Respuesta
{
    "id": "k9gzznpuhv8ankcktcbo",
    "card": {
        "card_number": "424242XXXXXX4242",
        "holder_name": "MArian Miranda M",
        "expiration_year": "23",
        "expiration_month": "11",
        "address": null,
        "creation_date": null,
        "brand": "visa",
        "points_card": true,
        "points_type": "bancomer"
    }
}

I do not understand why it does NOT obtain the token_id, if it is supposed to do the token, here are my OPENPAY CODES OF THE BAD REQUEST of the CHARGE:

CALL:

{
    "method": "card",
    "source_id": "",
    "amount": "120.00",
    "description": "Compra de comida r\u00e1pida",
    "device_session_id": "Jp74we8dc0ROf2FxeH1QGhT00Le8rGFv",
    "customer": {
        "name": "MArian Miranda M",
        "email": "[email protected]",
        "phone_number": "6654465654",
        "card_number": "424242XXXXXX4242",
        "expiration_month": "11",
        "expiration_year": "23",
        "creation_date": "09.12.20",
        "cvv2": "XXX"
    }
}

RESPONSE:

{
    "http_code": 400,
    "error_code": 1001,
    "category": "request",
    "description": "Please specify card info",
    "request_id": "2773509d-f31b-4b15-a2c5-31a593c2026e"
}

As you can see souce_id is empty, I'm 100% sure it's because I didn't send the token_id , do you see something wrong when obtaining it?

*When I debug with the browser console, everything does fine, but it seems that the SUCCESS_CALLBACK doesn't assign the EL TOKEN_ID in the form back to catch it like I do.

Settings in relation to the BUTTON

I don't have it inside the form, but I get the data from the following button:

<button id="btn_pay" class="btn btn-success hide-element" type="button" onclick="formPay()">Pagar pedido</button>

Don't add it, ignore it, but that button calls the function formPay(); which, in turn, executes my token creation code, all good up to here, because if I get the token, but then I don't know what happens to it:

With my code I create an array of Google Maps Markers, where I need pointA and pointB to paint a route on the map and calculate the kilometers.

function addMarker(location, addrs, counter) {

            if(counter <= 2){ 

                    marker = new google.maps.Marker({
                    position: location,
                    map: exports.map,
                    animation: google.maps.Animation.DROP,
                    title: "Point: "+ counter + "Address:" + addrs
                });

                exports.markers.push(marker);

            }else{
                calculateRoute();
                alert("Ya terminaste de seleccionar la ruta");

            }
        } // Sets the map on all markers in the array. 

Once I capture my 2 Markes, I would like to display and paint the path between pointA and pointB.

So, I made a function called calculateRute() where I read my array of Markers and get the position (which are my POINTO and OBPOINT coordinates), I assign it to another array where I just want to put the coordinates and show them in an ALERT (), so far so good.

function calculateRoute(){
        
        for (var i = 0; i < exports.markers.length; i++) {
            maping[i] = exports.markers[i].position;
            //show my coordenates
            alert(maping[i]);
        }

        var request = {
            origin: maping[0],
            destination: maping[1],
            travelMode: 'DRIVING'
        }

        directionsService.route(request, function(result, status){

            if (status=="OK") {

                directionsDisplay.setDirections(result);
            }
        })
    }

When we go to request and pass the attributes of the ARRAY of COORDINATES (pointA and pointB) by their position to ORIGIN and DESTINATION, IT DOES NOT SHOW ME ANYTHING.

I can't get the coordinates as such and assign them, I don't understand why it doesn't work the way I'm handling it.

Logical, in the end it only paints my two Markers and doesn't paint the route because I don't get the coordinates.

I have a form in which I am going to upload an image, HTML5 for the form, JS to get data and validation and PHP for the back.

So, I get by a function all the data of the form:

HTML5

<?php

require_once '../model/categoriaModel.php';
$dataForm = new CategoriaModel();

?>

<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <!-- Bootstrap core CSS -->
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
  <link rel="stylesheet" type="text/css" href="../assets/css/design-food-menu.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>

</head>
<body>
  
  <main role="main" class="backblack">
    <br><br>
    <div class="container ">
      <h2 class="featurette-heading">Capturar <span class="text-muted">Nuevo Producto o Platillo.</span></h2>
      <p class="lead">Todos los campos con * son obligatorios. Captura la información de manera correcta.</p>
      <br>
      <form id="contact" enctype="multipart/form-data" method="post" class="needs-validation" novalidate>

        <div class="row">

          <div class="col-md-6">
            <label for="telefono">Imagen del Producto (500px * 500px)</label>
            <img src="../assets/img/not_found.jpg" class="img_n_f" id="output">
            <div class="upload-btn-wrapper">
              <a class="upload-btn text-center text-white" >Upload a file</a>

              <input type="file" name="url_img" id="url_img" style="width: 100%;" onchange="document.getElementById('output').src = window.URL.createObjectURL(this.files[0])" />
              
            </div>
          </div>

          <div class="col-md-6">

            <div class="form-group">
              <label for="nombre">Nombre del Producto o Platillo</label>
              <input type="text" class="form-control" id="nombre_producto" placeholder="ej: Pasta Alfredo" name="nombre_producto" minlength="4" maxlength="250" required pattern="^[a-zA-Z0-9 ]*$">
              <div class="valid-feedback">Correcto.</div>
              <div class="invalid-feedback">Ingresa un nombre de producto correcto. No aceptamos puros espacios en blanco. Min 5 Max 250 caracteres. No usar (*%/$+-.,).</div>
            </div>
            <div class="form-group">
              <label for="empresa">Descripción General</label>
              <input type="text" class="form-control" id="descripcion_producto" placeholder="ej: La Pasta Alfredo consiste en una técnica de ....." name="descripcion_producto" minlength="5" maxlength="500" required pattern="^[a-zA-Z0-9 ]*$">
              <div class="valid-feedback">Correcto.</div>
              <div class="invalid-feedback">Ingresa una descripción correcta. No aceptamos puros espacios en blanco. Min 5 Max 500 caracteres. No usar (*%/$+-.,).</div>
            </div>

            <div class="form-group">
              <label for="servicio">Categoria del Producto</label>
              <select class="form-control" id="id_categoria" name="id_categoria" required>
                <option value="">Selecciona la categoria del producto...</option>
                <?php
                $dataForm->getCategoria();
                ?>
              </select>
              <div class="valid-feedback">Correcto.</div>
              <div class="invalid-feedback">Selecciona una opción...</div>
            </div>

            <div class="form-group">
              <label for="tipo_descuento">Tipo de Descuento</label><br>
              <input type="radio" name="descuento" value="pesos"> desc en $ <input type="radio" name="descuento" value="porcentaje"> desc en %  <input type="radio" name="descuento" value="ninguno"> sin descuento

              <div class="valid-feedback">Correcto.</div>
              <div class="invalid-feedback">Selecciona una opción...</div>
            </div>
            <div class="form-group" id="descHide">
              <label for="desc_total">Descuento del Producto</label>
              <input class="form-control" type="number" id="desc_total" name="desc_total" pattern="[0-9]{10}" value="0" min="-9999" max="0">
              <div class="valid-feedback">Correcto.</div>
              <div class="invalid-feedback">Ingresa un descuento correcto, no aceptamos letras, o caracteres extraños.</div>
            </div>
            <div class="form-group">
              <label for="telefono">Precio del Producto</label>
              <input class="form-control" type="number" id="precio_producto" name="precio_producto" placeholder="ej: 250" pattern="[0-9]{10}" required>
              <div class="valid-feedback">Correcto.</div>
              <div class="invalid-feedback">Ingresa un precio correcto, no aceptamos letras, o caracteres extraños.</div>
            </div>

            <a onclick="sendForm(this)" class="btn btn-success text-white shadow-lg btn-lg">Guardar</a>

          </div>
          
        </div>
      </form>
      <br><br><br>
    </div>

  </main>

  <!-- SUCCESS / FAIL ACTION MODAL -->
  
  <div class="modal fade" id="actionModal" tabindex="-1">
    <div class="modal-dialog">
      <div class="modal-content">

        <!-- Modal Header -->
        <div class="modal-header">
          <h2 class="modal-title"><p id="successModalTitle"></p></h2>
          <button type="button" class="close" data-dismiss="modal">&times;</button>
        </div>
        <form>
          <!-- Modal body -->
          <div class="modal-body">
            <p id="successModalDescription"></p>
          </div>

          <!-- Modal footer -->
          <div class="modal-footer">
            <button class="btn btn-success" type="button" data-dismiss="modal" onclick="this.form.reset();">Continuar</button>
          </div>
        </form>
      </div>
    </div>
  </div>

  <footer class="text-muted bg-white">
    <div class="container">
      <br>
      <p class="float-right">
        <a href="#" class="text-warning">Volver al Principio</a>
      </p>
        <br>
      </div>
    </footer>

    <script src="../assets/jquery/jquery.min.js"></script>
    <script type="text/javascript" src="../assets/js/producto.js"></script>
    <script src="../assets/js/bootstrap.bundle.min.js"></script>

    <!-- Core plugin JavaScript-->
    <script src="../assets/jquery-easing/jquery.easing.min.js"></script>
  </body>
  </html>

And then via Jquery I get the data, validate and send via AJAX to PHP as follows:

// Disable form submissions if there are invalid fields
function sendForm(){ 
    // Get the forms we want to add validation styles to
    var forms = document.getElementsByClassName('needs-validation');
    // Loop over them and prevent submission
    var validation = Array.prototype.filter.call(forms, function(form) {

        if (form.checkValidity() === false) {
          //$('#actionModal').modal('toggle');
          event.preventDefault();
          event.stopPropagation();

        }else{
          var id_categoria = $("#id_categoria option:selected").val();
          var nombre_producto = $("#nombre_producto").val();
          var descripcion_producto = $("#descripcion_producto").val();
          var url_img = $('#url_img').prop('files')[0];
          //var url_img = $('#url_img')[0].files[0];
          var precio_producto = $("#precio_producto").val();
          var desc_total = $("#desc_total").val();
          var tipo_descuento = $("input[name='descuento']:checked").val();

          if(tipo_descuento=="ninguno"){
            var tipo_descuento = "0";
          }else if(tipo_descuento=="porcentaje"){
            var tipo_descuento = "1";
          }else if(tipo_descuento=="pesos"){
            var tipo_descuento = "2";
          }

            //alert('-> ' + id_categoria + ', ' + nombre_producto + ', ' + url_img + ', ' +tipo_descuento + ', ' + descripcion_producto );

          var formData = new FormData();

          formData.append('id_categoria',id_categoria);
          formData.append('nombre_producto',nombre_producto);
          formData.append('descripcion_producto',descripcion_producto);
          formData.append('archivo',url_img);
          formData.append('precio_producto',precio_producto);
          formData.append('desc_total',desc_total);
          formData.append('tipo_descuento',tipo_descuento);
          formData.append('function',"addDataForm");

          $.ajax({
              data:  formData, //send data via AJAX
              url:   '../controller/ctrlProducto.php', //url file controller PHP
              dataType:'json',
              contentType: false,
              processData: false,
              type:  'post', //send POST data
              success:function(response) { //get request
                
              if(response.success){ 
                $("#successModalTitle").html("<i class='fas fa-check-circle color-success'></i> ¡Éxito!");
                $("#successModalDescription").html(response.message);
                $("#contact").trigger("reset");
                $("#contact").removeClass("was-validated");
              }else{
                $("#successModalTitle").html("<i class='fas fa-exclamation-circle color-error'></i> ¡Error!");
                $("#successModalDescription").html(response.message);
              }
                
                $('#actionModal').modal('toggle');      
              }
          });

        }
        form.classList.add('was-validated');
    });

}

and already in PHP, I do the following, which is really, insert data, save the image and the PHP returns a JSON with 2 attributes to my AJAX request, so that I can read it in JS and assign a SUCCESS message to my MODAL and show it.

$nombre = $_FILES['archivo']['name'];
                //$ruta = $_FILES['archivo']['tmp_name'];
        $url_imagen = "../assets/img/productos/" . $nombre;

        if (move_uploaded_file($_FILES["archivo"]["tmp_name"], $url_imagen)) {
            print_r("El Archivo ha sido subido correctamente.");    
        } else {
            print_r("Lo sentimos, hubo un error subiendo el archivo.");
        }
    
        require_once 'conn/connection.php';
        $connect = new connection();
        $connection=$connect->connections();

        $sql = "INSERT INTO producto (id_categoria, nombre_producto, descripcion_producto, url_imagen, precio_producto, desc_total, tipo_descuento, f_creacion, f_actualizacion, status) VALUES ('".$_POST['id_categoria'] ."','".$_POST['nombre_producto']."','".$_POST['descripcion_producto']."','".$nombre."','".$_POST['precio_producto']."','".$_POST['desc_total']."','".$_POST['tipo_descuento']."','".date('Y-m-d H:i:s')."','".date('Y-m-d H:i:s')."', '1');";

        //print_r($sql);
        $jsondata = array();

        if ($connection->query($sql)===true) {
            $message= "Tu información ha sido enviada correctamente.";
            $jsondata['success'] = true;
            $jsondata['message'] = $message;

        } else {
            $message= "Hemos tenido un problema al guardar un información, contacta al servicio técnico.";
            $jsondata['success'] = false;
            $jsondata['message'] = $message;
        }
                //Aunque el content-type no sea un problema en la mayoría de casos, es recomendable especificarlo
        header('Content-type: application/json; charset=utf-8');

        echo json_encode($jsondata, JSON_FORCE_OBJECT);

The INSERT code is fine, it saves the image fine, BUT IT DOES NOT RETURN THE RESPONSE, in the console I see the response, but the MODAL is never activated.

I have a system in which I send an email when I assign a job to an employee, the code is as follows:

$para      = $correo;
            $titulo    = 'Nuevo Servicio';

            $mensaje = '
            <html>
                <head>
                <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
                    <title>Nuevo Servicio</title>
                </head>
                <body>
                    <div>
                    <p>Tienes un nuevo servicio en tu bandeja de entrada, verificalo en el sistema: <b><a href="web.com">web.com</a></b></p>
                    </div>
                </body>
            </html>';

            $cabeceras = 'From: [email protected]' . "\r\n" .
                'Reply-To: [email protected]' . "\r\n" .
                'X-Mailer: PHP/' . phpversion();

            $success = mail($para, $titulo, $mensaje, $cabeceras);

And it seems that everything is fine, but the mail that arrives looks like this:

It doesn't respect my HTML code at all

I have a doubt, I want to change the header logo in different URLs in wordpress, for example, a logo in CONTACT, another in ABOUT, another in SERVICES and I have built this code but it does not work very well, in fact it does not work, it does not change the picture. This is the URL I am validating in the code below: https://mypage.com/daewoo

function change_logo_on_single($html) {

   if(is_page('daewoo')){
      $html = preg_replace('/<img(.*?)\/>/', '<img src="https://mipagina.com/wp-content/uploads/2019/11/serv_03.png" class="custom-logo" alt="" itemprop="logo" />', $html);
   }

   return $html;
}

add_filter('get_custom_logo','change_logo_on_single');

I have a system where I am using AJAX to insert data,

$.ajax({
        data:  formData, //send data via AJAX
        url:   '../controller/serviceController.php', //url file controller PHP
        dataType: 'text', // what to expect back from the server
        cache: false,
        contentType: false,
        processData: false,
        type:  'post', //send POST data
        beforeSend: function () {
          document.getElementById("load").style.display = "block";
        },
        success:  function (response) { //get request

        var confirm = response.success;

        if(confirm){ 
          $("#successModalTitle").html("<i class='fas fa-check-circle color-success'></i> ¡Success!");
          $("#successModalDescription").html(response.message);
        }else{
          $("#successModalTitle").html("<i class='fas fa-exclamation-circle color-error'></i> ¡Error!");
          $("#successModalDescription").html(response.message);
        }

          //alert(response.message);
          $('#actionModal').modal('toggle');
          $('#services').DataTable().ajax.reload();
          $('.close').click(); 

        }
      });

I send it all the data I need in my PHP file, I go to the PHP file, I create variables that I am going to use and I insert my data, THE QUERY IS CORRECT because it does INSERT,

$name = $_POST['name'];
        $cost = $_POST['cost'];
        $desc = $_POST['desc'];
        $id_tipo_servicio = $_POST['id_tipo_servicio'];
        $date = date("Y-m-d");
        $iva = 0;
        $status = 1;

        $nombre = $_FILES['archivo']['name'];
        //$ruta = $_FILES['archivo']['tmp_name'];
        $destino = ".../img/" . $nombre;

        require_once 'conn/connection.php';
        $connect = new connection();
        $connection=$connect->connections();


        $sql = "INSERT INTO servicios (id_tipo_servicio, ser_nombre, ser_descripcion, ser_img_url, ser_precio, ser_fecha_creacion, ser_fecha_actualizacion, ser_iva, ser_status) VALUES ('".$id_tipo_servicio ."','".$name."','".$desc."','".$destino."','".$cost."','".$date ."', '".$date."', '".$iva."', '".$status."');";


        $jsondata = array();

        $insert = $connection->query($sql);

        var_dump($insert);

        if ($insert===true) {
            $jsondata['success'] = true;
            $jsondata['message'] = 'Felicidades! Has insertado el Servicio con Éxito.';

        } else {
            $jsondata['success'] = false;
            $jsondata['message'] = 'Error! Ha ocurrido un error, avisa a un administrador.';
        }
        //Aunque el content-type no sea un problema en la mayoría de casos, es recomendable especificarlo
        header('Content-type: application/json; charset=utf-8');

        echo json_encode($jsondata, JSON_FORCE_OBJECT);

So, having this correct, I do an IF, where I assign values ​​to the ARRAY that my PHP returns in JSON format so that my AJAX can READ it back.

$insert = $connection->query($sql);

        var_dump($insert);

        if ($insert===true) {
            $jsondata['success'] = true;
            $jsondata['message'] = 'Felicidades! Has insertado el Servicio con Éxito.';

        } else {
            $jsondata['success'] = false;
            $jsondata['message'] = 'Error! Ha ocurrido un error, avisa a un administrador.';
        }

So when I'm back in the AJAX, instead of showing the PHP results, it shows my error alert,

But the ANSWER IS CORRECT. The AJAX must have entered this part of the code

 var confirm = response.success;
if(confirm){ 
          $("#successModalTitle").html("<i class='fas fa-check-circle color-success'></i> ¡Success!");
          $("#successModalDescription").html(response.message);
        }

BUT IT'S NOT LIKE THAT. It enters the ERROR section and it does not show me the description of the response.

I have a form where I want to upload images, I have read about it and I am trying withHTML5 + AJAX + JQUERY + PHP

So I have the following code belongs to a MODAL where I am going to capture the form data:

FORM

<form id="myForm" enctype="multipart/form-data" method="post">
    <!-- Modal body -->
    <br>
    <img src="../img/img-services/img-service-2.jpg" class="rounded mx-auto d-block" alt="Cinque Terre" width="100" height="100"> 
    <br>
    <div class="upload-btn-wrapper">
      <button class="upload-btn">Upload a file</button>
      <input type="file" name="img_url" id="img_url" />
    </div>
    <div class="modal-body">

      <input type="text" id="id" name="id" value="" hidden required="">
      <label>Service Name</label>
      <input type="text" id="name" name="name" value=""  onkeypress="return soloLetras(event)" onblur="limpia()" class="form-control validate" required="" placeholder="Enter Service Name">
      <p id="errorName" style="color:red; display: none;"></p>
      <label>Service Type</label>
      <select class="form-control" id="id_tipo_servicio" name="id_tipo_servicio">
        <option value="0">Select option...</option>
        <?php
          while ($valores = mysqli_fetch_array($result)) {
            echo '<option value="'.$valores[id_tipo_servicio].'">'.$valores[ts_nombre].'</option>';
          }
        ?>
      </select>
      <p id="errorSelect" style="color:red; display: none;"></p>
      <label>Description</label>
      <textarea id="desc" name="desc" class="form-control validate" required="" placeholder="Enter Service Description"></textarea>
      <p id="errorDesc" style="color:red; display: none;"></p>
      <label>Cost</label>
      <input type="number" id="cost" name="cost" value="" class="form-control validate" required="" placeholder="Enter Cost">
      <p id="errorCost" style="color:red; display: none;"></p>
      <div class="spinner-grow text-primary" style="display: none;" role="status" id="showLoad">
        <span class="sr-only">Loading...</span>
      </div>
    </div>

    <!-- Modal footer -->
    <div class="modal-footer">
      <button type="button" class="btn btn-success" id="saveButton" onclick="doAction()" style="display: none"><span id="load" class="spinner-border spinner-border-sm" role="status" style="display: none" aria-hidden="true"></span> Save</button>

      <button type="button" class="btn btn-warning" id="edithButton" style="color:white;" onclick="doAction()" >Edith</button>

      <button type="button" class="btn btn-danger" data-dismiss="modal" >Cancel</button>
    </div>

Here is the JS file, where by JQUERY I obtain the data that the user leaves me, I assign them to their variables, valid, I make a formData and I send it in AJAX:

function doAction(){

  var id_servicio = $('#id')[0].value;
  var id_tipo_servicio = $('#id_tipo_servicio')[0].value;
  var name = $('#name')[0].value;
  var desc = $('#desc')[0].value;
  var cost = $('#cost')[0].value;
  var img_url = $('#img_url').prop('files')[0];

    //insert
    console.log("INSERT - nombre: " + name + "desc: " + desc + "precio: " + cost + "id_tipo_servicio " + id_tipo_servicio);

    if(name === ""){ 
      $( "#name" ).focus();
      //document.getElementById("errorName").innerHTML = "Service Name is Required";
      $("#errorName").show();
      $("#errorName").html("Service Name is Required");
    }else if(id_tipo_servicio === "" || id_tipo_servicio === "0"){
      $( "#id_tipo_servicio" ).focus();
      //document.getElementById("errorName").innerHTML = "Service Name is Required";
      $("#errorName").hide();
      $("#errorSelect").show();
      $("#errorSelect").html("Service Type is Required");
    }else if(desc === "" || desc === "0"){
      $( "#desc" ).focus();
      $("#errorSelect").hide();
      $("#errorDesc").show();
      //document.getElementById("errorDesc").innerHTML = "Service Description is Required";
       $("#errorDesc").html("Service Name is Required");
    }else if(cost === "" || cost === "0"){
      $( "#cost" ).focus();
      $("#errorDesc").hide();
      $("#errorCost").show();
      //document.getElementById("errorCost").innerHTML = "Service Cost is Required";
      $("#errorCost").html("Service Cost is Required");

    }else{

      var formData = new FormData();

      formData.append('name',name);
      formData.append('id_tipo_servicio',id_tipo_servicio);
      formData.append('desc',desc);
      formData.append('cost',cost);
      formData.append('archivo',img_url);
      formData.append('function',"addService");

      $.ajax({
        data:  formData, //send data via AJAX
        url:   '../controller/serviceController.php', //url file controller PHP
        dataType: 'text', // what to expect back from the server
        cache: false,
        contentType: false,
        processData: false,
        type:  'post', //send POST data
        beforeSend: function () {
          document.getElementById("load").style.display = "block";
        },
        success:  function (response) { //get request

        if(response.success){ 
          $("#successModalTitle").html("<i class='fas fa-check-circle color-success'></i> ¡Success!");
        }else{
          $("#successModalTitle").html("<i class='fas fa-exclamation-circle color-error'></i> ¡Error!");
        }
          $("#successModalDescription").html(response.message);

          //alert(response.message);
          $('#actionModal').modal('toggle');
          $('#services').DataTable().ajax.reload();
          $('.close').click(); 

        }
      });


      } 
}

And on this side is the PHP, where I receive the AJAX loaded with the DataForm, assign a value to their respective variables, connect to the database, build the INSERT and execute it ../controller/serviceController.php :

if(isset($_POST['function']) && !empty($_POST['function'])) {

    $function = $_POST['function'];


    //En función del parámetro que nos llegue ejecutamos una función u otra
    switch($function) {

    case 'addService':
            # code...
            $name = $_POST['name'];
            $cost = $_POST['cost'];
            $desc = $_POST['desc'];
            $id_tipo_servicio = $_POST['id_tipo_servicio'];
            $date = date("Y-m-d");
            $iva = 0;
            $status = 1;

            $nombre = $_FILES['archivo']['name'];
            $ruta = $_FILES['archivo']['tmp_name'];
            $destino = ".../img/" . $nombre;

            require_once 'conn/connection.php';
            $connect = new connection();
            $connection=$connect->connections();


            $sql = "INSERT INTO servicios (id_tipo_servicio, ser_nombre, ser_descripcion, ser_img_url, ser_precio, ser_fecha_creacion, ser_fecha_actualizacion, ser_iva, ser_status) VALUES ('".$id_tipo_servicio ."','".$name."','".$desc."','".$destino."','".$cost."','".$date ."', '".$date."', '".$iva."', '".$status."');";


            $jsondata = array();

            if ($connection->query($sql)===true) {
                $jsondata['success'] = true;
                $jsondata['message'] = 'Felicidades! Has insertado el Servicio con Éxito.';

            } else {
                $jsondata['success'] = false;
                $jsondata['message'] = 'Error! Ha ocurrido un error, avisa a un administrador.';
            }
            //Aunque el content-type no sea un problema en la mayoría de casos, es recomendable especificarlo
            header('Content-type: application/json; charset=utf-8');

            echo json_encode($jsondata, JSON_FORCE_OBJECT);


            break;
}
}

What does the code do?

The code collects the data from the HTML, it goes to the JS loaded with data, I build a DataForm, I fill it out and this goes to AJAX, it sends it and now in PHP is where there is an error and it's weird because, IF IT INSERTS, BUT IT DOES NOT RETURN ME A SUCCESS MESSAGE, the PHP returns a false and returns an ERROR. I insist, but if INSERT.

I really don't know why it doesn't return TRUE if it doesn't have problems when INSERT , now I haven't been able to save the file to the server either.

so insert

And this is the ERROR that my dashboard shows and this is the strange thing because it is HOW ELSE IT WILL ENTER THE IF

I want to go from the terminal to the htdocs package and then to my code package.

but when entering cd opt , it doesn't work, when inspecting the package it shows me the following path: nfs://192.168.64.2/opt/lampp/htdocs but in none of those paths it gives me access.

This is the XAMPP panel where it shows the path where the packages are mounted.

I also attach the full path of the folder: nfs://192.168.64.2/opt/lampp/htdocs/crm

I want a video to play automatically on my website, for now I have the following code:

<video width="440px" loop="true" autoplay="autoplay" controls>
  <source src="src="http:tuvideo.com/mivideo.mp4"" type="video/mp4">
</video>

I hope you can collaborate. It doesn't matter that we have to insert Javascript. Greetings.

Sometimes we are asked in an HTML form to list the characteristics of an element in 1 on checkboxes . Example:

Select 1 with areas of interest for your job application.

Then we must obtain the C/U ID of the areas of interest that you select and validate if at least 1 checkbox has been selected.

How do I do it?

I have an example PATH route:

C:\Users\ritchie\Documents\NetBeansProjects\Lavisa\build\web\upload\2.jpg

And I want to save it in:

C:\Users\ritchie\Documents\NetBeansProjects\Lavisa\build\web\imagenes

How can I copy that image to another directory with JAVA?.

I have a function:

<input class="tf w-input" id="txtMsj" name="txtMsj" maxlength="256" placeholder="Identificación" type="text">
<input class="bn naranja w-button"  onclick="goto('frm')" value="Siguiente">

goto( doc ){
var txtMsj  document.getElementById("txtMsj").value;
}

That helps me to get the text from the screen but I don't know how to validate the special characters -> [?!))$&.'!"@&] with regular expressions.

From a screen I get the IDand the VALORof a group of INPUT TEXTwith the following code:

   var docs = document.getElementsByName('ftp_desc');

    for (var i = 0; i < docs.length; i++){

        console.log('id: ' + docs[i].id + ',' + 'value: ' + docs[i].value);
    }

 <input id="1" name="ftp_desc"  maxlength="256" placeholder="Añade una descripción" required="required" type="text">
 <input id="2" name="ftp_desc"  maxlength="256" placeholder="Añade una descripción" required="required" type="text">
 <input id="3" name="ftp_desc"  maxlength="256" placeholder="Añade una descripción" required="required" type="text">

How can I make a STRING from the array of the IDs and one of the VALUEs?

Example:

var ids = "1,2,3";
var values = "Desc1,Desc2,Desc3"

I am making a screen that adds images to the database and after doing so, I list them by adding a text box in which I am going to capture their DESCRIPTION, example:

<form>
    <input id="1" name="ftp_desc"  maxlength="256" placeholder="Añade una descripción" required="required" type="text">
    <input id="2" name="ftp_desc"  maxlength="256" placeholder="Añade una descripción" required="required" type="text">
    <input id="3" name="ftp_desc"  maxlength="256" placeholder="Añade una descripción" required="required" type="text">
</form>

<a type="button" onclick="javascript: agregarPasoDieciseis()">Finalizar</a>

JavaScript

function agregarPasoDieciseis() {

    var descripcion = document.getElementsByName("ftp_desc").value;        
    alert(descripcion);
}

As I get the ID and the VALUE of the input with Javascript, the previous code did not work for me.

With this code I can select the link, show its value in INPUT TEXTit and not repeat them in the array obtained at the end.

My question is the following:

If I press the link the first time, it SHOWS ITS TEXT IN THE INPUT TEXT. How can I clear the link text if the link is selected a second time?

var arrDatos = new Array();

function add(x) {

  var txtInput = document.getElementById('node');
  var strValor = x.innerHTML;

  arrDatos.pushIfNotExist(strValor, function(e) {
    return e === strValor;
  });


  txtInput.value = arrDatos.toString();

}

Array.prototype.inArray = function(comparer) {
  for (var i = 0; i < this.length; i++) {
    if (comparer(this[i])) return true;
  }
  return false;
};

Array.prototype.pushIfNotExist = function(element, comparer) {
  if (!this.inArray(comparer)) {
    this.push(element);
  }
};

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<input class="tf w-input" id="node" maxlength="256" placeholder="Vida nocturna, el aeropuerto " type="text" size="200">

<a class="btn desc fav w-button" id="parque1" name="parque" onclick="add(this);">PARQUE</a>

<a class="btn desc fav w-button" id="parque2" name="parque" onclick="add(this);">CENTRO COMERCIAL</a>

<a class="btn desc fav w-button" id="parque3" name="parque" onclick="add(this);">GYM</a>

I hope you can help me with your support. In this screen I can select both LABELS only 1 time each and show the text of the Park label in the INPUT TEXT.

I MENTIONED THAT IT IS ALREADY VALIDATED SO IT DOESN'T REPEAT THE SAME LABEL TWICE IN THE INPUT TEXT, example "Park, Park", but when I obtain the data, that is, the Arrangement of selected labels, it DOES ADD THE LABEL THAT WAS SELECTED TWICE "{1,1}" and should only have it 1 times that value.

This is the code I did:

function changeColor_1(x)
{
    array_valores2.push(x.innerHTML);
    array_ids2.push(x.id);

    var txtInput = document.getElementById('node2');
    var strValor = x.innerHTML;

    arrDatos2.pushIfNotExist(strValor, function (e) {
        return e === strValor;
    });

    txtInput.value = arrDatos2.toString();
}

out.println("<a class=\"btn desc fav w-button\" id=\"" + tipo.getCosa_id() + "\" name=\"parque\" onclick=\"javascript: changeColor_1(this)\" >" + tipo.getCosa_nom() + "</a>");

<input class="tf w-input" id="node2" maxlength="256" placeholder="Vida nocturna, el aeropuerto " type="text" required>

Thanks for your support!

I have 3 fields, day, start time and end time.

I want to validate that the time is between 09:00 and 12:00 for the start time and 13:00 - 18:00 for the end time, the problem is that I need to validate with HH:MM:SS format and is an INPUT text.

<div>
   <select class="dia sel tf w-select" data-name="Selecciona Una Opcion 2" id="txtTipoPropiedad" name="txtTipoPropiedad">
       <option value="0" selected>Día</option>
       <% for (int i = 0; i < dia.length; i++) {                                                    
            out.println("<option value=\"1\">" + dia[i] + "</option>");
          }
       %>
   </select>
   <input class="porc right tf w-input" id="node_i" maxlength="256" name="h_ini" placeholder="09:00 - 12:00 hrs" required="required" type="text">
   <input class="porc right tf w-input" id="node_f" maxlength="256" name="h_fin" placeholder="13 - 18:00 hrs" required="required" type="text">
</div>

good night!

I have three stringsString cosa1 = request.getParameter("cosa1").toString(); -> SALIDAS con números aleatorios (**LOS NÚMEROS SON IDS DE PRODUCTOS**): 4,3 - 3,4,5 - 1,5,4

I want to pass that data to three INT arrays in Java, I try this and it doesn't work:

String cosa1 = request.getParameter("cosa1").toString();
String cosa2 = request.getParameter("cosa2").toString();
String cosa3 = request.getParameter("cosa3").toString();
int cosa_1 = Integer.parseInt("cosa1");
int cosa_2 = Integer.parseInt("cosa2");
int cosa_3 = Integer.parseInt("cosa3");

It sends me the following error:

org.apache.jasper.JasperException: Ha sucedido una excepción al procesar la página JSP /registro/18-paso-23.jsp en línea 35

32:             String cosa1 = request.getParameter("cosa1").toString();
33:             String cosa2 = request.getParameter("cosa2").toString();
34:             String cosa3 = request.getParameter("cosa3").toString();
35:             int cosa_1 = Integer.parseInt("cosa1");
36:             int cosa_2 = Integer.parseInt("cosa2");
37:             int cosa_3 = Integer.parseInt("cosa3");

I hope you can help me, I already tried and I can't get my array of integers.

I have a group of labels and I want that when I select 1 or several, the VALUES of each of the labels are displayed in an INPUT TEXT. With this code I can already show ONLY 1 OF THE LABELS, I still can't get the value of more than 2 labels<a>

<input class="tf w-input" id="node" maxlength="256" placeholder="Vida nocturna, el aeropuerto " type="text">

<a class="btn desc fav w-button" id="parque" name="parque" onclick = "add(this);" >PARQUE</a> 

<a class="btn desc fav w-button" id="parque" name="parque" onclick = "add(this);">CENTRO COMERCIAL</a>

<a class="btn desc fav w-button" id="parque" name="parque" onclick = "add(this);">GYM</a>

This is the Javascript function with which I get the value only from PARK, the other values ​​I cannot show.

function add(x)
{

    var valor = document.getElementById("parque").innerHTML;
    document.interes.node.value = valor;                            

}

I hope you can support me, I appreciate it.

I WANT TO ACCESS TO time, home_scorer, score, away_scorer AND I CA N'T GIVE IT :/ THANK YOU FOR YOUR HELP!

[

    {

        "match_id":"119596",
        "country_id":"169",
        "country_name":"England",
        "league_id":"62",
        "league_name":"Premier League",
        "match_date":"2016-10-30",
        "match_status":"FT",
        "match_time":"18:00",
        "match_hometeam_name":"Southampton",
        "match_hometeam_score":"0",
        "match_awayteam_name":"Chelsea",
        "match_awayteam_score":"2",
        "match_live":"1",
        "goalscorer": [
            {
                "time":"6'",
                "home_scorer":"",
                "score":"0 - 1",
                "away_scorer":"E.  Eden Hazard"
            },
            {
                "time":"55'",
                "home_scorer":"",
                "score":"0 - 2",
                "away_scorer":"D.  Diego  Costa"
            }
        ]
    }
]