Hello,

I was wondering if someone would be able to help me with auto uploading of a cck imagefield on the node edit page once an image is selected and also hide the upload button. I'm not a programmer but I think if the user does not have javascript enabled then the upload button should show?

The cck field is called field_profile_pic and it allows max 1 image to be uploaded.

The page source in the node edit for the imagefield looks like:

<div id="edit-field-profile-pic-0-ahah-wrapper"><div id="edit-field-profile-pic-0-wrapper" class="form-item">
  <label for="edit-field-profile-pic-0"> Profile Picture:</label>
  <div class="filefield-element clear-block"><div class="widget-edit"><input type="hidden" class="filefield-progress" value="b1670a84fcff325f6931c50a38fa9da2" id="edit-field-profile-pic-0-APC-UPLOAD-PROGRESS" name="field_profile_pic[0][APC_UPLOAD_PROGRESS]">
  <input type="hidden" value="0" id="edit-field-profile-pic-0-fid" name="field_profile_pic[0][fid]">
  <input type="hidden" value="1" id="edit-field-profile-pic-0-list" name="field_profile_pic[0][list]">
  <div id="edit-field-profile-pic-0-upload-wrapper" class="form-item">
    <div class="filefield-upload clear-block"><input type="file" size="22" id="edit-field-profile-pic-0-upload" class="form-file" accept="png,gif,jpg,jpeg" name="files[field_profile_pic_0]">
    <input type="submit" class="form-submit ahah-processed" value="Upload" id="edit-field-profile-pic-0-filefield-upload" name="op">
  </div>
  <div class="description">Maximum Filesize: <em>4 MB</em><br>Allowed Extensions: <em>png gif jpg jpeg</em><br>Images larger than 1000x9999 pixels will be scaled</div>
  </div>
<!-- file not found:  --><script type="text/javascript">jQuery.extend(Drupal.settings.imagefield_crop, { "edit-field-profile-pic-0": { "box": { "ratio": 1, "box_width": 0, "box_height": 109 }, "minimum": { "width": "109", "height": "109" }, "preview": "" } });</script></div></div>
</div>
</div>

I hope this will not cost too much.

Thank you!

Comments

ddorian’s picture

maybe hide the button with css and when the user hits save it will upload the image

YK85’s picture

Hi, I want to upload after selecting the image as I also have cropping available with imagefield_crop.

I paid a programmer to help me and was provided only with the below code.
And now the programmer is not answering my emails.

$(document).ready(function() {
    $('.filefield-upload input.form-submit').css("visibility", "hidden");
    $('.filefield-upload input.form-file').change(function() {  
        $(this).parent().find('input.form-submit').mousedown();
    });
});

I require Javascript that will hide the Upload button and submit the file upload when the file select box changes.
Frustrating as it may be, I'm still looking for a solution to my need and hope someone else (more kind) can help.

Thanks

sagar ramgade’s picture

did u try to add this js in your theme's js file ?

Acquia certified Developer, Back end and Front specialist
Need help? Please use my contact form

YK85’s picture

Hi,

Yea, I added the code in my theme's js file, and the Upload button is being hidden, but after selecting an image and pressing OK it isn't auto-uploading the file =(

I found the Uploadify module before but it seemed like it offers many other additional features so I wanted to accomplish this with just a little code to only achieve the automatic uploading of the file.

Thanks

nevets’s picture

You could also use the Uploadify module.

alomarnueve’s picture

Sorry this is so late you've probably already figured it out, but all you have to do is hide the upload button with CSS. Your file will still upload.

.filefield-element input.form-submit{
display:none;
}
je1’s picture

which file you put this line of css code to hide the upload button?

MakeOnlineShop’s picture

Easy way to hide CCK photo UPLOAD button and auto upload image

Hello,

Do you know a module or any easy way to automatically upload selected photo and/or delete this text around the select box:

Maximum file size: 7 MB
Allowed extensions: png gif jpg jpeg
Images larger than 640x480 pixels will be scaled

Thanks a lot.