I was wondering what would be better php or Javascript for a Select tag.

[co.ador]

 <td>
     <div align="left">
      <select name="city2" id="label">
        <option value="1">La Romana </option>
        <option value="2">Rofetola</option>     
      </select>
   </div>
</td>
  
    <td bordercolor="#000000">
      <div align="right">
       <label for="neighborhood">Neighborhood:</label>
      </div>
    </td>
    <td>

     <div align="left">
      <select name="neighborhood" id="neighborhood">
        <option>Villa Verde</option>
        <option>Caleta</option>
        <option>La Aviacion </option>
        <option>Ensanche la Oz</option>
        <option>Papagayo</option>


        <option>Vista Norte</option>
        <option>Buena Vista</option>
        <option> Norte spain</option>
        <option> Norte</option>
        <option>Calofeta</option>
         
       </select>
    </div>
   </td>

 

 

In the code above there is an Select statment that lists two cities and each city will have different neighborhoods now when select city value #1 I want the first five neigborhoods to appear in the select list for neighborhoods and for the second city value #2 the rest of the neighborhoods...

 

does anybody has an idea or tutorial where I can implement that dynamic content and what would be best to use php or javascript.

[monkeytooth]

if you want them to "appear" without the page reloading. then Javascript is your only route as one of the key biggest differences between php and javascript is php renders during the pages load as where javascript can manipulate the page and its elements after it loads. In concept for what your describing either way you go is ok, it just boils down to how you want it to load out. Although chances are your going to use php with the javascript (AJAX) to make a query or put a string together of some sorts based on the selected variable. I would personally go the AJAX route. Which in turn would make this the wrong board to post on. If your unfamiliar with AJAX i would say build off a prebuilt javascript framework like jQuery as its simple to learn once you get the basic idea of how it works

[KevinM1]

The bare bones simplest way to do it is with straight JavaScript and CSS manipulation.  Build all of your selects, but set the neighborhoods with display: none.  Put an event handler on the city select that will change its corresponding neighborhood select so it has display: block.

 

The more elegant solution would be to us ajax to populate the neighborhood select based on the value of the city select.  The structure of this would be similar to that of the first solution, but the devil is in the details.

[co.ador]

using ajax by populating the cities and display them by the city value would require to make a table in the data base where it store neighborhoods by city in other words one database for each group of neighborhoods right?

[KevinM1]

using ajax by populating the cities and display them by the city value would require to make a table in the data base where it store neighborhoods by city in other words one database for each group of neighborhoods right?

 

Not an entirely different db, but a neighborhoods table, yes.  You'd need something like:

 

City Table:

id                        name

1                        Someplace

2                        Someplace Else

.

.

.

 

Neighborhood Table:

id                  city_id                    name

1                  4                            Some Neighborhood in City 4

2                  4                            Another Neighborhood in City 4

3                  11                          Some Neighborhood in City 11

4                  2                            Some Neighborhood in City 2

.

.

.

 

There's a one-to-many relationship here: one city contains many neighborhoods.  In order to model that in the db, you need your neighborhoods to know which city they reside in.  This is done by adding the proper city id to their row of information.  The city id acts as a foreign key.