Error retrieving variable in JQuery

Question

Error retrieving variable in JQuery

Navigation

#1 by (0 votes)

1

When I set the date in #datetimepicker1 manually as in the code, it puts it right. But when I replace the date with the value of id , id is blank, and does not set. (the id of the item that was clicked on is a date of the style 20-10-2018). Without embed id in the alert it appears as a date of type 20-10-2018. I'm breaking my head with that, thinking about passing the variable by ajax for php, and a lot of things that do not seem clean to me.

$(document).ready(function(){
    var id;
    $(".cell").dblclick(function(e){
        id = e.target.id;
        $('#ModalReserva').modal('toggle'); 
        $('#datetimepicker1').datetimepicker({date: '9-10-2018'});
        alert (id);
    });
});

javascript jquery html php

asked by Sergio Cristiá 04.11.2018 в 16:47

source

1 answer

Show contents of an XML file in HTML Activate a button from another class in Android Studio

score 0 · Accepted Answer

Usually the datePicker is an element to select dates. Another thing is that you want to update it from another input (which would be something strange but good, everything is possible).

If you want to retrieve the selected date, you have to create a datepicker function in onSelect , which will receive the parameter date from the same element.

For example:

$("#myDatePicker").datepicker({
    /*Formato deseado en la salida*/
    dateFormat: "yy-mm-dd",
    onSelect: function (date) {
        console.log(date);
    }
});

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  
  <p>Fecha: <input type="text" id="myDatePicker" readonly /></p>

EDITION

Let's see something similar to what you say you have: a table where for each cell there is a specific date.

If the information is in the id of each cell (or elsewhere). It does not make any sense to open a datepicker to select something you already know.

This code shows you how to click on any cell you get the value that is in its attribute id . You can work with that value, without having to force the user to set the date again. In this case, your own table performs the same function as a datepicker would:

document.querySelectorAll(".table td").forEach(function(elem) {
  elem.addEventListener('click', getDate, false);
});

function getDate() {
  var theDate = this.id;
  console.log(theDate);
  alert(theDate);
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.2/css/bulma.min.css" rel="stylesheet" />
<table class="table is-bordered">
  <tr>
    <td id="20180101">1</td>
    <td id="20180102">2</td>
    <td id="20180103">3</td>
    <td id="20180104">4</td>
    <td id="20180105">5</td>
  </tr>
</table>