How to populate a Form field

I have an Upload Form where an image is chosen to be uploaded, and the code generates a new file name for it, and then moves the image file to the uploads/ folder.

I’m looking for help having a Form field to be automatically populated with the images’ path/link, before the Form gets submitted? Any help will be appreciated. Here’s the current code. Any help will be appreciated. Thanks.

if ($form_submitted == 'yes') {
$allowedExts = array("gif", "jpeg", "jpg", "png");
$temp = explode(".", $_FILES["file"]["name"]);
$extension = strtolower( end($temp) );
if (  $_FILES["file"]["size"] < 2000000
&& in_array($extension, $allowedExts) )
{
if ($_FILES["file"]["error"]!= 0)
{
echo "Return Code: " . $_FILES["file"]["error"] . "<br>";
} else {
$length = 20;
$randomString = substr(str_shuffle(md5(time())),0,$length);
$newfilename = $randomString . "." . $extension;
move_uploaded_file($_FILES["file"]["tmp_name"], "upload/" . $newfilename );
$file_location = '<a href="http://www.---.com/upload/' . $newfilename . '">http://www.---.com/upload/' . $newfilename . '</a>';
echo $file_location;
}
} else {
        echo "Invalid upload file";
      }
  $description = $description . " \n " . $newfilename;
    }

HTML:

        <div id="upload-video">
          <ul>
            <li style="width:240px; text-align:right;"><strong>[var.lang_title]:</strong></li>
            <li style="width:400px; text-align:left;"><input name="title" type="text" class="upload-video-form-input" value="[var.title]" size="38" />
            </li>

            <li style="width:240px; text-align:right;"><strong>[var.lang_description]:</strong></li>
            <li style="width:400px; text-align:left;"><textarea rows="4" name="description" cols="29" class="upload-video-form-input">[var.description]</textarea>
            </li>

            <li style="width:240px; text-align:right;"><strong>[var.lang_tags]:</strong></li>
            <li style="width:400px; text-align:left;"><input name="tags" type="text" class="upload-video-form-input" value="[var.tags]" size="38" />
            </li>

            <li style="width:240px; text-align:right;">&nbsp;</li>
            <li style="width:300px; text-align:left;" class="upload-video-tags">
            [var.lang_enter_tags].<br />
                  [var.lang_enter_tags_description].</li>


                <li style="width:240px; text-align:right;">
                 <!--<label for="file">Filename:</label>-->
                **<input type="file" name="file" id="file">**


            <li style="width:240px; text-align:right;"><strong>[var.lang_select_channel]:</strong></li>
            <li style="width:400px; text-align:left;">
              <select class="upload-video-form-input" style="width:160px;" size="1" name="channel" onchange="javascript:ahahscript.ahah('[var.base_url]/uploader.php?sub_cat='+ document.form_upload.channel.value, 'sub_change', '', 'GET', '', this);">
              &nbsp;[var.fields_all;htmlconv=no]</select>&nbsp;([var.lang_select_one])
            </li>

            <li style="width:240px; text-align:right">&nbsp;</li>
            <li style="width:380px" class="font5_14"><strong>[var.lang_sub_categories]</strong></li>

            <li style="width:240px; text-align:right"><strong>[var.lang_sub_cat]:&nbsp;</strong></li>
            <li style="width:400px; text-align:left;" id="sub_change"><select class="upload-video-form-input" style="width:160px;" size="1" name="sub_cat"></select>&nbsp;([var.lang_optional])</li>

            <li style="width:240px; text-align:center">&nbsp;</li>
            <li class="font5_14" style="width:380px;"><strong>[var.lang_optional_info]</strong></li>

              <li style="width:240px; text-align:right"><strong>[var.lang_location_recorded]:</strong></li>
              <li style="width:400px; text-align:left;"><input name="location_recorded" type="text" class="upload-video-form-input" value="[var.location_recorded]" size="25" />
              </li>

              <li style="width:240px; text-align:right"><strong>[var.lang_allow_comm]:</strong></li>
              <li style="width:400px; text-align:left;">
              <select class="upload-video-form-input" size="1" name="allow_comments">
                <option value="yes" selected="selected">[var.lang_yes]</option>
                <option value="no">[var.lang_no]</option>
              </select>
            </li>

              <li style="width:240px; text-align:right"><strong>[var.lang_allow_embed]:</strong></li>
              <li style="width:400px; text-align:left;">
              <select class="upload-video-form-input" size="1" name="allow_embedding">
                <option value="yes" selected="selected">[var.lang_yes]</option>
                <option value="no">[var.lang_no]</option>
              </select>
            </li>

              <li style="width:240px; text-align:right"><strong>[var.lang_private_pub]:</strong></li>
              <li style="width:400px; text-align:left;">
                 <select class="upload-video-form-input" size="1" name="public_private">
                   <option value="public" selected="selected">[var.lang_public]</option>
                   <option value="private">[var.lang_private]</option>
                 </select>
               </li>

               <li style="width:240px; text-align:right">&nbsp;</li>
               <li style="width:400px; text-align:left;">
                 <input class="button-form" type="submit" value="Next &gt;&gt;" name="B3" />
               </li>
             </ul>
        </div>
        <input class="upload-video-form-input" type="hidden" name="form_submitted" value="yes" />
      </form>
      <div class="clear-fix"></div>
    </div>
  <div class="container-wide-footer"></div>

So what you want is for the system to generate a file URL before it knows what file is going to be uploaded?

Thanks for your reply.
As far as I can tell by this code, after the file is chosen and renamed and moved to the uploads/ folder all the information needed for a URL is available, the file name and location correct?

This is the key phrase in your first post.

PHP does not operate while the user is using the webpage.

furthermore, since your system relies on a string-shuffled-md5 of the current timestamp, your form cannot know the end result before form submission (because the time changes). Only AFTER submission can it know what the final filename will be.

Thanks for your reply.
So, I would need to execute the image upload and then have the field populated?
If so, is there a way to do that on the same page as where the fields are?

Well sure you can do that; have the form call action=“” or action=“?”; and then include the form parsing logic inside the form page. (remove the else from your outer if). The person will click the button, the page will load, process the file, and then output the form again.

Thanks for that.
I’m not so clear on “include the form parsing logic inside the form page” and “remove the else from your outer if”. Any further clarification will be much appreciated.

The parsing logic = the first block of code you posted in this thread. Put it into the form page; but dont include the last “else” bit (because if there was no file submitted, we just want to show the form.)

EDIT: Or… are you usign a templating scheme?

Thanks for your reply/clarification. Much appreciated
Yes, templating

So the first block of code goes into the logic page for the form. (Without knowing how your page setup works, thats kind of the best i can say)

Thanks again. So, get rid of this part?

You will need the first } (to close the IF), but get rid of the else { … } (The else is just “there was no form submitted, which is fine, display the form.”)