Button który przekierowuje do danej strony

0

Witam !

Mam taki problem. Chcę zrobić tak że button będzie przekierowywał do jakiejś strony ale strona ta będzie zmieniała się w zależności od tego jaką miejscowość wybierzemy. Poniżej jest kod strony:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>Kociewie</title>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-2" />
<meta http-equiv="Reply-to" content="xxxxxxxxxxxxxx" />
<meta name="Author" content="xxxxxxxx" /><style type="text/css">
#sidebar {
  width: 0px;
}

#content {
  width: 770px;
}

#button, #button-remote {
  display: none;
}

</style>

</head>

<body>
<body>
<CENTER><img src="kociewie.jpg" alt="Tekst" /></CENTER>
<p>Nazwa <INPUT TYPE="text" NAME="list" SIZE="40"
MAXLENGTH="35"></p>
Powiat
    <div id="content">
    <div class="entry">
      <form>
        <select id="mark">
          <option value="">--</option>
          <option value="stg">Starogardzki</option>
          <option value="swi">Swiecki</option>
          <option value="tcz">Tczewski</option>
        </select>
<p>Gmina</p>
        <select id="series">
          <option value="">--</option>
          
          <option value="series-1" class="stg">Starogard Gdanski</option>
          <option value="series-3" class="stg">Skarszewy</option>
          <option value="series-5" class="stg">Lubichowo</option>
          <option value="series-8" class="stg">Skorcz</option>

          <option value="a1" class="swi">Swiecie</option>
          <option value="a3" class="swi">Nowe</option>
          <option value="s3" class="swi">Bukowiec</option>
          <option value="a4" class="swi">Jezewo</option>

          <option value="a5" class="tcz">Tczew</option>
          <option value="a6" class="tcz">Pelplin</option>
          <option value="a6" class="tcz">Subkowy</option>
          <option value="a6" class="tcz">Morzeszczyn</option>

          

        </select>
<p>Miejscowosc</p>
        <select id="model">
          <option value="">--</option>
          
          <option value="lin"       class="series-1">Linowiec</option>
          <option value="jab"       class="series-1">Jablowo</option>
          <option value="owi"       class="series-1">Owidz</option>

          <option value="bol"       class="series-3">Boleslawowo</option>
                    
          <option value="czap"        class="a1">Czapelki</option>
          <option value="ern"         class="a1">Ernestowo</option>
         </select>
<p>Rodzaj obiektu</p>
        <select id="engine">
          <option value="">--</option>   
          <option value="hot" class="series-1 series-3 a1">Hotel</option>
          <option value="sklep" class="series-1 series-3 a1">Sklep</option>
          <option value="klub" class="series-1 series-3 a1">Klub Sportowy</option>
          <option value="dysk" class="series-1 series-3 a1">Dyskoteka</option>

 </select>
        
       <a href=https://www.google.pl/><button id="button" type="button" class="lin">Szukaj</button>
             </form></a>
      
                  
    
   
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
  <script src="jquery.chained.js" type="text/javascript" charset="utf-8"></script>
  <script src="jquery.chained.remote.js" type="text/javascript" charset="utf-8"></script>
  <script type="text/javascript" charset="utf-8">
  $(function() {
    
    /* For jquery.chained.js */
    $("#series").chained("#mark");
    $("#model").chained("#series");
    $("#engine").chained("#series, #model");
    
    /* Show button after each pulldown has a value. */
    $("#engine").bind("change", function(event) {
        if ("" != $("option:selected", this).val() && "" != $("option:selected", $("#model")).val()) {
            $("#button").fadeIn();
        } else {
            $("#button").hide();          
        }
    });
    
    $("#c").chained("#a,#b");

    /* For jquery.chained.remote.js */    
    $("#series-remote").remoteChained("#mark-remote", "json.php");
    $("#model-remote").remoteChained("#series-remote", "json.php");
    $("#engine-remote").remoteChained("#series-remote, #model-remote", "json.php");
    
    /* Show button after each pulldown has a value. */
    $("#engine-remote").bind("change", function(event) {
        if ("" != $("option:selected", this).val() && "" != $("option:selected", $("#model-remote")).val()) {
            $("#button-remote").fadeIn();
        } else {
            $("#button-remote").hide();          
        }
    });
    
    
    
    $("#c-remote").remoteChained("#a-remote,#b-remote", "json.php");
    
  });
  </script>

  <script src="http://www.google-analytics.com/urchin.js" type="text/javascript"></script>
  <script type="text/javascript">
    _uacct = "UA-190966-1";
    urchinTracker();
  </script>

</body>
</html>

Czyli że gdy wybierzemy np. Linowiec to przeniesie nas do strony: abc1.html gdy wybierzemy Jabłowo to button nas przeniesie do abc2.html.

Proszę o pomoc ;).

0

Dobra, teraz już odpowiem poprzez odpowiedź: Co to człowieku jest?!

<a href=https://www.google.pl/><button id="button" type="button" class="lin">Szukaj</button></form></a>
  1. Gdzie cudzysłów przy atrybucie href?
  2. <button> nie może być zawarty w <a>
  3. Zamykasz </form> tak gdzieś z du** za przeproszeniem w środku innych tagów?
<button class="lin" id="szukajka">szukaj</button>
$(document).ready(function(){
  $('#szukajka').click(function(){
    var val = $('#model option:selected').attr('value');
    window.document.location.href=val+".html";
    return false;
  });
});
0

Dzięki wielkie ;). Nie jestem za bardzo doświadczony więc wiesz popełniam błędy ;).

0

A jak zrobić żeby strona na którą się przeniesie była zależna od wyboru Miejscowości i Rodzaju obiektu ? Proszę bardzo o pomoc po raz 2 :D. Będę niezmiernie wdzięczny ;).

0

Każde IDE Cie opieprzy za taką składnię - zainstaluj jakieś ;)

0

Ok pobrałem edytor html więc teraz będę miał "szersze pole widzenia" :). A pytanko ponawiam.

0

Jak zrobić żeby strona na którą się przeniesie była zależna od wyboru Miejscowości i Rodzaju obiektu ? Proszę bardzo o pomoc po raz 2 :D. Będę niezmiernie wdzięczny ;).

0

pomyśl trochę co robi kod, który Ci dałem. przecież to analogicznie wyciągniesz kolejne dane z innego selecta który ma tylko inną nazwę..

0

Czyli:

$(document).ready(function(){
  $('#szukajka').click(function(){
    var val = $('#engine option:selected').attr('value');
    window.document.location.href=val+".html";
    return false;
  });
});

Tylko żeby zadziałało wraz z połączeniem model to trzeba z tym:

window.document.location.href=val+".html";

coś zrobić.Tak ? Bo jeżeli tak to nie mam pojęcia jak xd.

0

prostego łączenia zmiennych nie ogarniasz? I jeszcze zastępujesz poprzedni kod, choć chciałeś (chyba) naraz korzystać z dwóch wartości?

0

Proszę złączysz mi to ? Nie ogarniam tego a na jutro muszę dokończyć...

1

Czyli zadanie domowe?
No to nieźle jak nie potrafisz łączyć stringów. Czyli generalnie nic nie potrafisz.

Coś takiego?

$(document).ready(function(){
  $('#szukajka').click(function(){
    var series = $('#series option:selected').attr('value');
    var model = $('#model option:selected').attr('value');
    var engine = $('#engine option:selected').attr('value');
    window.document.location.href=series+"-"+model+"-"+engine+".html";
    return false;
  });
});

Kod widzę zdzierany z neta, nawet ID nie pasują do zawartości... Ech, szkoda słów.

0
$(document).ready(function(){
  $('#szukajka').click(function(){
    var series = $('#series option:selected').attr('value');
    var model = $('#model option:selected').attr('value');
    var engine = $('#engine option:selected').attr('value');
    window.document.location.href=series+"-"+model+"-"+engine+".html";
    return false;
  });
});

Był błąd chyba

    window.document.location.href=series+model+engine+".html";

Tak powinno być bo gdy tak mam to mi działa :)

1 użytkowników online, w tym zalogowanych: 0, gości: 1