Monday, November 28, 2022
HomeWordPress Developmentjavascript - Как скачать фрагмент страницы сайта вордпресс в формате PDF

javascript – Как скачать фрагмент страницы сайта вордпресс в формате PDF


Сделал себе калькулятор на сайте вордпресс, и не получается скачать со страници сайта результат подсчетов калькулятора, в формате PDF.
Не могу найти информацию как это делать(с плагинами не хочется это делать)

Я в capabilities.php прописал jquery таким образом:
wp_enqueue_script(‘calk-js’,
get_template_directory_uri(). ‘/pub/js/calk.js’,
array(), filemtime( get_theme_file_path(‘/pub/js/calk.js’) ), true
);
Может типа этого сделать со скачиванием информации с сайта.. пока что, не получаестя..

Для теста, записал весь этот код в Visible Studio Code, там работает отлично.
скачивает в PDF формате, как положено.

Это фрагмент html калькулятора:

Услуга
Кол-во
ед. изм.
Цена (р)

Штробление стен ↓

Штроба 20х20(пенобетон)

+

м.п
0

Штроба 20х20(кирпич)

+

м.п
0

Штроба 20х20(бетон)

+

м.п
0

Штроба потолок до 20х20(бетон)

+

м.п
0

Итого:
0 руб.

Запомнить введенные данные калькулятора на странице

Обнулить калькулятор

Это jquery для калькулятора:

operate toggleCatalogBlock($btn, $block) {

$($btn).click on(operate() {
    $btn = $(this).attr("class");
    if($btn == 'show1'){$block='.t-row1'}
    if($btn == 'show2'){$block='.t-row2'}
    if($btn == 'show3'){$block='.t-row3'}
    if($btn == 'show4'){$block='.t-row4'}
    if($btn == 'show5'){$block='.t-row5'}
   if($btn == 'use-button'){return;}
   if($btn == 'per'){return;}
   
  

    var $blocks = $($block)
    if ($blocks.is(':hidden')) {
      $blocks = $($blocks.get().reverse());
      }
    
    toggleOne($blocks, 0);
  });
};

operate toggleOne(blocks, index) {
  var block = blocks.eq(index);
  if (!block.size) return; 
  block.slideToggle(50, toggleOne.bind(null, blocks, index + 1));
}

$(doc).prepared(operate() {


    toggleCatalogBlock('button')
    
    
});

var elems = doc.getElementsByTagName('button');
for (var i = 0; i < elems.size; i++) {
    elems[i].addEventListener('click on', onGreen);
}

operate onGreen() {
    this.model.backgroundColor="inexperienced"; // при первом срабатывании просто красит в красный
    this.removeEventListener('click on',onGreen ); // при последующи - удаляет саму себя (красный)
    this.addEventListener('click on', onSlategray); // ...и добавляет другой цвет (зеленый)
}

operate onSlategray() {
    this.model.backgroundColor="Slategray"; // при первом срабатывании просто красит в зеленый
    this.removeEventListener('click on', onSlategray); // при последующи - удаляет саму себя (зеленый)
    this.addEventListener('click on', onGreen); // ...и добавляет другой цвет (красный)
}

$('.minpl, enter').click on(operate() {
    /*Находим enter*/
        $enter = $(this).father or mother().discover('.quant');
        var qty = Quantity($enter.val());
    /*На случай, если количество не удалось определить (например, пользователь мог оставить поле пустым)*/
        if (isNaN(qty)) qty = 0;
        if ($(this).hasClass('plus')) {
            if (qty == 0) {
                qty = $enter.knowledge('min');
            } else {
                qty += $enter.knowledge('step');
            }
        } else {
            qty -= $enter.knowledge('step');
        }
        var min = $enter.knowledge('min');
        if (qty >= min)  {
            $enter.val(qty).set off('enter');
        } else {
             $enter.val(0).set off('enter');
        }
    /*Передаем функции подсчета, обновления*/
        updateCalc($enter);
    
    /*Обрабатываем ввод с клавиатуры */
    $('.quant').change(operate() {
        var qty = $(this).val();
        if (isNaN(qty)) qty = 0;
        var min = $(this).knowledge('min');
        var step = $(this).knowledge('step');
        if (qty > 0)  {
    /*Если вдруг число не кратно шагу, увеличиваем (только увеличение) до кратного*/
            qty = Math.ceil(qty/step)*step;
            if (qty < min) {
                qty = min;
            }
            $(this).val(qty).set off('enter');
        } else {
             $(this).val(0).set off('enter');
        }
        updateCalc($(this));
    });
    /*Считаем, обновляем значения*/
    operate updateCalc($enter){
        var qty = Quantity($enter.val());
        if (isNaN(qty)) qty = 0;
        $enter.mother and father('.t-row').discover('.value').textual content(qty * $enter.knowledge('value')/$enter.knowledge('step'));
        var itog = 0;
        $enter.mother and father('.calc').discover('.value').every(operate(){
            itog += parseInt($(this).textual content());
        });
        $enter.mother and father('.calc').subsequent().discover('.val').textual content(itog);

    }
})                

$(".use-button").click on(operate() {

    $('td').every(operate(){
        if($(this).textual content() == '0') {
          //$(this).take away();
          $(this).closest("tr").take away().replaceWith(operate(){
            return this.worth;
        });
        }
      });  
      
      $('.calc').discover('enter:textual content').replaceWith(operate(){
         $(this).closest("tr").discover(".minpl").take away().finish();
        return this.worth;
       
   }); 
    
     operate generatePDF() {
const component = doc.getElementById('bill');
html2pdf()
    .from(component)
    .save();
     }       
  /* if($btn == 'per'){
    operate ReloadButton()

{
location.href=”https://elektrik-n-spb.ru/stoimost-rabot-po-elektrike/”;
}
}*/
});

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

- Advertisment -
Google search engine

Most Popular

Recent Comments