PHP forms and same names

Question

Hi I have a page that contains several different forms all of which are shown/hidden on the press of the appropriate button.

Now all of them need to include some fields that are retrieved by php from the database but the problem is that my jquery code then fails to hide the fields that are declared later on.

Heres an example of my code:

<form action="controlPanel.php" method="post">
    <input class="inputFields" type="text" name="fileName" />
    <input class="inputFields" type="text" name="fname" />
    <select class="styled-select" id="nameDropdown" name='nameDropdown'>
    <option value="0"><span class="formatFreeTxt">Choose a name</span></option>
    <?php
        foreach ($GLOBALS['myDB']->getList('2') as $i) {
            echo "<option value='" . $i['email'] . "'>" . $i['fname'] . " " . $i['lname'] . "</option>";
         }
    ?>
    </select>
    <input class="inputFields" type="submit" name="textForm" />
</form>

And then I have another form on the div under the above. Like that:

<form action="controlPanel.php" method="post">
    <input class="inputFields" type="text" name="textName" />
    <input class="inputFields" type="text" name="lname" />
    <select class="styled-select" id="nameDropdown" name='nameDropdown'>
    <option value="0"><span class="formatFreeTxt">Choose a name</span></option>
    <?php
        foreach ($GLOBALS['myDB']->getList('2') as $i) {
            echo "<option value='" . $i['email'] . "'>" . $i['fname'] . " " . $i['lname'] . "</option>";
         }
    ?>
    </select>
    <input class="inputFields" type="submit" name="nextTxtForm" />
</form>

My JQuery code is:

function showHideBenef()
 {
       if($('#nameDropdown').is(':visible'))
       {
          $('#nameDropdown').fadeOut();
          $('#nameTable').fadeIn();
          $('#toggleButton').attr('value', 'Choose from existing ones');
          $('#chooseTxt').html('New Beneficiary Form');

       }
       else
       {
           $('#nameDropdown').fadeIn();
           $('#nameTable').fadeOut();
           $('#toggleButton').attr('value', 'OR Add a new one');
       }

  }

Is there any way to make this work without changing the names of each field so that I can actually catch the different posts without the need for checking all the different field names?

@radashk I've just added the JQuery code

mixkat
– mixkat

2012-08-04 14:33:58 +00:00
Commented Aug 4, 2012 at 14:33 — mixkat
– mixkat, Commented Aug 4, 2012 at 14:33

JMM · Accepted Answer · 2012-08-04 15:04:18Z

1

Get rid of all duplicate id attribute values, and then you can use the name attribute values:

function showHideBenef () {

  var nameDropdown = $( '[name="nameDropdown"]' );

  if ( nameDropdown.is( ':visible' ) ) {

    nameDropdown.fadeOut();

    // Not sure what the following elements are, might need to use
    // `name` attr or classes to select them.

    $( '#nameTable' ).fadeIn();

    $( '#toggleButton' ).attr( 'value', 'Choose from existing ones' );

    $( '#chooseTxt' ).html('New Beneficiary Form');

  }


  else {

    nameDropdown.fadeIn();

    $( '#nameTable' ).fadeOut();

    $( '#toggleButton' ).attr( 'value', 'OR Add a new one' );

  }

}
// showHideBenef

answered Aug 4, 2012 at 15:04

JMM

26.9k3 gold badges54 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

hackerone · Accepted Answer · 2012-08-04 14:31:15Z

1

the issue here is you have multiple input elements with same id & name which is not good.

why not have them as array?

so elements in form1 would be

<input type="text" name="firstform[fname]" id="firstform_fname"/>

and the elements in form2 would be

<input type="text" name="secondform[fname]" id="secondform_fname"/>

in the php script, you can get the values of the forms from $_POST['firstform'] and $_POST['secondform']

answered Aug 4, 2012 at 14:31

hackerone

3151 silver badge4 bronze badges

Comments

user1350140 · Accepted Answer · 2012-08-04 14:26:29Z

0

Just give each form a unique id attribute.

answered Aug 4, 2012 at 14:26

user1350140

Comments

Abid Hussain · Accepted Answer · 2012-08-04 14:29:21Z

0

i think set id attribute

like this

<form action="controlPanel.php" method="post"  id="form1">

or

<form action="controlPanel.php" method="post" id="form2">

answered Aug 4, 2012 at 14:29

Abid Hussain

7,7694 gold badges38 silver badges57 bronze badges

Comments

johntayl · Accepted Answer · 2012-08-04 14:32:52Z

0

You can give each input an ID attribute and use jQuery to hide/show based on the ID.

Use a prefix for the IDs so you can distinguish between the inputs such as id="textFormFileName" and id="nextTxtFormFileName"

answered Aug 4, 2012 at 14:32

johntayl

1402 silver badges8 bronze badges

Comments

mixkat · Accepted Answer · 2012-08-04 16:01:01Z

0

Ok its probably not the optimal solution but I ended up wrapping everything in a div element and then I use JQuery to hide the whole div...That way I can keep having duplicate names in different forms and jquery works fine as long as you give the divs a different id..

Thank you all for your answers!

answered Aug 4, 2012 at 16:01

mixkat

3,79510 gold badges42 silver badges62 bronze badges

2 Comments

JMM Over a year ago

Duplicate name attribute values are fine. Duplicate id attribute values are invalid HTML and will cause various problems.

mixkat Over a year ago

@JMM Yeah I know but i only need the name attribute so that I can refer to it when I catch the Post in php :)

Collectives™ on Stack Overflow

PHP forms and same names

6 Answers 6

Comments

Comments

Comments

Comments

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

Comments

Comments

Comments

Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related