Попытка заставить выбранный атрибут работать

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

Вот мой код

<div class = "content_wrapper">
    <div class = "row">
        <div class = "col-lg-12">
            <form action = "{{ route('account.sort-orders') }}">
                <select class = "sort_orders" name = "sort_orders">
                    <option class = "all" value = "all" selected>All</option>
                    <option class = "three_months" value = "three_months">Last 3 months</option>
                    <option class = "six_months" value = "six_months">Last 6 months</option>
                    <option class = "2019" value = "2019">2019</option>
                </select>
            </form>
        </div>
    </div>
</div>

<script>
    $(document).ready(function(){
        $('.sort_orders').change(function(){
            $(this).closest("form").submit();
        });

        $("select.sort_orders").change(function(){
            var selectedOpton = $(this).children("option:selected").val();
            console.info("You have selected this option - " + selectedCountry);

            if (selectedOpton == 'three_months'){
                console.info('this is three_months');
                $('.all').removeAttr('selected');
                $('.three_months').attr('selected', true);
            }
        });
    });

</script>

Какую проблему вы ожидаете решить с помощью этого кода? Я спрашиваю, потому что пункт кода полностью избыточен. Если вы выбрали «Три месяца», то никакой другой вариант выбрать нельзя, если только вы не используете множественный выбор, а это не так. Поэтому логика removeAttr()/attr() бессмысленна - это происходит по умолчанию при использовании элемента управления HTML по умолчанию.

— 15.03.2019 09:43

Я обновил свой ответ, который теперь должен работать.

— 15.03.2019 10:14

jquery

15.03.2019 09:39

Как конвертировать HTML в PDF с помощью jsPDF

В этой статье мы рассмотрим, как конвертировать HTML в PDF с помощью jsPDF. Здесь мы узнаем, как конвертировать HTML в PDF с помощью javascript.

Ответы 1

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

<div class = "content_wrapper">
    <div class = "row">
        <div class = "col-lg-12">
            <form action = "{{ route('account.sort-orders') }}">
                <select id = "yourSlct" class = "sort_orders" name = "sort_orders">
                    <option class = "all" value = "all" selected>All</option>
                    <option id = "option2" class = "three_months" value = "three_months">Last 3 months</option>
                    <option class = "six_months" value = "six_months">Last 6 months</option>
                    <option class = "2019" value = "2019">2019</option>
                </select>
            </form>
        </div>
    </div>
</div>

<script>

$(document).ready(function(){

    $('.sort_orders').change(function(){
        $(this).closest("form").submit();
    });

    $("select.sort_orders").change(function(){
        var selectedOpton = $(this).children("option:selected").val();
        $('#text').text(selectedOpton);

        $('#yourSlct').children().removeAttr("selected");

        if (selectedOpton == 'three_months'){
            console.info('this is three_months');
            $("select.sort_orders #option2").attr("selected", "selected");
        }
    });
});

</script>

Я заставил свою функцию контроллера дать атрибут selected, и хотя это сработало. Я надеюсь, что есть лучший способ сделать это с помощью jquery. Причина, по которой я подумал сделать это через свой контроллер, заключалась в том, что моя страница обновлялась.

— 15.03.2019 10:30

@Nikki Вы уверены, что добавили все идентификаторы и т. д.? Я попробовал это в JS Fiddle, и это сработало для меня. Я отредактировал HTML и JS, возможно, попробуйте скопировать и вставить мой ответ.

— 15.03.2019 10:47

15.03.2019 09:57