How to keep form items selected after post request?

Question

I have a simple html form. On php page. A simple list is placed on form. I submit this form (selected list items) to this page so it gives me page refresh. I want items which were POSTED to be selected after form was submited.

For my form I use such code, And It works just fine, But is it optimal or you can suggest some optimization for my code?

<form action="FormPage.php" method="post">
   <select id="Streams" class="multiselect ui-widget-content ui-corner-all" multiple="multiple" name="Streams[]">
     <?php      
     $query = "
SELECT s.streamId, s.userId, u.username
FROM streams AS s
JOIN user AS u ON s.userId = u.id
LIMIT 0 , 30
  ";
$streams_set = mysql_query($query, $connection);
    confirm_query($streams_set);    
    $streams_count = mysql_num_rows($streams_set);

while ($row = mysql_fetch_array($streams_set)){


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

      $array =  $_POST[Streams];
$count = count($array);
echo ",sid=" ;
for ($i = 0; $i < $count; $i++) {
 if($array[$i] == $row['streamId']){  echo '<option value="' , $row['streamId'] , '" selected="selected" >  ' , $row['username'] , ' (' , $row['streamId'] ,')' ,'</option> ';    }else
     {  echo '<option value="' , $row['streamId'] , '">  ' , $row['username'] , ' (' , $row['streamId'] ,')' ,'</option> ';  }
 }
} else { echo '<option value="' , $row['streamId'] , '">  ' , $row['username'] , ' (' , $row['streamId'] ,')' ,'</option> ';}

}
      </select>
      <br/>
      <input type="submit" class="ui-state-default ui-corner-all" name="submitForm" id="submitForm"  value="Play Stream from selected URL's!"/>    
  </fieldset>
</form>

Answer 1

When you receive the POST, you'll need to update the database correctly and set the selected attribute on the <option> elements. For example:

$streams = $_POST['Streams'];
$selected = array_combine($streams, array_fill(0, count($streams), true);
$query = <<<END
SELECT s.streamId, s.userId, u.username
FROM streams AS s
JOIN user AS u ON s.userId = u.id
LIMIT 0 , 30
END;
$streams_set = mysql_query($query, $connection);
confirm_query($streams_set);    
$streams_count = mysql_num_rows($streams_set);
while ($row = mysql_fetch_array($streams_set)) {
  $id = $row['streamId'];
  $sel = $selected[$id] ? ' selected' : '';
  echo '<option value="' , $row['streamId'] , '"' . $sel . '>  ' , $row['username'] , ' (' , $row['streamId'] ,')' ,'</option> ';
}

That being said, this isn't considered best practice because it can inadvertently submit the form if the user uses the back button on their browser. For this reason many people prefer to use the POST+REDIRECT+GET pattern.

In your case the script will see that it's a POST and save the data to the database. It'll then send an HTTP redirect back to the user to reload the page or load a different URL (as required). That GET request will have the saved information. This results in an extra server round trip but typically a better user experience.

Answer 2

Choice 1. Remove refresh and implement form submit using AJAX

Choice 2. Send back the post parameters to the form when it reloads as URL parameters/ or some other variable passing mechanish using sessions and show them in the form by getting the values from URL/session if the page is getting reloaded.

Answer 3

<form action="FormPage.php" method="post">
   <select id="Streams" class="multiselect ui-widget-content ui-corner-all" multiple="multiple" name="Streams[]">
     <?php      
     $query = "
SELECT s.streamId, s.userId, u.username
FROM streams AS s
JOIN user AS u ON s.userId = u.id
LIMIT 0 , 30
  ";
$streams_set = mysql_query($query, $connection);
    confirm_query($streams_set);    
    $streams_count = mysql_num_rows($streams_set);

while ($row = mysql_fetch_array($streams_set)){
 echo '<option value="' . $row['streamId'] . '"' . (in_array($row['streamId'], $_POST['Streams']) ? ' selected' : ''). '>  ' . $row['username'] . ' (' . $row['streamId'] .')' .'</option> ';
} ?>
      </select>
      <br/>
      <input type="submit" class="ui-state-default ui-corner-all" name="submitForm" id="submitForm"  value="Play Stream from selected URL's!"/>    
  </fieldset>
</form>

Answer 4

first of all the name of select field must be "Streams[]" not "Streams". Or you won't get multiple choices. Also, your code looks too spaghetty for me. I suggest you to divide it into 2 parts: business logic and presentation logic.
First, we get all data:

<?php      
$query = "
SELECT s.streamId, s.userId, u.username
FROM streams AS s
JOIN user AS u ON s.userId = u.id
LIMIT 0 , 30
";
$streams_set = mysql_query($query, $connection);
confirm_query($streams_set);    
$streams_count = mysql_num_rows($streams_set);

while ($row = mysql_fetch_array($streams_set)){
  if (in_array($row['streamId'], $_POST['Streams'])) {
    $row['sel'] = 1; 
  } else {
    $row['sel'] = 0;
  }
  $select1[]=$row;
}

Then, make it output

<form action="FormPage.php" method="post">
   <select id="Streams" class="multiselect ui-widget-content ui-corner-all" multiple="multiple" name="Streams[]">
   <? foreach ($select1 as $row): ?>
     <option value="<?=$row['streamId']?>" <?if($row['sel'])?>selected<?endif?> >
       <?=$row['username']?> ( <?=$row['streamId']?> )
     </option>
   <? endforeach ?>
   </select>
      <br/>
      <input type="submit" class="ui-state-default ui-corner-all" name="submitForm" id="submitForm"  value="Play Stream from selected URL's!"/>    
  </fieldset>
</form>

Looks neat, isn't it?