Auto populate the form fields when corresponding id is given

[vbwaj]

I want to auto populate the form fields automatically when I give the row id. Please help me to do that in PHP

code:

<label >MFD_Id</label>
  <select name="mfd_id" id="inp9" required>
  <?php 
  
  while ($mfd = mysqli_fetch_array($get_mfd))
  {
  ?>
  <option value="" name="mfd_option"><?php echo $mfd['ID'];?>  
            
 <?php 
  }
 ?>

[whispers]

Auto populate with what? What is it doing now?

[vbwaj]

So this basically retrieves the data from database table into a list down box. so when I select an id from list box, it should retrieve the data into form fields correspondent to that id

[JimL]

If you want this to happen “live” when using the page you need to include javascript.

PHP: Populate a drop down in php with the ids

JS: Make a listener for changes on the drop down

JS: On change send the selected ID to a php script using ajax

PHP: Query for the data for that spesific ID and return the data (usually in json)

JS: Retrieve the data and add it to the form fields

[whispers]

If you want help… you’ll need to provide more info that this…
You’ll need some js/jQuery to make it happen once a selection is made from the dropdown to populate some form fields…

but this is normal practice… and done all over the place… whats missing is what form field you want populated…

Side note: Is ‘name’ attribute valid for the ‘option’ tags?

Question:

What data from the dropdown are you trying to pass into the this form field? (value? label/text?)

Update:

re-read what @JimL posted…

so you want to query the database again… using the ID from the drop down?

You’ll probably have to use some AJAX to execute the query/script and then handle the field population upon success/response…

[vbwaj]

So when I select an id , the following fields must be automatically fetched from database table of that ID

Code:

  <div style="padding: 12px 16px">  
  <label >MFD_Id</label>
  <select name="mfd_id" id="inp9" required>
  
  <?php  
  while ($mfd = mysqli_fetch_array($get_mfd))
  {   
  ?>
  <option value="" name="mfd_option"><?php echo $mfd['ID'];?>             
 <?php 
  }
 ?> 
  </select></br> 
  <label >MFD Type</label>
   <input type="text" name="mfd_type" id="inp10" required><br>
   <label>MFD_Material</label>
  <input type="text" name="mfd_material" id="inp11" required><br>
  <label >MFD Vendor</label>
   <input type="text" name="mfd_vendor" id="inp12" required><br>
  <label >MFD Batch</label>
   <input type="text" name="mfd_batch" id="inp13" required><br>
   <label >MFD Received On</label>
  <input type="text" name="mfd_received_on" id="inp14" required> <br>

[JimL]

Then you want to do what I wrote up. You’ve done the first step now just make the others ^^

[phdr]

Please use bbcode [code][/code] tags or markdown (three back-ticks ```) around your code when posting it on the forum.

You haven’t shown your <form tag(s), nor have you shown any way of submitting the form(s), so we don’t know the full extent of your attempt.

There are however some issues with what you have shown -

1. Your use of <label tags is incomplete. You either need to add for=’…’ attributes to the <label …> tags or you can simply eliminate the need for an id by putting the closing </label> tag after the form field it corresponds to.
2. By using the required attribute in the <select tag, you cannot pick the first choice unless you select a different choice then reselect the first choice. However, it is customary to make the first choice a prompt to the user, with an empty value, so that they must take an action to pick an available choice. This empty value, when you validate it, should result in a user message that they must pick a choice.
3. The value=’…’ attribute should have the values you want to submit (you can leave the value=’…’ attribute out, which is not recommend, and the option label/text will get submitted.)
4. The select/option menu should be ‘sticky’ and keep any option ‘selected’ that matches an existing input value.
5. If you are not using ajax to submit the select/option choice, you should use a method=‘get’ form for it. The editing/updating of the data values should use a method=‘post’ form.
6. There is no name=’…’ attribute for an <option …> tag.
7. A closing </option> tag is required.
8. You have implied that the type=‘text’ form fields are part of the same form as the select/option menu. For this to work, without needing you to submit the form twice, which you cannot do the first time anyway since all the fields are required, you will need to use javascript/ajax, as has already been mentioned. If you are not experienced enough using javascript, you should separate the select/option menu step/form from the edit/update step/form.

I recommend that you get the first step, of being able to select and submit the MFD id, to work the way you want before you go onto the next step of validating the submitted mfd_id value, querying for and retrieving the corresponding data, and populating the edit/update form fields.