Javascript-форум - Как можно отключить option из select?

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - Как можно отключить option из select? (https://javascript.ru/forum/misc/53872-kak-mozhno-otklyuchit-option-iz-select.html)

Как можно отключить option из select?

Код:

<select name="shk_delivery" style="width:99%;">

<option id="delivery1" value="delivery1"  selected="selected" >delivery1</option>

<option id="delivery2" value="delivery2" >delivery2</option>

<option id="delivery3" value="delivery3" >delivery3</option>

</select>

Код:

<div id="total_price" style="text-align:right;">Общая сумма: <b>350</b> руб.</div>

<script>
var priceValue=document.querySelector('#total_price b').innerHTML;
</script>

1. Необходимо отключить возможность выбора delivery2 если priceValue меньше 1000 и Отключить возможность выбора delivery3 если priceValue меньше 1500

Так же при каком условии вызывать данный код?
По после того как страница загрузится?

Вообще необходимо, чтобы вызов данного скрипта был до того момента пока пользователь не начал выбирать способ доставки.

Когда генеришь страницу на сервере, проставляй атрибут disabled.

<?php
$delivery2 = $priceValue >= 1000;
$delivery3 = $priceValue >= 1500;
?>
<option id="delivery2" value="delivery2" <?= $delivery2 ? '' : 'disabled' ?>>delivery2</option>
<option id="delivery3" value="delivery3" <?= $delivery3 ? '' : 'disabled' ?>>delivery3</option>

В том то и дело, что непонятно где это генерится. В код php лезнть ни к чему. Всё таки надо сделать это на javascript.
Так же это и не генерится, а уже готовый такой вариант.

Цитата:

Сообщение от griga999

Так же это и не генерится, а уже готовый такой вариант.

То есть это обычная html-страничка? Откуда тогда берется priceValue?

Цитата:

Сообщение от griga999

В код php лезнть ни к чему

Странный ты. Я ведь только что объяснил что нужно лезть в php код чтобы сделать то, что тебе нужно. Хотя можно конечно и костыль вставить. Так ты стразу и скажи, что хочешь костыль, а не нормальное решение.

Цитата:

Сообщение от danik.js (Сообщение 357758)

То есть это обычная html-страничка? Откуда тогда берется priceValue?

Странный ты. Я ведь только что объяснил что нужно лезть в php код чтобы сделать то, что тебе нужно. Хотя можно конечно и костыль вставить. Так ты стразу и скажи, что хочешь костыль, а не нормальное решение.

Это обычная страница. Обычный шаблон, в котором написан этот html код.

Только параметр price динамический.
А способы доставки это чистый html.

Пробую что то типо такого, но неработает:

var op = document.getElementById("shk_delivery").getElementsByTagName("option");
op[1].disabled = true;
alert('hello');

Даже hello не выводится. А если удалить var op = document.getElementById("shk_delivery").getElement sByTagName("option"); то алерт срабатывает.

А price какими средствами подставляется в HTML?

Цитата:

Сообщение от danik.js (Сообщение 357771)

А price какими средствами подставляется в HTML?

Как то с помощью AJAX вроде бы или JQueryТочно сказать не могу. Это значение автоматически меняется в зависимости от кол-ва товаров и способа доставки без перезагрузки страницы.

А способы доставки они статические чиcтый html.

<html>
<head>
</head>
<body>
<meta charset="windows-1251" />
<select name="shk_delivery" style="width:99%;">
<option id="delivery1" value="delivery1"  selected="selected" >delivery1</option>
<option id="delivery2" value="delivery2" >delivery2</option>
<option id="delivery3" value="delivery3" >delivery3</option>
</select>

<select id="test">
<option>350</option>
<option>1050</option>
<option>1700</option>
<select>


<div  id="total_price" style="text-align:right;">Общая сумма: <b>350</b> руб.</div>

<script>

test.onchange=function(){
 document.querySelector('#total_price b').innerHTML=this.value
}

onload=document.querySelector("select").onclick=function(){
 var n=+document.querySelector('#total_price b').innerHTML
 if(n<1000) delivery2.disabled=true
 if(n>1000) delivery2.disabled=false
 if(n<1500) delivery3.disabled=true
 if(n>1500) delivery3.disabled=false
}
</script>

</body>
</html>

Цитата:

Сообщение от newtempacc (Сообщение 357862)

<html>
<head>
</head>
<body>
<meta charset="windows-1251" />
<select name="shk_delivery" style="width:99%;">
<option id="delivery1" value="delivery1"  selected="selected" >delivery1</option>
<option id="delivery2" value="delivery2" >delivery2</option>
<option id="delivery3" value="delivery3" >delivery3</option>
</select>

<select id="test">
<option>350</option>
<option>1050</option>
<option>1700</option>
<select>


<div  id="total_price" style="text-align:right;">Общая сумма: <b>350</b> руб.</div>

<script>

test.onchange=function(){
 document.querySelector('#total_price b').innerHTML=this.value
}

onload=document.querySelector("select").onclick=function(){
 var n=+document.querySelector('#total_price b').innerHTML
 if(n<1000) delivery2.disabled=true
 if(n>1000) delivery2.disabled=false
 if(n<1500) delivery3.disabled=true
 if(n>1500) delivery3.disabled=false
}
</script>

</body>
</html>

Всё замечательно работает.

Такой вопрос: В корзине я могу изменять кол-во товаров. Сумма заказа меняется автоматически. Т.е. то значение которое в:

Код:

<div id="total_price" style="text-align:right;">Общая сумма: <b>780</b> руб.</div>

Оно меняется.

Как мне можно отследить изменение этого значения? И если оно изменилось вызвать функцию, которая изменит параметр disable?

Сейчас у меня JavaScript выглядит вот так:

<script type="text/javascript">
window.onload = function check_delivery() {
var priceValue=document.querySelector('#total_price b').innerHTML;
parseInt(priceValue,10);
 if(priceValue<1000) delivery2.disabled=true;
 if(priceValue>1000) delivery2.disabled=false;
 if(priceValue<1500) delivery3.disabled=true;
 if(priceValue>1500) delivery3.disabled=false;
}

А html вот так:

Код:

<select name="shk_delivery" style="width:99%;">

        <option id="delivery1" value="Наложенный платеж (Только если заказ более 1000 рублей)"  selected="selected" >Наложенный платеж (Только если заказ более 1000 рублей) (240 руб.)</option>

        <option id="delivery2" value="Почтовое отправление (бандероль), по 100% предоплате." >Почтовое отправление (бандероль), по 100% предоплате. (170 руб.)</option>

        <option id="delivery3" value="Бесплатная доставка, если заказ более 1500 рублей. По 100% предоплате." >Бесплатная доставка, если заказ более 1500 рублей. По 100% предоплате. </option>

      </select>

Цитата:

Сообщение от griga999

Оно меняется

Само по себе оно не может меняться. Менять можешь только ты скриптом. Вот из того скрипта, после изменения и вызывай функцию, которая обновит варианты доставки.

Цитата:

Сообщение от griga999

if(priceValue<1000) delivery2.disabled=true;
if(priceValue>1000) delivery2.disabled=false;
if(priceValue<1500) delivery3.disabled=true;
if(priceValue>1500) delivery3.disabled=false;

А если priceValue равно 1000? Или 1500? Че тогда?:D