Страница 2 из 5 < 1 2 34 > Последняя »
Показывать 40 сообщений этой темы на одной странице

Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Дублировать значение select s span (https://javascript.ru/forum/jquery/74114-dublirovat-znachenie-select-s-span.html)

kk450 15.06.2018 11:35
Цитата:
Сообщение от Dilettante_Pro (Сообщение 487421)
Dilettante_Pro,
Перечитал вопрос еще раз - похоже, неправильно понял. При разбивке на разряды число преобразуется в строку, которая потом и выводится в html
Разбить число на разряды

<span id="sel1">0</span> руб <br>
<script>
   var value = 3830000, str = value.toString(); 
   str = str.replace(/(\d)(?=(\d\d\d)+([^\d]|$))/g, '$1 ');
   sel1.innerText = str;
</script>
Я вообще нуб в синтаксисе JS если можно поправьте на примере кода (в комментарии уточнил строку):

$(document).ready(function(){ $("select[name^='sel']").trigger('change'); }); //Установить цену при загрузке страницы
 
$("select[name^='sel']").change(function() {
    $("#"+ this.name).html(this.value); // КАК ТУТ ПРЕОБРАЗОВАТЬ СТРОКУ С РАЗДЕЛЕНИЕМ НА РАЗРЯДЫ???
  var s = $('select[name^="sel"] option:selected').map(function() {
   
    return this.value
  }).get()
 
  var sum = s.reduce((pv, cv) => {
    return pv + (parseFloat(cv) || 0);
  }, 0);
 $("#sum").text(sum.toLocaleString()); //Разделить разряды
})
</script>

j0hnik 15.06.2018 13:15
kk450,
$("#"+ this.name).html((+this.value).toLocaleString()); // КАК ТУТ ПРЕОБРАЗОВАТЬ СТРОКУ С РАЗДЕЛЕНИЕМ НА РАЗРЯДЫ???

Dilettante_Pro 15.06.2018 14:00 
Агрегат
<select name='sel1'>
 <option value='1480'>Вал тип 1</option>
 <option value='2556'>Вал тип 2</option>
</select><br>
Цена: <span id="sel1">0</span> руб <br>

Центральная смазка
<select name='sel2'>
 <option value='0'>Нет</option>
 <option value='23'>Да</option>
</select><br>
Цена: <span id="sel2">0</span> руб <br>


Двойной подшипник
<select name='sel3'>
 <option value='0'>Нет</option>
 <option value='22'>Да</option>
</select><br>
Цена: <span id="sel3">0</span> руб <br>

Общая стоимость выбранных позиций: <span id="sum">0</span> руб
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){ $("select[name^='sel']").trigger('change'); }); //Установить цену при загрузке страницы

$("select[name^='sel']").change(function() {
    $("#"+ this.name).html(splitRange(+this.value));  
  var s = $('select[name^="sel"] option:selected').map(function() {
  
    return this.value
  }).get()

  var sum = s.reduce((pv, cv) => {
    return pv + (parseFloat(cv) || 0);
  }, 0);
 $("#sum").text(splitRange(sum)); //Разделить разряды
})
function splitRange(val) {
   var str = val.toString(); 
   return str.replace(/(\d)(?=(\d\d\d)+([^\d]|$))/g, '$1 ');
}
</script>

kk450 18.06.2018 07:00
Dilettante_Pro,
Спасибо огромное! очень выручил

kk450 18.06.2018 09:02
Dilettante_Pro,

Задача еще усложнилась:

Нужно добавить еще доставку, 2 вида (под ключи или до склада) выпадающие список ниже строки таблицы:

<tr><td>
Доставка и запуск под ключ</td>
<td>
<select name='dost1'>
 <option value='0'>Нет</option> <!-- в случае выбора этого пункта прибавить 0 к итогу -->
 <option value='3000'>Да</option> <!-- в случае выбора этого пункта, заблокировать dost2 прибавить 3000 к итогу -->
</select></td>
<td><span id="dost1">0</span>руб</td></tr>

<tr><td>
Доставка до склада</td>
<td>
<select name='dost2'>
 <option value='0'>Омск</option> <!-- value = 0% от sel1 -->
 <option value='1,5'>Новосибирск</option> <!-- в случае выбора этого пункта, заблокировать dost1 и 
 прибавить 1.5% от sel1 к итогу -->
 <option value='3'>Москва</option> <!-- в случае выбора этого пункта, заблокировать dost1 и 
 прибавить 3% от sel1 к итогу -->
</select></td>
<td><span id="dost2">0</span>руб</td></tr>


В комментариях примерно расписал, выбор любого пункта кроме первого выключает dost2 и наоборот.


Dilettante_Pro,
помоги еще с этим плиз, и кинь в личку номер карты, закину на пиво

Dilettante_Pro 18.06.2018 12:04 
Агрегат
<select name='sel1'>
 <option value='1480'>Вал тип 1</option>
 <option value='2556'>Вал тип 2</option>
</select><br>
Цена: <span id="sel1">0</span> руб <br>

Центральная смазка
<select name='sel2'>
 <option value='0'>Нет</option>
 <option value='23'>Да</option>
</select><br>
Цена: <span id="sel2">0</span> руб <br>


Двойной подшипник
<select name='sel3'>
 <option value='0'>Нет</option>
 <option value='22'>Да</option>
</select><br>
Цена: <span id="sel3">0</span> руб <br>

Общая стоимость выбранных позиций: <span id="sum">0</span> руб<br><br>

<table>
<tr>
<td>Доставка и запуск под ключ</td>
<td>
<select name='dost1'>
 <option value='0'>Нет</option> <!-- в случае выбора этого пункта прибавить 0 к итогу -->
 <option value='3000'>Да</option> <!-- в случае выбора этого пункта, заблокировать dost2 прибавить 3000 к итогу -->
</select></td>
<td><span id="dost1">0</span>руб</td></tr>

<tr>
<td>Доставка до склада</td>
<td>
<select name='dost2'>
 <option value='-1'>Нет</option>
 <option value='0'>Омск</option> <!-- value = 0% от sel1 -->
 <option value='1.5'>Новосибирск</option> <!-- в случае выбора этого пункта, заблокировать dost1 и 
 прибавить 1.5% от sel1 к итогу -->
 <option value='3'>Москва</option> <!-- в случае выбора этого пункта, заблокировать dost1 и 
 прибавить 3% от sel1 к итогу -->
</select></td>
<td><span id="dost2">0</span>руб</td>
</tr>
</table>
<b>Итого с доставкой: <span id="result">0</span> руб<b>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript">
var sum = 0, dost = 0;
$(document).ready(function(){ $("select[name^='sel']").trigger('change'); }); //Установить цену при загрузке страницы

$("select[name^='sel']").change(function() {
    $("#"+ this.name).html(splitRange(+this.value));  
  var s = $('select[name^="sel"] option:selected').map(function() {
  
    return this.value
  }).get()

    sum = s.reduce((pv, cv) => {
    return pv + (parseFloat(cv) || 0);
  }, 0);
 $("#sum").text(splitRange(sum)); //Разделить разряды
 $('#result').text(splitRange(sum + dost));
});

var dost1 = $("select[name='dost1']"), dost2 = $("select[name='dost2']"),
base = $("select[name='sel1'] option")[0].value;
dost1.change(function() {
    if(this.value == '0') {
     //  dost1.hide();
       dost2.show();
    }
    else {
       dost2.hide();  
   };
   dost = +this.value;
   $("#"+ this.name).html(splitRange(dost)); 
   $('#result').text(splitRange(sum + dost));
});
dost2.change(function() {
    if(this.value == '-1') {
       // dost2.hide();
       dost1.show();
       dost = 0;
    }
    else {
       dost1.hide();
       dost =Math.round(base * (+this.value) / 100);  
   };
   $("#"+ this.name).html(splitRange(dost)); 
   $('#result').text(splitRange(sum + dost));
});
function splitRange(val) {
   var str = val.toString(); 
   return str.replace(/(\d)(?=(\d\d\d)+([^\d]|$))/g, '$1 ');
}
function joinRange(val) {
    return val.replace(/\s/gi,'');
};
</script>

j0hnik 18.06.2018 14:00
Dilettante_Pro,
доделал мальца, чтобы циферки в полях отображались
Агрегат
<select name='sel1'>
 <option value='1480'>Вал тип 1</option>
 <option value='2556'>Вал тип 2</option>
</select><br>
Цена: <span id="sel1">0</span> руб <br>

Центральная смазка
<select name='sel2'>
 <option value='0'>Нет</option>
 <option value='23'>Да</option>
</select><br>
Цена: <span id="sel2">0</span> руб <br>


Двойной подшипник
<select name='sel3'>
 <option value='0'>Нет</option>
 <option value='22'>Да</option>
</select><br>
Цена: <span id="sel3">0</span> руб <br>

Общая стоимость выбранных позиций: <span id="sum">0</span> руб<br><br>

<table>
<tr>
<td>Доставка и запуск под ключ</td>
<td>
<select name='dost1'>
 <option value='0'>Нет</option> <!-- в случае выбора этого пункта прибавить 0 к итогу -->
 <option value='3000'>Да</option> <!-- в случае выбора этого пункта, заблокировать dost2 прибавить 3000 к итогу -->
</select></td>
<td><span id="dost1">0</span>руб</td></tr>

<tr>
<td>Доставка до склада</td>
<td>
<select name='dost2'>
 <option value='-1'>Нет</option>
 <option value='0'>Омск</option> <!-- value = 0% от sel1 -->
 <option value='1.5'>Новосибирск</option> <!-- в случае выбора этого пункта, заблокировать dost1 и 
 прибавить 1.5% от sel1 к итогу -->
 <option value='3'>Москва</option> <!-- в случае выбора этого пункта, заблокировать dost1 и 
 прибавить 3% от sel1 к итогу -->
</select></td>
<td><span id="dost2">0</span>руб</td>
</tr>
</table>
<b>Итого с доставкой: <span id="result">0</span> руб<b>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript">
var sum = 0, dost = 0;
$(document).ready(function(){ $("select[name^='sel']").trigger('change'); }); //Установить цену при загрузке страницы

$("select[name^='sel']").change(function() {
    $("#"+ this.name).html(splitRange(+this.value));  
  var s = $('select[name^="sel"] option:selected').map(function() {
  
    return this.value
  }).get()

    sum = s.reduce((pv, cv) => {
    return pv + (parseFloat(cv) || 0);
  }, 0);
 $("#sum").text(splitRange(sum)); //Разделить разряды
 $('#result').text(splitRange(sum + dost));
});

var dost1 = $("select[name='dost1']"), dost2 = $("select[name='dost2']");
dost1.change(function() {
    if(this.value == '0') {
       dost1.hide();
       dost2.show();
    }
    else {
       dost2.hide();  
   };
   dost = +this.value;
   $("#"+ this.name).html(splitRange(dost));  
   $('#result').text(splitRange(sum + dost));
});
dost2.change(function() {
    if(this.value == '-1') {
       dost2.hide();
       dost1.show();
       dost = 0;
    }
    else {
       dost1.hide();
       dost =Math.round(sum * (+this.value) / 100);  
   };
   $("#"+ this.name).html(splitRange(+dost));  
   $('#result').text(splitRange(sum + dost));
});
function splitRange(val) {
   var str = val.toString(); 
   return str.replace(/(\d)(?=(\d\d\d)+([^\d]|$))/g, '$1 ');
}
function joinRange(val) {
    return val.replace(/\s/gi,'');
};
</script>

Dilettante_Pro 18.06.2018 14:06
j0hnik,
:thanks:
Да, про поля я забыл:(

kk450 20.06.2018 11:04
А какой код нужен чтобы при выборе любого пункта кроме НЕТ второй способ доставки изчезал, но при возврате НЕТ чтобы второй способ появлялся, и наоборот

Иными словами на данный момент если хотябы раз после загрузки страницы был выбран любой вариант кроме НЕТ. То оба селекта одновременно не отображают НЕТ

Dilettante_Pro 20.06.2018 11:55
kk450,
Убрать строки 72 и 83 - нумерация по примеру пост№16


Часовой пояс GMT +3, время: 06:43.
Страница 2 из 5 < 1 2 34 > Последняя »
Показывать 40 сообщений этой темы на одной странице