Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #41 (permalink)  
Старый 09.12.2021, 02:40
Аспирант
Отправить личное сообщение для BorisJe Посмотреть профиль Найти все сообщения от BorisJe
 
Регистрация: 03.12.2021
Сообщений: 39

Сообщение от ksa Посмотреть сообщение
Ты не по тому пути идешь...
Не нужно отслеживать изменение поля "сумма". Весь алгоритм должен строиться на клацанье по кнопкам.
Там ты и получишь "новую" сумму. Потом с ней и нужно анализировать радиокнопки...
Вот Я и пытаюсь.
У Меня сейчас работает так, Я отслеживаю нажатие кнопки и от него уже получаю значение общей суммы
Ответить с цитированием
  #42 (permalink)  
Старый 09.12.2021, 06:46
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 1,575

Сообщение от BorisJe
Я не могу сказать, делал по гайдикам
Написание программ отличается от написания поэм тем, что в программах нужно точно знать, зачем написана та или другая строчка.
В каких "гайдикак" сказано, что jquery надо подключать три раза?
В каких "гайдиках" сказано, что надо два раза проверять, что html код загрузился и можно выполнять скрипт?

Вот код, который,на мой взгляд, делает то, что нужно (может не все, но можно и добавить)
<!DOCTYPE html>
<html lang="ru">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
<script>
   
   var count1 = 0;
   var count2 = 0;
   var count5 = 0;
   var count10 = 0;

	function canby(sum) {
		document.querySelectorAll('.table td.price')
			.forEach( td => {
				const price = parseFloat(td.dataset.price)
				const rd = td.closest('tr').querySelector('input[type=radio]')
				rd.disabled = price > sum;
				const bt = td.closest('tr').querySelector('button[name="clickonbutton"]')
				bt.disabled = price > sum;

			})
	}
   
   function myFunction(item) {
       if (item == 1) {
           document.getElementById("coin_1").setAttribute('value', count1++);
       }
       else if (item == 2) {
           document.getElementById("coin_2").setAttribute('value', count2++);
       }
       else if (item == 5) {
           document.getElementById("coin_3").setAttribute('value', count5++);
       }
       else if (item == 10) {
           document.getElementById("coin_4").setAttribute('value', count10++);
       }
       const total = count1 + count2 * 2 + count5 * 5 + count10 * 10;
       document.getElementById('total').value = total
       canby (total)
   }
</script>
</head>
<body>
<div class="container">
   <div class="text-center">
      <h1 class="display-4">Welcome</h1>
      <p>Learn about <a href="https://docs.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
      <div class="btn">
         <button class="btn btn-info" value="1" onclick="myFunction(1)">1,00</button>
      </div>
      <div class="btn">
         <button class="btn btn-info" value="2" onclick="myFunction(2)">2,00</button>
      </div>
      <div class="btn">
         <button class="btn btn-info" value="5" onclick="myFunction(5)">5,00</button>
      </div>
      <div class="btn">
         <button class="btn btn-info" value="10" onclick="myFunction(10)">10,00</button>
      </div>
      <form method="post" enctype="multipart/form-data" action="/User/Purchase" novalidate="novalidate">
         <!--Products-->
         <div class="container">
            <div class="row">
               <h3>Продукты</h3>
               <div class="formR">
                  <br><br>
                  <table class="table">
                     <thead>
                        <tr>
                           <th>Выбранный</th>
                           <th>Наименование</th>
                           <th>Цена</th>
                           <th>Картинка</th>
                           <th>Описание</th>
                           <th>Наличие</th>
                        </tr>
                     </thead>
                     <tbody>
                        <tr id="price1">
                           <input type="hidden" name="id" value="1">
                           <td><input value="1" name="Product" type="radio" disabled="true"></td>
                           <td>Чай</td>
                           <td class="price" data-price="35">35,00</td>
                           <td style="width: 10%">
                              <button name="clickonbutton" type="submit" value="Чай" disabled="true">
								<img class="center" srcset="/images/Capture001.png" src="/User/Purchase/1" style="width: 128px; height: 96px;vertical-align: bottom">
                              </button>
                           </td>
                           <td></td>
                        </tr>
                        <tr id="price1">
                           <input type="hidden" name="id" value="9">
                           <td><input value="9" name="Product" type="radio" disabled="true"></td>
                           <td>Кофэ</td>
                           <td class="price" data-price="50">50,00</td>
                           <td style="width: 10%">
                              <button name="clickonbutton" type="submit" value="Кофэ"disabled="true">
								<img class="center" srcset="/images/Capture001.png" src="/User/Purchase/9" style="width: 128px; height: 96px;vertical-align: bottom">
                              </button>
                           </td>
                        </tr>
                     </tbody>
                  </table>
               </div>
            </div>
         </div>
         <input type="hidden" id="coin_1" name="coin_1" value="4">
         <input type="hidden" id="coin_2" name="coin_2" value="1">
         <input type="hidden" id="coin_3" name="coin_3" value="1">
         <input type="hidden" id="coin_4" name="coin_4" value="4">
         <label>
         Сумма
         <input name="total" id="total" type="text" class="total valid" value="0" aria-invalid="false">
         </label>
         <input class="button" type="submit" value="Оплатить">
      </form>
   </div>
</div>
</body>
</html>
Ответить с цитированием
  #43 (permalink)  
Старый 09.12.2021, 09:08
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 13,607

Я вот к какому варианту ТСа склонял...
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<!--
<script src="https://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
-->
<style>
.off {
	color: red;
}
</style>
<script>
document.addEventListener('DOMContentLoaded', _ => {
	const t = document.querySelector('#total')
	document.querySelector('.btn').addEventListener('click', e => {
		const o = e.target
		if (o.tagName !== 'BUTTON') return
		const val = +t.value + +o.value
		t.value = val
		document.querySelectorAll('.table input').forEach(_ => {
			const r = _.parentNode.parentNode
			const p = +_.dataset.price
			if (val < p) {
				_.disabled = true
				if (!r.classList.contains('off')) r.classList.add('off')
			} else {
				_.disabled = false
				if (r.classList.contains('off')) r.classList.remove('off')
			}
		})
	})
})
</script>
</head>
<body>
<div class="container">
	<h1>Welcome</h1>
	<div class="btn">
		<div>
			<button class="btn btn-info" value="1">1,00</button>
		</div>
		<div>
			<button class="btn btn-info" value="2">2,00</button>
		</div>
		<div>
			<button class="btn btn-info" value="5">5,00</button>
		</div>
		<div>
			<button class="btn btn-info" value="10">10,00</button>
		</div>
	</div>
	<form method="post" enctype="multipart/form-data" action="/User/Purchase" novalidate="novalidate">
		<h3>Продукты</h3>
		<table class="table">
			<thead>
				<tr>
					<th>Выбранный</th>
					<th>Наименование</th>
					<th>Цена</th>
					<th>Действие</th>
				</tr>
			</thead>
			<tbody>
				<tr class='off'>
					<td><input value="1" data-price='35.00' name="Product" type="radio" disabled /></td>
					<td>Чай</td>
					<td id="price">35,00</td>
					<td>
						<button>Заказать</button>
					</td>
				</tr>
				<tr class='off'>
					<td><input value="9" data-price='50.00' name="Product" type="radio" disabled /></td>
					<td>Кофэ</td>
					<td>50,00</td>
					<td>
						<button>Заказать</button>
					</td>
				</tr>
			</tbody>
		</table>
		<div>
			<label>
				Сумма
				<input name="total" id="total" type="text" class="total valid" value="1" aria-invalid="false">
			</label>
			<input class="button" type="submit" value="Оплатить">
		<div>
	</form>
</div>
</body>
</html>
Ответить с цитированием
  #44 (permalink)  
Старый 09.12.2021, 09:19
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 1,575

Я не стал переписывать все.
Возможностей для оптимизации много.
Ответить с цитированием
  #45 (permalink)  
Старый 09.12.2021, 15:56
Аспирант
Отправить личное сообщение для BorisJe Посмотреть профиль Найти все сообщения от BorisJe
 
Регистрация: 03.12.2021
Сообщений: 39

Сообщение от voraa Посмотреть сообщение
Я не стал переписывать все.
Возможностей для оптимизации много.
Спасибо это более чем понятно для понимания. Спасибо
Ответить с цитированием
  #46 (permalink)  
Старый 09.12.2021, 15:57
Аспирант
Отправить личное сообщение для BorisJe Посмотреть профиль Найти все сообщения от BorisJe
 
Регистрация: 03.12.2021
Сообщений: 39

Спасибо мужики, спасибо что помогли разобраться. Задача с начала вообще казалась невыполнимой
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск