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);
})
iframe正在加载到右侧页面,但没有发布到页面的帖子数据。我现在一直在敲桌子约6个小时,不知道我可能会错过什么或者做错了。这里的目标是将post $ _FILE发送到profilePhotoUpload.php页面,以便我的PHP脚本可以处理请求。但同样,没有帖子数据进入页面。
感谢您的帮助。