Блог

Главная - Вопросы по программированию - Как я могу изменить свою ссылку API с помощью средства выбора даты

Как я могу изменить свою ссылку API с помощью средства выбора даты

#javascript #jquery #ajax

Вопрос:

В настоящее время моя ссылка на api является динамической, если выбрать текущий год и месяц.

Пример: APILINK…/202109

Эта часть в порядке… Но то, что я хочу сделать, это изменить последнюю часть ссылки API (Год и месяц) с помощью указателя даты, и я не уверен, как я могу это сделать.

Мой текущий Код:

 const timehsheetUrl = "API LINK"
const today = new Date();
const date = today.getFullYear() ('0'   (today.getMonth()   1)).slice(-2);
const settings = {
    "async": true,
    "crossDomain": true,
    "url": timesleetUrl   date,
    "method": "GET",
    "headers": {}
}

Комментарии:

1. Какой датапикер вы используете?

2. @MukeshSinghThakur В настоящее время по умолчанию используется HTML <тип ввода=»дата»/> средство выбора даты. Но я предполагаю, что если я хочу просто указать год и месяц, это должен быть пользовательский выбор даты?

Ответ №1:

Нет, вам не нужно использовать плагин datepicker, в то время как плагин более удобен.

Вот пример ввода даты в формате HTML по умолчанию.

 const timesleetUrl = "API LINK";
const today = new Date();
function urlDateSuffix(_date) {
  return  _date.getFullYear() ('0'   (_date.getMonth()   1)).slice(-2);
}

let settings = {
    "async": true,
    "crossDomain": true,
    "url": timesleetUrl   urlDateSuffix(today),
    "method": "GET",
    "headers": {}
}
console.log(settings);

$(function() {
  $('#datepicker').change(function() {
    settings.url = timesleetUrl   urlDateSuffix(new Date(this.value));
    console.log(settings);
    alert(settings.url);
  });
}); 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="date" id="datepicker">

Комментарии:

1. Есть ли способ изменить ссылку после загрузки html-страницы? Потому что ваш код работает идеально, но проблема в том, что содержимое не меняется, а регистрируется.

2. @Gabe В части инициализации — let settings = {...} — settings.url будет начинаться с timesleetUrl urlDateSuffix(today) 🙂

3. О, извините, позвольте мне поправиться. Я имею в виду, что ссылка успешно меняется, но я использую диаграммы Apex с этой функцией. Поэтому я не уверен, почему после первой загрузки содержимого я не могу обновить уже отрисованные диаграммы.

4. @Gabe document.onload = function(){...} может быть первым шансом изменить исходный URL-адрес. В вашем случае я не уверен, как вы написали код для ApexChart, но, по моему опыту, метод обновления набора данных будет существовать.

Ответ №2:

Это простое в использовании средство выбора даты jQuery.

При выборе даты сценарий должен возвращать месяц и год выбранной даты.

Сохраните выходные данные в переменной и формате. Приведенный ниже код поможет вам

 // html markup, use jQuery UI CDN in head section
<input type="text" id="calendar" name="date1"/>
// html markup

<script>
$('#calendar').datepicker({
    dateFormat: 'yy-m-d',
    inline: true,
    onSelect: function(dateText, inst) { 
        var date = $(this).datepicker('getDate'),
            day  = date.getDate(),  
            month = date.getMonth()   1,              
            year =  date.getFullYear();
         // alert(day   '-'   month   '-'   year);
         // this is your result
         alert( "api link is   " "APILINK.../" year month);
    }
});
</script>
Метки: