Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

dropdown generation

Posted on 2013-06-25
5
Medium Priority
?
184 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

Question has a verified solution.

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

3 proven steps to speed up Magento powered sites. The article focus is on optimizing time to first byte (TTFB), full page caching and configuring server for optimal performance.
This article discusses how to implement server side field validation and display customized error messages to the client.
Explain concepts important to validation of email addresses with regular expressions. Applies to most languages/tools that uses regular expressions. Consider email address RFCs: Look at HTML5 form input element (with type=email) regex pattern: T…
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.

705 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