Dynamicznie zmieniaj opcje pola wyboru na podstawie poprzedniego wyboru opcji

Question

Sep 26, 2012, 05:48 PM

Dynamicznie zmieniaj opcje pola wyboru na podstawie poprzedniego wyboru opcji

To, co próbuję osiągnąć, to ... HTML

<!doctype html>
<head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <link href="css/jquery.selectbox.css" type="text/css" rel="stylesheet" />
</head>
<body>



    <select name="dateselector_parent" id="dateselector_parent" tabindex="1">
        <option value="">--Select Date--</option>
        <option value="1">2012</option>
        <option value="1">2011</option>
        <option value="1">2010</option>
        <option value="2">Predefined Dates</option>
    </select>

    <select name="dateselector_child" id="dateselector_child" tabindex="2">
        <option value="">--Select Date--</option>
        <option value="1">January</option>
        <option value="1">February</option>
        <option value="1">March</option>
        <option value="1">April</option>
        <option value="1">May</option>
        <option value="1">June</option>
        <option value="1">July</option>
        <option value="1">August</option>
        <option value="1">September</option>
        <option value="1">October</option>
        <option value="1">November</option>
        <option value="1">December</option>
        <option value="2">Current Month</option>
        <option value="2">Month to Date</option>
        <option value="2">Last 7 Days</option>
    </select>


    <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="js/jquery.selectbox-0.2.js"></script>
    <script type="text/javascript" src="js/datejs.js"></script>
    <script type="text/javascript">
    $(function () {
        $("#dateselector_parent").selectbox();
        $("#dateselector_child").selectbox();
    });


    </script>
</body>

Tworzy to dwa pola wyboru, chcę, aby jedno pole wyświetlało zawartość zgodnie z tym, co użytkownik wybierze na drugim. Na przykład, jeśli użytkownik wybierze 2010 lub 2011 lub 2012, chcę wyświetlić Jan-Dec jako opcje drugiego. Jeśli użytkownik wybierze Wstępnie zdefiniowane daty, chcę wyświetlić bieżący miesiąc, miesiąc do daty i ostatnie 7 dni. Używana przeze mnie wtyczka javascript pozwala użytkownikowi zdefiniować metody onChange, onOpen i onClose. Przeprowadziłem kilka badań i wydaje się, że AJAX jest zaangażowany w próbę osiągnięcia tego celu, ale ponieważ nie znam jednego bitu PHP, chciałbym wiedzieć, czy jest to możliwe do wykonania za pomocą jQuery. (Próbowałem rozwiązać ten problem oczywiście bez szczęścia, nie szukam kogoś, kto mógłby to dla mnie zrobić, po prostu chcę być wskazany we właściwym kierunku, czy mogę to osiągnąć za pomocą jQuery lub jeśli jest to konieczne do użycia AJAX, ponieważ nie widziałem przykładu online tylko z jQuery).

Każda pomoc zostanie doceniona