How to display back data in option value in option list after user select data-CodePudding

User already choose the option value and the data will entered database. I wanted to display back the data choose by user in option ways so when they wanted to edit just click on the option value.

<div >
      <div >
        <label for="sector">1. Type of Sectors</label>
      </div>
      <div >
        <select id="sector" name="sector" required>
          <option value ="choose">Choose type of sector...</option>  
          <option value="National DefenceSecurity">National Defence and Security</option>
          <option value="banking & Finance">Banking and Finance</option>
          <option value="Information & Communication">Infomation and Communication</option>
          <option value="Energy">Energy</option>
          <option value="Transportation">Transportation</option>
          <option value="Water">Water</option> 
          <option value="Health services">Health Services</option>
          <option value="Government">Government</option>
          <option value="Emergency Services">EmergencyServices</option>
          <option value="Agriculture&food">Agriculture and Food</option>
          <option value="Other">Other</option> 
        </select>

what should I change on this code ? or have to add other code to insert the function.

should be display the user option before want to exchange the data/Update

CodePudding user response：

At the time of update you come with a previously selected value like your previously selected value stored in a variable $slctr you have to check all the option one by one with $slctr variable if value match any option make it select. Then your edit code will be like.

<div >
      <div >
        <label for="sector">1. Type of Sectors</label>
      </div>
      <div >
        <select id="sector" name="sector" required>
          <option value ="choose" <?= $slctr=="choose"?"selected":"" ?> >Choose type of sector...</option>  
          <option value="National DefenceSecurity" <?= $slctr=="National DefenceSecurity"?"selected":"" ?> >National Defence and Security</option>
          <option value="banking & Finance" <?= $slctr=="banking & Finance"?"selected":"" ?>>Banking and Finance</option>
          <option value="Information & Communication" <?= $slctr=="Information & Communication"?"selected":"" ?>>Infomation and Communication</option>
          <option value="Energy" <?= $slctr=="Energy"?"selected":"" ?>>Energy</option>
          <option value="Transportation" <?= $slctr=="Transportation"?"selected":"" ?>>Transportation</option>
          <option value="Water" <?= $slctr=="Water"?"selected":"" ?>>Water</option> 
          <option value="Health services" <?= $slctr=="Health services"?"selected":"" ?>>Health Services</option>
          <option value="Government" <?= $slctr=="Government"?"selected":"" ?>>Government</option>
          <option value="Emergency Services" <?= $slctr=="Emergency Services"?"selected":"" ?>>EmergencyServices</option>
          <option value="Agriculture&food" <?= $slctr=="Agriculture&food"?"selected":"" ?>>Agriculture and Food</option>
          <option value="Other" <?= $slctr=="Other"?"selected":"" ?>>Other</option> 
        </select>
      </div>
    </div>

CodePudding user response：

You can done it by using jquery also

var response = {};
response.val = "Energy";
$("#sector option[value='"   response.val  "']").attr("selected", "selected");

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="sector" name="sector" required>
          <option value ="choose">Choose type of sector...</option>  
          <option value="National DefenceSecurity">National Defence and Security</option>
          <option value="banking & Finance">Banking and Finance</option>
          <option value="Information & Communication">Infomation and Communication</option>
          <option value="Energy">Energy</option>
          <option value="Transportation">Transportation</option>
          <option value="Water">Water</option> 
          <option value="Health services">Health Services</option>
          <option value="Government">Government</option>
          <option value="Emergency Services">EmergencyServices</option>
          <option value="Agriculture&food">Agriculture and Food</option>
          <option value="Other">Other</option> 
        </select>