?
Solved

dropdown generation

Posted on 2013-06-25
5
Medium Priority
?
188 Views
Last Modified: 2013-06-26
I need some help in making the html pages in php in the attachements. Design I can manipulate. I want this in php/javascript basically scripts that can pass information from dropdowns and create new dropdowns accordingly.
dropdown.png
0
Comment
Question by:Moizsaif123
  • 3
  • 2
5 Comments
 
LVL 75

Expert Comment

by:käµfm³d 👽
ID: 39276830
I'm sorry, you want some help, or you want us to do it for you? What is your question?
0
 
LVL 4

Author Comment

by:Moizsaif123
ID: 39276938
help in the sense, say if i have a dropdown and those values as you can see, if i hit submit how can i generate dropdowns depending on that value selected. i need some logic basically, if you can provide me with 1 dropdown and an example on submit how do i generate these further dropdowns...hope being clear...
0
 
LVL 4

Author Comment

by:Moizsaif123
ID: 39277000
basically my php is not so strong...although does it make sense to do this in javascript or php
0
 
LVL 4

Author Comment

by:Moizsaif123
ID: 39280129
I've requested that this question be deleted for the following reason:

No one knows the solution to my query so closing the question
0
 
LVL 75

Accepted Solution

by:
käµfm³d   👽 earned 2000 total points
ID: 39280029
This is more a JQuery question than a PHP one, though you can certainly do this in PHP if you prefer. Here is a crude JQuery example:

<!DOCTYPE html>
<html>
  <head>
    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
    <style>
        #traveler-count span, #traveler-details span {
          display: block;
        }
        #traveler-details div {
            margin: .5em auto;
        }
        #traveler-details div div {
            margin: auto;
        }
    </style>
  </head>
  <body>
    <div id="traveler-count">
        <span>
          <select id="selAdults" name="adults">
            <option>0</option>
            <option>1</option>
            <option>2</option>
            <option>3</option>
            <option>4</option>
          </select>
          <label for="adults">Adults</label>
        </span>
        <span>
          <select id="selChildren" name="children">
            <option>0</option>
            <option>1</option>
            <option>2</option>
            <option>3</option>
            <option>4</option>
          </select>
          <label for="children">Children</label>
        </span>
        <span>
          <select id="selInfants" name="infants">
            <option>0</option>
            <option>1</option>
            <option>2</option>
            <option>3</option>
            <option>4</option>
          </select>
          <label for="infants">Infants</label>
        </span>
    </div>
    <div id="traveler-summary">
      <span>Total Travelers:</span>
      <span id="sumAdult">Adults: 0</span>
      <span id="sumChild">Children: 0</span>
      <span id="sumInfant">Infants: 0</span>
    </div>
    <div id="traveler-details">
      <div id="detAdult"></div>
      <div id="detChild"></div>
      <div id="detInfant"></div>
    </div>
    <script>
      var rowTemplate = '<div></div>';
      var selAdultTemplate = '<select><option selected>Adult</option><option>Child</option><option>Infant</option></select>';
      var selChildTemplate = '<select><option>Adult</option><option selected>Child</option><option>Infant</option></select>';
      var selInfantTemplate = '<select><option>Adult</option><option>Child</option><option selected>Infant</option></select>';
      var selPrefixTemplate = '<select><option>Mr.</option><option>Mrs.</option><option>Ms.</option></select>';
      var txtFirstNameTemplate = '<input type="text" />';
      var txtLastNameTemplate = '<input type="text" />';
      var selLocationTemplate = '<select><option>London</option><option>Madrid</option><option>Athens</option></select>';

      function setItems(containerId, itemCount, travelerTemplate) {
        var container = $(containerId);

        container.empty();

        for (var i = 0; i < itemCount; i++) {
          var row = $(rowTemplate);

          row.append($(travelerTemplate));
          row.append($(selPrefixTemplate));
          row.append($(txtFirstNameTemplate));
          row.append($(txtLastNameTemplate));
          row.append($(selLocationTemplate));

          container.append(row);
        }
      }

      $(document).ready(function() {
        $('#selAdults').change(function() {
          $('#sumAdult').text('Adults: ' + $(this).val());
          setItems('#detAdult', $(this).val(), selAdultTemplate);
        });

        $('#selChildren').change(function() {
          $('#sumChild').text('Children: ' + $(this).val());
          setItems('#detChild', $(this).val(), selChildTemplate);
        });

        $('#selInfants').change(function() {
          $('#sumInfant').text('Infants: ' + $(this).val());
          setItems('#detInfant', $(this).val(), selInfantTemplate);
        });
      });
    </script>
  </body>
</html>

Open in new window

0

Featured Post

Keep up with what's happening at Experts Exchange!

Sign up to receive Decoded, a new monthly digest with product updates, feature release info, continuing education opportunities, and more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction This article is intended for those who are new to PHP error handling (https://www.experts-exchange.com/articles/11769/And-by-the-way-I-am-New-to-PHP.html).  It addresses one of the most common problems that plague beginning PHP develop…
The title says it all. Writing any type of PHP Application or API code that provides high throughput, while under a heavy load, seems to be an arcane art form (Black Magic). This article aims to provide some general guidelines for producing this typ…
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …
Suggested Courses

621 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question