forumularz obliczeniowy HTML

Question

Witam. Potrzebuje stowrzyc stworzyc kalkulator w html na podstawie obrazka. Moglby ktos podpowiedzieć od czego zaczać ? Pozdrawiam 

 

ps. cos na wzor takiego kalkulatora https://codepen.io/ChrisofArabia/pen/ZwMzmq

Comments

ps. cos na wzor takiego kalkulatora https://codepen.io/ChrisofArabia/pen/ZwMzmq

przecież sam sobie znalazłeś gotowca Kolego :)

---

no tak troche poszperalem ale nie wiem jak go edytowac pod siebie 

---

oki, ale napisz konkretnie w którym miejscu masz problem, bo niezbyt wiadomo nawet jak Ci pomóc?

Napierw po prostu pobierz wartości z tych trzech inputów, pamiętaj aby je przekonwertować do number i odpowiednio zwalidować (tu już nie ma jednej, uniwersalnej metody, nie wiemy co dokładnie chcesz zrobić) i następnie wykonaj zwykłe operacje matematyczne a*b*c/1000 i ewentualnie możesz dać jakiś toFixed itp., zalezy jak ma ten wynik wyglądać (tu też zero informacji).

---

https://codepen.io/nichustm/pen/YgKgBN skonczylem tutaj i dalej na chiny ludowe nie wiem co dalej robic :D

---

proszę, tak na szybko więc kod nie jest idealny, ale do nauki powinien być oki: https://codepen.io/anon/pen/BbajBr?editors=1010

Ponierasz referencje do tych inputów, mapujesz wartości na Number, robisz iloczyn ze wszystkich wartości i dzielisz przez 1000. Ja założyłem, że mamy N elementów do przemnożenia, możesz sobie zrobić na sztywno 3 wartości i je mnożyć zamiast iterować po tablicy to już jak chcesz, ja jestem raczej zwolennikiem robienia bardziej uniwersalnych rozwiązań, no chyba, że wydajność jest dla nas kluczowa ale zakładam, że tutaj nie jest to aż tak istotny punkt :)

Przeanalizuj sobie kod i w razie czego pytaj jak ktorych element jest niejasny, ale w dokumentacji choćby na MDN wszystko powinieneś znaleźć.

---

Sądzisz Tomku, że pytający zrozumiał twój skrypt?

---

za nic nie zrozumialem , ale wkleilem go na stronke , podpialem plik .js i dziala choc nie jestem pewien czy tak jak powinien :D

---

Basia,

Sądzisz Tomku, że pytający zrozumiał twój skrypt?

Nie, nie sądzę, że widząc go od razu zrozumiał, tym bardziej, że nie napisał nic w sekcji JS :) Ale użyłem tam w sumie samych podstawowych elementów języka z poziomu powiedziałbym typowo juniorskiego, więc Kolega ma gotowca do prześledzenia sobie krok po kroku tego z dokumentacją. Bierze np. metodę querySelector, wpisuje w google czy MDN i czyta, krok po kroku.

Answer 1

Trzy pola numeryczne, przycisk "Oblicz", przycisk "Kasuj" i miejsce na wyprowadzenie wyników. Plus JS w celu wykonania obliczeń. Odpal jakiś edytor, napisz kod i wrzuć go na forum.

Comments

<form>
  <label> TC price <input type="number"></label><br>
  <label> Cask Price [ in TC ]  <input type="number"></label><br>
  <label> Wasted potions <input type="number"></label><br>
   <input type="submit" value="Calculate"> 

   
	</select>
</form><br>
</form>

jak narazie mam tak ale chyba czegos brakuje :/

 

ps. Te zmienne "tc price , cask price i wasted potions " to odpowiednia z obrazka A B C 

---

Jak nie wysyłasz nigdzie formularza, to niepotrzebny ci znacznik form. Poza tym w linii 8 pojawia się jakiś </select>, a niżej podwójne zamknięcie formularza. Może lepiej tak:

<label> TC price <input type="number" id="a"></label><br>
<label> Cask Price [ in TC ]  <input type="number" id="b"></label><br>
<label> Wasted potions <input type="number" id="c"></label><br>
<button>Calculate</button>

Dodałam identyfikatory pól, aby je uchwycić w skrypcie. No to teraz dorób część javasciptową.