function editProfile() {
var clearBackground = document.createElement("div");
clearBackground.setAttribute("id","clearBackgroundEdit");
document.body.appendChild(clearBackground);
var div = document.createElement("div");
div.setAttribute("id","editProfileContainer");
div.innerHTML = `
<div id="listOfOptions">
<span class="editProfileTitle">Main Options</span>
<div id="chooseOptions">
<ul>
<li id="profilePhotoEdit">Choose Profile Photo</li>
<li id="changePasswordEdit">Change Password</li>
</ul>
</div>
</div>
<div id="uploadProfileImage">
<span class="editProfileTitle">Upload A Profile Photo</span>
<div id="photoUploadContainer">
<label class="fileUploader">
Select a Profile Image
<input name="profileImage" id="profileImage" class="fileUploader" type="file" />
</label>
<input type="text" name="filePath" id="filePath" value="No File" disabled="true" />
<span class="uploadPhoto" id="uploadPhoto">Upload</span>
</div>
<i id="backOptions" class="backOptions fa fa-chevron-circle-left fa-3x" aria-hidden="true"></i>
</div>
`;
document.body.appendChild(div);
JS.addListener("click","profilePhotoEdit",function() {
JS.g("listOfOptions").style.cssText="display:none;";
$("#editProfileContainer").animate({height: "200px", width: "900px"},function(){
JS.g("uploadProfileImage").style.cssText="display:block;";
});
JS.addListener("click","uploadPhoto",goPhotoUpload);
});
JS.addListener("change","profileImage",function(){
var fileType = JS.g("profileImage").value.split(".").pop().toLowerCase();
if(fileType == "jpg" || fileType == "jpeg" || fileType == "png" || fileType == "gif") {
if(JS.g('profileImage').value.length >=1) {
JS.g("filePath").value = JS.g("profileImage").value;
}
else {
JS.g("filePath").value = "No File";
}
}
else {
JS.g("filePath").value = "No File";
JS.g("profileImage").value = null;
oops("Must be a valid file type: jpg, gif, png","uploadProfileImage","152px;","400px");
}
});
JS.addListener("click","clearBackgroundEdit",closeEditProfile);
JS.addListener("click","backOptions",function(){
JS.g("uploadProfileImage").style.cssText="display:none;";
$("#editProfileContainer").animate({height: "150px", width: "500px"},function(){
JS.g("listOfOptions").style.cssText="display:block;";
JS.g("filePath").value="No File";
});
});
}
function goPhotoUpload() {
var fileType = JS.g("profileImage").value.split(".").pop().toLowerCase();
if(fileType == "jpg" || fileType == "jpeg" || fileType == "png" || fileType == "gif") {
var uploadForm = document.createElement("form");
uploadForm.setAttribute("method","post");
uploadForm.setAttribute("action","/server/profilePhotoUpload.php");
uploadForm.setAttribute("name","profilePhoto");
uploadForm.setAttribute("id","profilePhoto");
uploadForm.setAttribute("enctype","multipart/form-data");
uploadForm.setAttribute("target","uploadIframe");
document.getElementById('photoUploadContainer').appendChild(uploadForm);
var iframe = document.createElement("iframe");
iframe.setAttribute("id","uploadIframe");
iframe.setAttribute("name","uploadIframe");
iframe.setAttribute("width","500");
iframe.setAttribute("height","500");
iframe.setAttribute("style","display:block; width:500px; height:500px;");
document.body.appendChild(iframe);
JS.g("profilePhoto").submit();
document.getElementById("uploadIframe").onload = function() {
alert("Its fully loaded");
}
}
else {
JS.g("filePath").value = "No File";
oops("Must be a valid file type: jpg, gif, png","uploadProfileImage","152px;","400px");
}
}
function closeEditProfile() {
if(JS.g("editProfileContainer") && JS.g("clearBackgroundEdit")) {
$("#editProfileContainer").remove();
$("#clearBackgroundEdit").remove();
}
}
JS.load(function() {
JS.addListener("click","editProfileButton",editProfile);
})
The iframe is loading to the right page, but no post data is being sent to the page. I've been banging my head agasint the desk for about 6 hours now, not a single clue what I might be missing and or be doing wrong. The goal here is to send the post $_FILE to the profilePhotoUpload.php page so my PHP script can then handle the request. But again, no post data is making it to the page.
Thanks for any help you may have got.