Есть ли способ добавить арифметический оператор внутри функции в ejs? - PullRequest
0 голосов
/ 27 декабря 2018

Я создаю экспресс-приложение с формой бронирования с использованием ejs и добавляю в нее функциональность.он используется в качестве платежа.

У меня есть select tag и он хранится в переменной selected text.Запись в консоль дает значение, но использование его в реальном коде приводит к ошибке, которая говорит о том, что она не определена.

Мне нужно взять значение выбранного входа, например, 2, и умножить его насумма tour.price, например 34000, поэтому общая сумма будет 68000 и помещена в addCommas () Amount: $ <%= addCommas(34000 * 2) %> //the total should be 68000 then the function addCommas() which would make it 68,000.

Я попытался использовать тег Scriptlet 'ejs и поместил этот кодв верхней части файла

<%let selectedText = document.querySelector("#numOfPersons")%>
<%let valueOfSelected = selectedText.options[selectedText.selectedIndex].value %>    
<form>
     <div>
        <label for="numOfPersons">Number of Persons</label>
        <select id="numOfPersons">
          <option>2</option>
          <option>3</option>
          <option>4</option>
          <option>5</option>
          <option>6</option>
        </select>
      </div>

     Amount: $  <%= addCommas(tour.price * valueOfSelected) %> //addCommas() is a function that takes a number and adds comma every three numbers, ex: 100000 will become 100,000.
// tour.price is the total amount of the product. It's a Number. it's current value is 34000
</form>

Это говорит о том, что значениеOfSelected не определено.моя вторая попытка добавить <%let selectedText = document.querySelector("#numOfPersons")%> <%let valueOfSelected = selectedText.options[selectedText.selectedIndex].value %> ниже тега формы, но он также говорит, что не определено.

Затем я попытался добавить тег сценария под файлом <script> let selectedText = document.querySelector("#numOfPersons"); let valueOfSelected = selectedText.options[selectedText.selectedIndex].value; </script>

, а затем для моегопоследняя попытка, я делаю это. let totalAmount = tour.price * Number(valueOfSelected); document.querySelector("#total").innerHTML = "Amount: $ <%= addCommas(totalAmount) %>"

Все получаются не определенными

Ожидаемый результат должен привести к общей цене 68 000 $, когда <%= addCommas(tour.price * valueOfSelected) %> называется

PS. По какой-то причине я не могусоздайте другой блок кода, используя 4 пробела.

1 Ответ

0 голосов
/ 27 декабря 2018

Какие-либо операции DOM, такие как получение выделенного текста, нельзя записать непосредственно в файл ejs.Вы должны сделать это внутри тега скрипта (т.е. используя js), как при втором подходе.

Внутри скрипта попробуйте получить значения после загрузки документа:

<script>
function addCommas() { // implement the function here }
document.addEventListener("DOMContentLoaded", function(event) { 
  // get values here like the `valueOfSelected`
  var tourPrice = "<%= tour.price %>";

  var valueWithCommasAdded = addCommas(tourPrice * valueOfSelected);
  var content = document.createTextNode("Amount: " + valueWithCommasAdded);

  // Finally append to the form
  document.forms[0].appendChild(content);

});
</script>

Вы должнысделайте это, потому что вы должны ждать полной загрузки документа.Ejs будет загружен уже до того, как вы сможете получить значение из DOM.Вы должны выполнять вычисления динамически с JavaScript и поместить в DOM.

...