Re: File Upload Field

SanfordWhiteman
Level 10 - Community Moderator

Re: File Upload Field

I'm sure the button can be moved, but what page are you working on now?

 

(Pls remove the Rich Text area attempt so it's not confusing.)

Jo_Pitts1
Level 10 - Community Advisor

Re: File Upload Field

I stripped it out a while back 🙂

https://info.metlifecare.co.nz/COVID-Legend.html

SanfordWhiteman
Level 10 - Community Moderator

Re: File Upload Field

https://info.metlifecare.co.nz/COVID-Legend.html


You just need to change the relative position of the button.

 

For example, change  the static position at the top:

 formEl.insertBefore(rfpURLEl, formEl.querySelector('STYLE'));  

 

to just above the field metlife_resident_village:

var insertBeforeField = "metlife_resident_village";

var arrayify = getSelection.call.bind([].slice),
    insertBeforeRow = arrayify(formEl.childNodes)
      .filter(function(row){
        return !!row.querySelector("[name='" + insertBeforeField + "']");
      })[0];
  
formEl.insertBefore(rfpURLEl, insertBeforeRow);

 

P.S. If you were already running my form-row-tagging helper JS then this code would be a lot shorter.

Jo_Pitts1
Level 10 - Community Advisor

Re: File Upload Field

As always @SanfordWhiteman , you are a legend.  I'll go experiment.

Jo_Pitts1
Level 10 - Community Advisor

Re: File Upload Field

@SanfordWhiteman , of course that worked - and it was dead easy.

Thanks again for the help you give

SanfordWhiteman
Level 10 - Community Moderator

Re: File Upload Field

Sure thing!

Jo_Pitts1
Level 10 - Community Advisor

Re: File Upload Field

@SanfordWhiteman ,

I'm now trying to insert the upload button before a richtext field on a form.  I've checked the nodelist, and as best I can tell, rich text fields don't appear in it (so much for the clever idea of trying to find that).

I thought I'd be clever and swap the insertBefore to an insertAfter, and insert it after the previous field.  However the button doesn't appear if I do that.

What boneheaded mistake am I making this time?

Cheers

Jo

SanfordWhiteman
Level 10 - Community Moderator

Re: File Upload Field

Add a dummy <input type="hidden"> to the Rich Text.

Jo_Pitts1
Level 10 - Community Advisor

Re: File Upload Field

@SanfordWhiteman 

It is now in the list - so progress.

 

Each entry in the node list in console has SO much stuff in it.  I can't even find the name of the field (or any other field for that matter).  Is there a way to specify the name in the HTML that underpins the Richtext element?

 

As you know, my JS is VERY slowly improving, but in the mean time, where oh where do I find a usable reference to the rich text element?

 

BTW - I have been hunting for the form row tagging helper JS you mentioned above.  googling your blog for a few variants, and searching these forums has yet to yield a result. Any pointers in the direction would be awesome :).

 

Cheers

Jo

SanfordWhiteman
Level 10 - Community Moderator

Re: File Upload Field

Give the <input> a name and... that's the name!