Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 12.02.2020, 12:41
Интересующийся
Отправить личное сообщение для Малик Посмотреть профиль Найти все сообщения от Малик
 
Регистрация: 12.02.2020
Сообщений: 23

В массив помещаются данные всех Checkbox, а не только помеченных.
Всем Доброго времени суток!

Я новичок в веб-программировании, поэтому многого не понимаю!

Столкнулся с такой проблемой, при нажатии Submit, в Json строку уходят все значения чекбоксов, даже те которые не были отмечены. Я знаю что надо использовать IF, ELSE команды, но не получается сделать так чтобы в массиве указывались только те варианты, которые были помечены, Помогите Пожалуйста!!

Вот полный HTML код со скриптом внутри :


<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie-edge">
    <title>Form</title>
    <link rel="stylesheet" type="text/css" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
    <form>
        <div class="form-5 form-group">
            <label for="Question" class="question">Вопрос:</label>
            <input type="text" class="form-control" id="validationTextarea" placeholder="Какие языки программирования Вы используете?"> </div>
        <div class="custom-control custom-checkbox form-control form-6">
            <input type="checkbox" class="custom-control-input" id="CustomCheck1" value="c#">
            <label class="custom-control-label" for=>C#</label>
        </div>
        <div class="custom-control custom-checkbox form-control form-7">
            <input type="checkbox" class="custom-control-input" id="CustomCheck2" value="c++" >
            <label class="custom-control-label" for="CustomCheck2">C++</label>
        </div>
        <div class="custom-control custom-checkbox form-control form-8">
            <input type="checkbox" class="custom-control-input" id="CustomCheck3" value="asp.net" >
            <label class="custom-control-label" for="CustomCheck3">ASP.NET</label>
        </div>
        <div class="custom-control custom-checkbox form-control form-9" >
            <input type="checkbox" class="custom-control-input" id="CustomCheck4" value="php" >
            <label class="custom-control-label" for="CustomCheck3">PHP</label><br>
        </div><br>
        <div class="form-5 form-group">
            <label for="Question" class="question">Вопрос:</label>
            <input type="text" class="form-control" id="validationTextarea" placeholder="С какими СУБД Вам приходилось работать?"> </div>
        <div class="custom-control custom-checkbox form-control form-6">
            <input type="checkbox" class="custom-control-input" id="CustomCheck5" value="mssql">
            <label class="custom-control-label" for="CustomCheck5">MS-SQL Server 2000-2012/T-SQL</label>
        </div>
        <div class="custom-control custom-checkbox form-control form-7">
            <input type="checkbox" class="custom-control-input" id="CustomCheck6" value="oracle" >
            <label class="custom-control-label" for="CustomCheck6">Oracle</label>
        </div>
        <div class="custom-control custom-checkbox form-control form-8">
            <input type="checkbox" class="custom-control-input" id="CustomCheck7" value="mysql" >
            <label class="custom-control-label" for="CustomCheck7">MySQL</label>
        </div>
        <div class="custom-control custom-checkbox form-control form-9" >
            <input type="checkbox" class="custom-control-input" id="CustomCheck8" value="postgresql" >
            <label class="custom-control-label" for="CustomCheck8">PostgreSQL</label><br>
        </div><br>
        <div class="form-5 form-group">
            <label for="Question" class="question">Вопрос:</label>
            <input type="text" class="form-control" id="validationTextarea" placeholder="С какими системами контроля версий Вы работали?"> </div>
        <div class="custom-control custom-checkbox form-control form-6">
            <input type="checkbox" class="custom-control-input" id="CustomCheck9" value="git">
            <label class="custom-control-label" for="CustomCheck9">GIT</label>
        </div>
        <div class="custom-control custom-checkbox form-control form-7">
            <input type="checkbox" class="custom-control-input" id="CustomCheck10" value="cvs" >
            <label class="custom-control-label" for="CustomCheck10">CVS</label>
        </div>
        <div class="custom-control custom-checkbox form-control form-8">
            <input type="checkbox" class="custom-control-input" id="CustomCheck11" value="subversion" >
            <label class="custom-control-label" for="CustomCheck11">Subverion</label>
        </div>
        <div class="custom-control custom-checkbox form-control form-9" >
            <input type="checkbox" class="custom-control-input" id="CustomCheck12" value="mercurial" >
            <label class="custom-control-label" for="CustomCheck12">Mercurial</label><br>
        </div><br>
        <input type="submit" value="Далее" class="btn btn-primary" onclick="convert_to_json()">
    </form>
</body>
<script>

function convert_to_json()
{
results = { 
  lang_list: [CustomCheck1.value,
  CustomCheck2.value,
  CustomCheck3.value,
  CustomCheck4.value],
  subd_list: [CustomCheck5.value,
  CustomCheck6.value,
  CustomCheck7.value,
  CustomCheck8.value],
  SystemControl_list: [CustomCheck9.value,
  CustomCheck10.value,
  CustomCheck11.value,
  CustomCheck12.value]
};

let json = JSON.stringify(results);


        alert("results: " + json);
}
</script>

Последний раз редактировалось Малик, 12.02.2020 в 13:01. Причина: Форматирование
Ответить с цитированием
  #2 (permalink)  
Старый 12.02.2020, 12:54
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,075

Малик,
Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:
[html run]
... минимальный код страницы с вашей проблемой
[/html]

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.
Ответить с цитированием
  #3 (permalink)  
Старый 12.02.2020, 13:03
Интересующийся
Отправить личное сообщение для Малик Посмотреть профиль Найти все сообщения от Малик
 
Регистрация: 12.02.2020
Сообщений: 23

Так сойдет? Извиняюсь, не был в курсе таких вещей, так как первый раз пользуюсь данным форумом!
Ответить с цитированием
  #4 (permalink)  
Старый 12.02.2020, 13:04
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,075

Малик,
function convert_to_json() {
    const checArr = arr => arr.filter(({
        checked
    }) => checked).map(({
        value
    }) => value);
    results = {
        lang_list: checArr([CustomCheck1,
            CustomCheck2,
            CustomCheck3,
            CustomCheck4
        ]),
        subd_list: checArr([CustomCheck5,
            CustomCheck6,
            CustomCheck7,
            CustomCheck8
        ]),
        SystemControl_list: checArr([CustomCheck9,
            CustomCheck10,
            CustomCheck11,
            CustomCheck12
        ])
    };
    let json = JSON.stringify(results);
    alert("results: " + json);
}
Ответить с цитированием
  #5 (permalink)  
Старый 12.02.2020, 13:08
Интересующийся
Отправить личное сообщение для Малик Посмотреть профиль Найти все сообщения от Малик
 
Регистрация: 12.02.2020
Сообщений: 23

От всей души благодарю!
Ответить с цитированием
  #6 (permalink)  
Старый 12.02.2020, 13:40
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,075

Малик,
сделайте вопросы отдельными блоками, оберните в div с названием группы ответы и вопрос. код будет проще.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Проблема получения объекта JSON espltd Элементы интерфейса 13 03.02.2016 14:55
Как с помощью одного файла заменять данные во всех сайтах Дима1892 Ваши сайты и скрипты 2 11.01.2016 19:22
Как получить данные всех атрибутов указанных элементов в массив Jigan2 jQuery 6 21.03.2015 16:39
как записать id всех элементов в массив? SunYang Общие вопросы Javascript 21 06.02.2010 22:50
Передача всех Options из Select (не только выбранных) dm1tr1y Общие вопросы Javascript 6 23.03.2009 18:51