PHP / Javascript - Изменить 2-й элемент Select на основе выбора в первом элементе Select и сохранить выборки посредством POST и перезагрузки страницы - PullRequest
Новая
       23

PHP / Javascript - Изменить 2-й элемент Select на основе выбора в первом элементе Select и сохранить выборки посредством POST и перезагрузки страницы

0 голосов
/ 13 марта 2020

Первый ВЫБОР: 

<?php

function select_size($itemSizes){

echo "<select id=\"size\" name=\"size\">";

    $sizes = array("0" => "All Sizes","1" => "Large","2" => "Medium","3" => "Small");

    foreach($sizes as $s => $si){
        if($itemSizes == $s){$selected = "selected";}
        echo "<option value=\"" . $s . "\" $selected>" . $si . "</option>\n";
        $selected = "";
    }

echo "</select>\n";

}

?>

Второй ВЫБОР: 

$(document).ready(function() {

    $("#eventCategory").change(function() {
        var val = $(this).val();
        $("#eventType").html(options[val]);
    });

    var options = ["
        <option value='all_items'>ALL Items</option>
        <option value='red'>red</option>
        <option value='blue'>blue</option>
        <option value='green'>green</option>
    ];

});

При первом выборе сохраняется значение из-за PHP. onChange работает правильно, так как после выбора значения в Select # 1, Select # 2 заполняется соответствующим списком. Проблема, которую я имею, состоит в том, чтобы Выбрать # 2 не сохраняет его значение через POST и перезагрузку страницы. Я немного поработал над JS, который делает это, но это нарушает функцию onChange. Я пытаюсь достичь и того и другого одновременно и пока что потерпел неудачу. Да, я любитель с JS. Довольно хорошо со многими другими языками. Синтаксис доставляет мне неприятности. Любая помощь очень ценится.

1 Ответ

0 голосов
/ 13 марта 2020

Вы можете отправить ajax, когда первый выбор вызовет событие onChange. Затем, в случае успеха этого Ajax, вы можете получить значения из php и изменить второе. Поскольку вы используете ajax, первая опция не будет изменена.

Поскольку вы просили "перезагрузить страницу", вам нужно будет напечатать скрипт в представлении, которое могут отображать браузеры, это может выглядеть следующим образом:

если вы можете знать идентификатор каждой опции (если есть): 

echo "<script> $('#selector1 option#'.$idOption.').attr('selected', 'selected'); </script>";

, если вы не можете знать идентификатор каждой опции или есть какой-либо идентификатор, который нужно поймать, вы чтобы получить значение наверняка, скрипт будет выглядеть так: 

$('#selector1 option[value="'.$value.'"]').attr("selected", "selected");

, где в первом случае $ idOption - это идентификатор опции, выбранной в первом селекторе и полученной из php. $ value во втором скрипте ... ну, значение.

на самом деле не знаю, решит ли это всю вашу проблему, так как я могу видеть только часть вашего кода, я отредактирую его, если вы предоставите обратная связь.

Возможно, вам понадобятся значения var_dump / console.log, чтобы получить обратный след ваших данных и посмотреть, где они потеряны, чтобы обеспечить передачу необходимых данных по всей функциональности.

...