CODEWITHSUNDEEP
javascriptphpjquery
Robert Ettinger
Robert Ettinger

Reputation: 329

Display results of Dropdown in Text fields

Am hoping to ask another question here since the main one was answered on this thread:

How fill form data from Dropdown?

Though its abit of a continuation.

I am attempting to use javascript and an onChange() function to scroll through the files and then display them in the text input and text area fields on the form however I would appreciate any help in resolving my javascript. As it stands right now I can pull the file into the dropdown menu, but when I select one from the dropdown menu, nothing happens or populates on the form.

edited to update All errors seem to be resolved however nothing gets moved into the text boxes when selecting a file from the dropdown menu.

Javascript:

 <script>

function CodeChange() {
        var filesContentJS = "$filesContents"                            
        var index = filesContentJS.selectedIndex;
        var e = document.getElementById("CodeList");
        var strUser = e.options[e.selectedIndex].value;
            strUser = "0";
            integer document.getElementById("CodeId").value = 0;
            document.getElementById("CodeName").value = "";
            document.getElementById("CodeValue").value = "";
        }
</script>

updated javascript

And the form html and php itself for reference:

<input type="hidden" name="Action" value="EDIT" /><input type="hidden" name="Selection"  id="Selection" value="-1"><div>Below is the list of your saved codes. To edit your codes, select it from the list.</div>
<select size="1" name="CodeList" id="CodeList" onchange="CodeChange();"><option value="0">(Add New Code)</option>
<?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 "<option>" . $file . "</option>";
 }
}
?>
</select>
    <h3>Saved Codes</h3>
    <form method="post" action="/evo/avsaveprocess.php">

     <input type="hidden" name="Action" value="SAVE" />
     <input type="hidden" name="CodeId" id="CodeId" value="0" />
     <table width="100%" border="0">
         <tr>
         <td>Description:</td>
         <td><input type="text" name="CodeDescription" size="40" maxlength="50" id="CodeName" value="" /></td>
          </tr>
          <tr>
          <td valign="top">Code:</td>
          <td>
            <textarea rows="10" style="width:99%" name="Code" id="CodeValue"></textarea>
               </td>
                </tr>
            </table>
            <input type="submit" value="Save" />
            </form>

Upvotes: 0

Views: 123

Answers (2)

cyadvert
cyadvert

Reputation: 875

Your PHP array is still an array. You have to convert it to JS. So, after you did all the $filesContents[$file] = file_get_contents($directory , $file);, then you need JS:

<script>
var filesContentJS = <?=json_encode($filesContents) ?>;
function CodeChange() {
var e = document.getElementById("CodeList"); // getting dropdown element
if (e.selectedIndex<=0) { // nothing selected - clean form
    document.getElementById("CodeId").value = 0;
    document.getElementById("CodeName").value = "";
    document.getElementById("CodeValue").value = "";
} else {
    var eStr = e.options[e.selectedIndex].value; // getting current element value
    // fill the form with data
    document.getElementById("CodeId").value = 0;// not sure what CodeId is - but this is the place to fill it
    document.getElementById("CodeName").value = eStr;
    document.getElementById("CodeValue").value = filesContentJS[eStr];
}
</script>

Upvotes: 1

mokiSRB
mokiSRB

Reputation: 1162

Try with

var e = document.getElementById("CodeList");
var strUser = e.options[e.selectedIndex].value;

Upvotes: 1

Related Questions