Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Java i html
Forum PHP.pl > Forum > Po stronie przeglądarki
miamaji
Witam,
mam problem z obsługą onclick w liście rozwijanej czyli w tagu option. Zdaje sobie sprawę że jest troszkę takich postów, czytałam je i próbowałam wpleść rady do mojego kodu jednakże wszystko zawodzi. Nie wiem czy jest to winą php dodanego w tym tagu dlatego prosze was o wskazówki. To jest moja lista rozwijana:
<select name="select_urgency">
<option onclick="$('#form_urgency').val('Low');$('#form').submit();" <?if(!empty($_POST['urgency']) && $_POST['urgency']=='low') echo 'SELECTED'?> />Low</option>
<option onclick="$('#form_urgency').val('Medium');$('#form').submit();" <?if(!empty($_POST['urgency']) && $_POST['urgency']=='medium') echo 'SELECTED'?> />Medium</option>
<option onclick="$('#form_urgency').val('High');$('#form').submit();" <?if(!empty($_POST['urgency']) && $_POST['urgency']=='high') echo 'SELECTED'?> />High</option>
<option onclick="$('#form_urgency').val('Urgent');$('#form').submit();" <?if(!empty($_POST['urgency']) && $_POST['urgency']=='urgent') echo 'SELECTED'?> >Urgent</option>
<option onclick="$('#form_urgency').val('All');$('#form').submit();" <?if(empty($_POST['urgency']) || $_POST['urgency']=='all') echo 'SELECTED'?> />All</option>
</select>

Może dodam jeszcze że oczywiście powyższe rozwiązanie działa pod FF. Zgóry dziękuje i Pozdrawiam
Monika
ziqzaq
Może spróbuj to obsłużyć przez zdarzenie "onchange" w tagu select.
Widzę, że od razu po kliknięciu na opcję wysyłasz (zatwierdzasz) formularz i z tego wynika moje pytanie:
Czy musisz ustawiać wartość tego elementu formularza "$('#form_urgency').val('Low');" czy nie lepiej odrazu przesłać wybraną wartość tego selecta bez żadnych kombinacji z dodatkowymi polami?
Ja to widzę mniej więcej tak:
Kod
<select id="moj_select" name="form_urgency" onchange="$('#form').submit();">
<option value="jakaś wartość">Jakiś opis</option>
<!-- etc. -->
</select>


Możesz oczywiście zamiast tego 'onchange="$('#form').submit();"' powyżej wrzucić kod js do head dla przejrzystości:
Kod
$(document).ready(function(){
    $('#moj_select').change(function(){
         $('#form').submit();
    });
});


Tu masz jeszcze link o select w jquery z przykładami.

I to "echo 'SELECTED'" napisałbym tak: echo 'selected="selected"'.

PS Javascript != Java
miamaji
Po pierwsze dziękuje za odpowiedź smile.gif Po drugie w 100% racja w tytule powinno być javascript. Po 3 niechcący nacisnęłam guzik: Pomogłem, czy jakoś tak. To jest mój pierwszy projekt z użyciem javascript i php i nie ukrywam mam pewne problemy z tym co napisałeś. Próbowałam zrobić to we wskazany przez Ciebie sposób aczkolwiek nic sie nie dzieje (nawet pod ff przestało mi działać) Poniżej zamieszczę kod może by ktoś mógł mi bardziej przybliżyć to wyjście
Kod
    <td>
               <select name="select_status">
                   <option onclick="$('#form_status').val('All');$('#form').submit(); <?if(empty($_POST['status']) || $_POST['status']=='All') echo 'SELECTED'?>" />All</option>
                   <option onclick="$('#form_status').val('Open');$('#form').submit(); <?if(!empty($_POST['status']) && $_POST['status']=='Open') echo 'SELECTED'?>" />Open</option>
                   <option onclick="$('#form_status').val('Closed');$('#form').submit(); <?if(!empty($_POST['status']) && $_POST['status']=='Closed') echo 'SELECTED'?>"  />Closed</option>
               </select>
             </td>
  
       <input type="hidden" name="status" id="form_status" value="<?
           if(!empty($_POST['status'])) {
               echo $_POST['status'];
           }
           ?>" />

Kod
   $sql='SELECT * FROM Table';
           $sql.=' WHERE 1=1 ';
        
           if(!empty($_POST['status'])) {
               if(in_array($_POST['status'], array('Open', 'Closed'))) {
                   $sql.=' AND Status =\''.$_POST['status'].'\'';
               }
           }

i guziczek czyszczący wszystkie opcje:
Kod
   <img src="img/w.gif" style="cursor:pointer;" onclick="$('#form_status').val('');" />


Z góry dziękuje za pomoc i proszę o wyrozumiałość gdyż jak już napisałam raczkuje w tym temacie.
ziqzaq
Hejka.
Nie wiem czy nadal chodzi o ten sam problem, ale zakładam że generujesz sobie dobry html (jak nie sprawdzałaś to to zrób winksmiley.jpg) i php nie sypie ci błędami.
Teraz pokażę ci o co mi chodzi co do tego selecta (taki poglądowy przykład, popatrz na komentarze w nim).
Plik o nazwie test.php:
  1. <?php
  2. // Mamy jakas przykladowa tablice z opcjami
  3. $opcje = array();
  4. // Wypelniam ja przykladowymi opcjami
  5. for($i = 1;$i < 5;$i++){
  6.    // Tu ustawiam domyslna wybrana opcje (pierwsza)
  7.    if ($i == 1) $wybrana_opcja = 'wartosc_opcji_'.$i;
  8.    $opcje['Opcja '.$i] = 'wartosc_opcji_'.$i;
  9. }
  10.  
  11. // Sprawdzam czy przeslano jakies dane
  12. if($_SERVER['REQUEST_METHOD'] == 'POST'){
  13.    // Tutaj wyswietlam przeslane dane z formularza (wszystkie)
  14.    print('$_POST = ');
  15.    print_r($_POST);
  16.              if(!empty($POST['moj_wybor']){
  17.                 // Tutaj wybrana wartosc select
  18.                 print('<br/>$_POST['tu_moj_wybor'] = '.$_POST['tu_moj_wybor']);
  19.                 // Teraz jesli przeslano select to trzeba ustawic ktora opcja jest
  20.                 // teraz wybrana
  21.                 $wybrana_opcja = $_POST['tu_moj_wybor'];
  22.              }
  23. }
  24. ?>
  25. <html>
  26. <head>
  27. <title>Tit</title>
  28. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  29. <script type="text/javascript" src="sciezka_do/jquery.js"></script>
  30. <script type="text/javascript">
  31. // Tutaj sprawdzamy czy caly dokument html jest zaladowany
  32. $(document).ready(function(){
  33.    // Teraz do selecta podpinam zdarzenie "onchange"
  34.    $('#moj_select').bind('change',function(){
  35.        // Gdy wartosc selecta ulegnie zmianie (change) to zatwierdzam formularz
  36.        // i wartosc wybrana w select jest przeslana tym formularzem
  37.        $('#form1').submit();
  38.    });
  39. });
  40. </script>
  41. </head>
  42. <body>
  43. <form id="form1" action="test.php" method="post">
  44.    <select id="moj_select" name="tu_moj_wybor">
  45.    <?php
  46.        foreach($opcje as $nazwa => $wartosc){
  47.            echo '<option '.(($wartosc == $wybrana_opcja) ? 'selected="selected"' : '').' value="'.$wartosc.'">'.$nazwa.'</option>';
  48.        }
  49.    ?>
  50.    </select>
  51. </form>
  52. </body>
  53. </html>

Przykład ten demonstruje użycie jquery do podpięcia zdarzenia onchange do wybranego selecta i wysłania formularza.
Przesłana jest wybrana wartość tego selecta dostępna później (po przesłaniu) w $_POST['moj_select']. Zauważ że zdarzenie onchage zadziała gdy wartość pola select ulegnie zmianie.
Ponieważ nie widzę potrzeby dodawania (po co jest to pole, skoro można tą wartość przesłać selectem?) "$('#form_status').val('All');", więc to pominąłem.
Zauważ że to twoje dodatkowe pole wyświetla to samo co select, więc po co to dublować?

Kod pisałem na szybkiego więc wybacz jeśli coś zakręciłem. winksmiley.jpg
Pozdrawiam.

Edit:
Zamiast generowania listy (zrobiłem to przykładowo) ty możesz od razu wpisać:
  1. <select id="moj_select" name="tu_moj_wybor">
  2. <option <?= (($wybrana_opcja == 'All') ? 'selected="selected"' : '') ?> value="All">All</option>
  3. <option <?= (($wybrana_opcja == 'Open') ? 'selected="selected"' : '') ?> value="Open">Open</option>
  4. <option <?= (($wybrana_opcja == 'Close') ? 'selected="selected"' : '') ?> value="Close">Close</option>
  5. </select>

bo masz tylko 3 opcje.
miamaji
Bardzo dziękuje za pomoc, pomogło. Wielkie dzięki
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.