title: Clear Text Box on Selection and Delete Button appear on Selection
body: <p>I have a form that users use to save information to text files, then a drop-down list that pulls the names of their files and displays that information back into the text fields, however I am trying to figure out how I can clear the text fields when selecting one value. I have an &lt; option value="0" >(Add New Code) aside from my php that is simply as a placeholder so they can use the form to save data. What I am trying to figure out is how to clear the text-boxes whenever they select that particular drop down. I would also like to add a delete button that appears whenever a file selection is made from the drop-down list. Below is my relevant coding.</p>
  
  <p><strong>thank you for the help on the display issue and css button</strong> am trying to figure out now the php script for the delete button to delete the currently selected file.</p>
  
  <pre><code>&lt;input type="hidden" name="Action" value="EDIT" /&gt;&lt;input type="hidden" name="Selection"  id="Selection" value="-1"&gt;&lt;div&gt;Below is the list of your saved codes. To edit your codes, select it from the list.&lt;/div&gt;
  &lt;select size="1" name="CodeList" id="CodeList" onchange="CodeChange();"&gt;&lt;option value="0"&gt;(Add New Code)&lt;/option&gt;
  &lt;?php
      $directory = $directory = 'users/' . $_SESSION['username'];
      $filesContents = Array();
      $files = scandir( $directory ) ;
  
       foreach( $files as $file )
      {
     if ( ! is_dir( $file ) )
    {
   $filesContents[$file] = file_get_contents($directory , $file);
  echo "&lt;option&gt;" . $file . "&lt;/option&gt;";
  }
  }
  ?&gt;
  &lt;/select&gt;
          &lt;h3&gt;Saved Codes&lt;/h3&gt;
          &lt;form method="post" action="/evo/avsaveprocess.php"&gt;
              &lt;input type="hidden" name="Action" value="SAVE" /&gt;
              &lt;input type="hidden" name="CodeId" id="CodeId" value="0" /&gt;
              &lt;table width="100%" border="0"&gt;
                  &lt;tr&gt;
                      &lt;td&gt;Description:&lt;/td&gt;
                      &lt;td&gt;&lt;input type="text" name="CodeDescription" size="40" maxlength="50" id="CodeName" value="" /&gt;&lt;/td&gt;
                  &lt;/tr&gt;
                  &lt;tr&gt;
                      &lt;td valign="top"&gt;Code:&lt;/td&gt;
                      &lt;td&gt;
                          &lt;textarea rows="10" style="width:99%" name="Code" id="CodeValue"&gt;&lt;/textarea&gt;
                      &lt;/td&gt;
                  &lt;/tr&gt;
              &lt;/table&gt;
              &lt;input type="submit" value="Save" /&gt;
              &lt;/form&gt;
  &lt;script&gt;
      $(document).ready(function(){
        // apply a change event
         $('#CodeList').change(function() {
           // update input box with the currently selected value
           $('#CodeName').val($(this).val());
           $.get( '&lt;? echo $directory ?&gt;' + '/' + $('#CodeName').val(), function( data ) {
          $( "#CodeValue" ).text( data );
      });
    });
   });
  </code></pre>