re-establishing multiple selections in a dropdown menu in PHP/HTML

Hey, I've got this multi-select listbox...

<select id="extfeat" name="extfeat[]" size="6" multiple="">  
    <option value="Wheel_Chair Accessible">Wheel Chair Accessible</option>  
    <option value="Fruit_Trees">Fruit Trees</option>   
    <option value="Large_Trees">Large Trees</option>   
    <option value="Rolling">Rolling</option>   
    <option value="Other">Other</option>   
    <option value="Level">Level</option>   
    <option value="Wooded">Wooded</option>   
    <option value="Outbuildings">Outbuildings</option>   
    <option value="Gazebo">Gazebo</option>   
    <option value="Workshop Area">Workshop Area</option>   
    <option value="Sauna">Sauna</option>   
    <option value="Courtyard">Courtyard</option>   
    <option value="Lake_Access">Lake Access</option>   
    <option value="Tillable">Tillable</option>   
    <option value="Deck">Deck</option>   
    <option value="Lakeview">Lakeview</option>   
    <option value="Propane_Tank_-_Leased">Propane Tank - Leased</option>   
    <option value="Dock">Dock</option>   
    <option value="Landscaped">Landscaped</option>  
    <option value="Propane_Tank - Owned">Propane Tank - Owned</option>   
    <option value="Fenced_Yard">Fenced Yard</option>   
    <option value="Water_Frontage">Water Frontage</option>   
    <option value="Concrete_Parking">Concrete Parking</option>   
    <option value="Pond">Pond</option>   
    <option value="Tennis_Court">Tennis Court</option>   
    <option value="Circle_Drive">Circle Drive</option>   
    <option value="Horses_Allowed">Horses Allowed</option>   
    <option value="Patio_Enclosed">Patio Enclosed</option>   
    <option value="Sprinkler_System">Sprinkler System</option>   
    <option value="Brick_Trim">Brick Trim</option>   
    <option value="Guest_House">Guest House</option>   
    <option value="Terraced">Terraced</option>   
    <option value="Hot_Tub">Hot Tub</option>   
    <option value="Outdoor_Sign">Outdoor Sign</option>   
    <option value="Garden">Garden</option>   
    <option value="Above_ground_pool">Above ground pool</option>   
    <option value="Ground_Lvl_Access">Ground Lvl Access</option>   
    <option value="Handicap_Access">Handicap Access</option>   
    <option value="Patio">Patio</option>  
    <option value="Garage_Opener">Garage Opener</option>   
    <option value="In-ground_Pool">In-ground Pool</option>   
    <option value="Greenhouse">Greenhouse</option>   
    <option value="Pasture">Pasture</option>   
    <option value="Shed">Shed</option>   
    <option value="Boat_House">Boat House</option>   
    <option value="Antenna">Antenna</option>   
    <option value="Generator">Generator</option>   
    <option value="Asphalt_Parking">Asphalt Parking</option>   
    <option value="Sloping">Sloping</option>   
    <option value="Porch">Porch</option>   
    <option value="Satellite_Dish">Satellite Dish</option>   
    <option value="Screened_Porch">Screened Porch</option>   
    <option value="Underground_Pet_Fence">Underground Pet Fence</option>   
    <option value="Pool">Pool</option> 

  </select>

Let's say a user selects 7 options and does a search...my search includes a refine option and many other fields are saved and stored in a hidden div that can be retrieved by pressing a button...

The issue is that the extfeats[] variable doesn't keep the selections after the POST...I need to find a way to transfer the existing multi-selections as default.

phphtmlmulti-select

Answer №1

If you have knowledge of the options that were chosen, you can set them as default selections using: selected="selected":

<select id="extfeat" name="extfeat[]" size="6" multiple="">  
  <option value="Wheel_Chair Accessible">Wheel Chair Accessible</option>  
  <option value="Fruit_Trees" selected="selected">Fruit Trees</option>
  // ..
</select>

As a side note, multiple="" should probably be changed to multiple="multiple".

Answer №2

Well, surprisingly enough, it was easier than I had initially anticipated.

<select id="extfeat" name="extfeat[]" size="6" multiple="">  
  <option value="Wheel_Chair Accessible" <? if (in_array("Wheel_Chair Accessible",$extfeat)) echo "selected" ?> >Wheel Chair Accessible</option>  
  <option value="Fruit_Trees" <? if (in_array("Fruit_Trees",$extfeat)) echo "selected" ?>>Fruit Trees</option>  
  ...

A big thank you to Frits van Campen for giving me that gentle nudge in the right direction ;)

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Tips for updating the content of a div with the click of another div

Is there a way to dynamically change the content of a div upon clicking on a menu item? Here is the current layout for reference: https://i.stack.imgur.com/nOnlQ.png Below is the CSS and HTML code snippet: body { background-color: #555657; ...

javascripthtmlcss

Is there a way for me to insert a variable into the src attribute of my img tag like this: `<img alt="Avatar" src=`https://graph.facebook.com/${snAvatarSnuid}/picture`>`

I need assistance with passing a variable called snAvatarSnuid within the img src tag, specifically after facebook.com/ and before /picture as shown below: <img alt="Avatar" src=`https://graph.facebook.com/${snAvatarSnuid}/picture`> Note: 1) The ht ...

javascripthtmlvue.jsvuejs2web-frontend

How can the onclick attribute be modified in an HTML document?

I am looking to update the data-pro-bar-percent attribute of a progress bar from 80 to 100 when a specific link is clicked. The change in attribute needs to be as follows: data-pro-bar-percent="80" --> data-pro-bar-percent="100" This is the current HTML ...

javascriptjqueryhtml

Essential Understanding of HTML Query Strings Required

As a newcomer to the world of web design, I have taken on what seems like a challenging task for me: creating a webpage that can send a query string to the German Railway website (bahn.de) with the parameters I input. My question now is whether there is a ...

javascripthtmlstring

Having trouble with jQuery validation: Seeking clarification on the error

I have implemented some validations on a basic login page and added jQuery validation upon button click. However, the code is not functioning as expected. I have checked the console for errors but none were displayed. Here is the code for your review: ...

javascriptjqueryhtml

Error: Unable to access the 'version' property of null

Having trouble installing any software on my computer, I've attempted various solutions suggested here but none have been successful. $ npm install axios npm ERR! Cannot read property '**version**' of null npm ERR! A complete log of this ru ...

javascripthtmlnode.jsreactjsnpm

JavaScript doesn't automatically redirect after receiving a response

Hey there, I'm attempting to implement a redirect upon receiving a response from an ajax request. However, it seems that the windows.href.location doesn't execute the redirect until the PHP background process finishes processing. Check out my cod ...

javascriptphpjqueryajax

Different option for positioning elements in CSS besides using the float

I am currently working on developing a new application that involves serializing the topbar and sidebar and surrounding them with a form tag, while displaying the sidebar and results side by side. My initial attempt involved using flex layout, but I have ...

javascripthtmlcss

Is the initial carousel element failing to set height to 100% upon loading?

If you take a look here, upon loading the page you will notice a DIV at the top. It is labeled "content" with "content_container" wrapped around it and finally, "page" around that. Clicking the bottom left or right arrows reveals other DIVs with similar ta ...

javascripthtmlcssheightalignment

Why isn't my Bootstrap dropdown displaying any options?

I am new to web development and attempting to create a button that triggers a dropdown menu when clicked. I have tried the following code, but for some reason, the dropdown is not working correctly. Can anyone help me identify the issue or correct my code? ...

javascripthtmlbootstrap-4

Upon opening index.html in the browser, the jQuery code fails to execute, as no errors are displayed in the console

I am struggling to make a simple toggleClass() function work in jQuery and I can't seem to figure out why. This is just a beginner exercise for me with jQuery. The code works perfectly when I test it as a snippet or manually in the console, but when I ...

javascriptjqueryhtmlcss

I need help figuring out how to mention an id using a concatenated variable in the jquery appendTo() method

Using jQuery, I am adding HTML code to a div. One part of this code involves referencing a div's ID by concatenating a variable from a loop. $(... + '<div class="recommendations filter" id="recCards-'+ i +'">' + &apo ...

javascriptjqueryhtmlcssconcatenation

Feeling lost when it comes to forms and hitting that submit button?

Below is a sample form structure: <html> <head> <title>My Page</title> </head> <body> <form name="myform" action="http://www.abcdefg.com/my.cgi" method="POST"> <div align="center"> <br><br; <br& ...

javascripthtmlcss

Combining various postponed JavaScript file imports in the HTML header into a single group

I've been facing an issue with my code structure, particularly with the duplication of header script imports in multiple places. Every time I need to add a new script, I find myself manually inserting <script type="text/javascript" src=&q ...

javascripthtmljquery

Having trouble with a JavaScript function as a novice coder

Hello, I'm still getting the hang of JavaScript - just a few days into learning it. I can't figure out why this function I'm calling isn't functioning as expected. Here's the content of my HTML page: <!doctype html> <htm ...

javascripthtml

What is the process for configuring environmental variables within my client-side code?

Is there a reliable method to set a different key based on whether we are in development or production environments when working with client-side programs that lack an inherent runtime environment? Appreciate any suggestions! ...

javascripthtmlnode.js

Looking for assistance with resizing and repositioning an image within a viewport?

The JSFiddle code can be found at this link - https://jsfiddle.net/pmi2018/smewua0k/211/ Javascript $('#rotate').click(function(e) { updateImage(90, 0) console.log("rotation"); }); $('#zoom-in').click(function() { updateImage(0 ...

javascripthtmljquerycss

Is there a way to enable Fancybox to change to the adjacent gallery by simply using the 'up' or 'down' arrow keys?

I am currently working on a layout that consists of a vertical column of thumbnail images, each linked to its own gallery with additional images. When the user clicks on a thumbnail image, Fancybox opens, allowing them to navigate through the images within ...

javascriptjqueryhtmlcssfancybox

Utilizing Bootstrap Modal to Display PHP Data Dynamically

Modals always pose a challenge for me, especially when I'm trying to work with someone else's code that has a unique take on modals that I really appreciate (if only I can make it function correctly). The issue arises when the modal is supposed ...

javascriptphptwitter-bootstrapbootstrap-modal

Retrieve the Nth class of an element that has multiple classes without relying on the .attr("class") method in jQuery

Within a container with two styles, the initial nested div <div class="datacheck"> <div class="classic_div_data customdataid_305"> some values are included here </div> <div class="optiondiv"> </div> </div& ...

javascriptjqueryhtml