How to do a form with "List/Menu" dynamically

[lopes_andre]

Hi,

 

I need a clue on how to do a form with a "List/Menu" that when I choose one value on the "List" the page will reload and show that "List/Menu" and other new one.

 

There are exemples on how to do this?

 

Best Regards,

[litebearer]

perhaps via javascript and/or ajax

[Jerred121]

sounds like you may have to be a little more specific...  what kind of list are we talking about? ul? select? something else?

[lopes_andre]

Hi,

 

Thanks for the reply's.

 

I will be a little bit more specific:

 

<select name="decision" id="decision">
    <option value="0" selected></option>
    <option value="a">Aprove</option>
    <option value="n">Not Aprove</option>
</select>

 

For example, If I choose the value "n" I need to show one new text box on the Form. I know that this must be done with JavaScript and using the "OnChange" on the "Select Box", but I need an example on how to do this.

 

Best Regards,

[Jerred121]

It should like you don't need to reload the page for any reason, because AJAX would handle this.  As far as a clear example of how to do this... I would look at w3schools' AJAX examples: http://www.w3schools.com/php/php_ajax_intro.asp AJAX is actually really simple as it just passes a value to another .php file and the .php file does all of the work, spits it back to AJAX and Javascript writes the results to the output page.

 

Basically your flow will be:

 

Select option -> Call javascript function -> Pass value to .php file (using $_GET is easy) -> Receive value in .php file -> build another select element -> Echo the select -> Ajax gets it back -> JS writes it to the page...

[objnoob]

A lot more can go wrong using AJAX and you introduce 2 new syntaxes Javascript and XML!

 

I'd stick with a simple control flow in PHP that determines at which stage the user is as far as nagivating through the form. You can keep track by using sessions or hidden inputs <input type='hidden' name='stage' value='step1'/>

 

if (isset($_POST['stage']){

  $stage = $_POST['stage'];

}else{

  $stage = 0 // the beginning

}

 

if ($stage == 0){

    // print the first form

}elseif ($stage == 1){

// get values from database based on first form's values

// print second form using the database values

}elseif ($stage == 2){

// save all of the form to the database

}

[lopes_andre]

I prefer to do it with JavaScript only, because I will be dealing with IE, FF, Chrome, Safari, etc...

 

There are some examples of doing this out there?

 

Best Regards,

[objnoob]

Well, if you wanna use javascript only, you'll have nothing on the server processing the forms. You'll need atleast PHP to process the postback and HTML to display the form on the browser.

 

If you're not familiar with HTML, PHP, Javascript, DOM, XML, etc, you can only learn so much in one day! I'd stick with a simple pure HTML & PHP  solution.

 

See my example in the previous post...

[objnoob]

Also unobtrusive scripting is a lot harder involving javascript. Javascript reacts different on different browsers. PHP doesn't care which browser is used, and as long as it's valid HTML you are sending to the browser it will all work the same.

[Jerred121]

A lot more can go wrong using AJAX and you introduce 2 new syntaxes Javascript and XML!

 

I'd stick with a simple control flow in PHP that determines at which stage the user is as far as nagivating through the form. You can keep track by using sessions or hidden inputs <input type='hidden' name='stage' value='step1'/>

 

if (isset($_POST['stage']){

  $stage = $_POST['stage'];

}else{

  $stage = 0 // the beginning

}

 

if ($stage == 0){

    // print the first form

}elseif ($stage == 1){

// get values from database based on first form's values

// print second form using the database values

}elseif ($stage == 2){

// save all of the form to the database

}

Who said anything about XML? AJAX just allows javascript and php to communicate with each other, that's it... Not a whole lot more can go wrong really... and the JS is extremely simple to implement, all of the coding is done via php.

[objnoob]

Sure you can use .responseText but if you really wanna harness the power of AJAX you use .responseXML.

 

XML is what makes AJAX what it is. Just like HTML makes HTTP what it is.

[Jerred121]

but if xml isn't necessary, which it doesn't sound like it in OP's case... What's wrong with Text?

[objnoob]

Because Text should only be used to Debug.. MuHaHa