Replies posted by TimothyDO

56 Replies

Jess
Unbouncer
JessFormer Community Manager @ Unbounce
asked in Tips & Scripts

Multi-Field, Multi-Step Form 🔥

Fair enough… our multistep script although based on this has diverged significantly from it 🙂

100
S
6 months ago
Jess
Unbouncer
JessFormer Community Manager @ Unbounce
asked in Tips & Scripts

Multi-Field, Multi-Step Form 🔥

@happyagencies Out of curiosity, can you not just change the form width in mobile mode within the Unbounce editor?

100
S
6 months ago
Mark_Wainwright
Unbouncer
Mark_WainwrightStaff Developer @ Unbounce
posted in Tips & Scripts

Adding custom validation to form fields

I’ve already put in feature requests on solving this… problem is that it’s a valid email without the domain… e.g. test@localhost or employee@companyintranet . so by using html5 email validation these are technically correct although completely useless for a internet only system. Our solution goes something like: document.getElementById('email_field_id').setAttribute("pattern", "[a-zA-Z0-9.-_]{1,}@[a-zA-Z0-9.-]{1,}[.]{1}[a-zA-Z0-9]{2,}"); Drop the above into a script and change email_field_id to the id of the email field on your form. This uses html5 regex pattern matching to use as validation for valid emails (with domain) 😉

112
Ed_Ilnicki
Unbounce Community Team
7 days ago
N
NidhiSharma
posted in Ask a Question

Onscroll not working

Try remove the # from the getElementbyID

1
TimothyDO
4 years ago
TimothyDO
TimothyDO
asked in Ask a Question

Form Submission from script without inbuilt jquery

Thank you, Bruna from support… looks like we have the solution… Just for the sake of completeness posting it here… (nothing worse than googling for a problem to find hundreds of posts of people asking the same question with no resolution) const myForm = document.forms[0]; var event = new Event('submit', { 'bubbles' : true, // Whether the event will bubble up through the DOM or not 'cancelable' : true // Whether the event may be canceled or not }); myForm.dispatchEvent(event); The above code to be used in place of lp.jQuery(‘form’).submit();

3
TimothyDO
4 years ago
TimothyDO
TimothyDO
asked in Ask a Question

Form Submission from script without inbuilt jquery

And just for the sake of completeness… here’s a simple example… Button fires $(‘form’).submit(); https://dev.digitaloyster.co.uk/tims-tests/bb.html

3
TimothyDO
4 years ago
TimothyDO
TimothyDO
asked in Ask a Question

Form Submission from script without inbuilt jquery

Pure JS doesn’t work either var x = document.getElementsByTagName(“form”); x[0].submit(); //form submission

3
TimothyDO
4 years ago
R
RateShop_Inc
posted in Landing Page Review

Landing page not generating any leads at all

The ‘what type of property dropdown’ doesn’t have any options… makes the page look broken… not sure I would continue if there was a place to enter something but wasn’t letting me do anything…

12
R
4 years ago
Jess
Unbouncer
JessFormer Community Manager @ Unbounce
posted in News and Announcements

Removal of Jquery Dependency [follow-up]

Might want to check out html5 pattern attribute… http://html5pattern.com/Phones Something along the lines of: $(#field_id).attr('pattern','^(?:0|\(?\+33\)?\s?|0033\s?)[1-79](?:[\.\-\s]?\d\d){4}$'); Not really got much done in terms of the custom validations or masking since the update as I’ve been building a bespoke multipage…

16
TimothyDO
4 years ago
Jess
Unbouncer
JessFormer Community Manager @ Unbounce
posted in News and Announcements

Update: Tips and Scripts

When you say “spring clean” does this mean getting rid of scripts that are no longer functional? Maybe an idea to compile a list of those as a “bounty list”… I know there are a lot of scripts in there that make use of the shim to be backwards compatible with. For example. There is a script in there for changing the validation error messages. Whilst this still works it’s reliant on that shim to work… I’ve been working on an alternate version making use of this.setCustomValidity(’"+val.error+"’); So no reliance on the shim and makes use of the html5 validation… Sooo would be cool to get both broken and shim reliant scripts on that bounty list 😉

6
Jess
Unbouncer
4 years ago
Rob
RobFormer Unbouncer
posted in News and Announcements

Removal of Jquery Dependency

Might be an idea to warn the community of the release date on this new release…

37
Jess
Unbouncer
5 years ago
Rob
RobFormer Unbouncer
posted in News and Announcements

Removal of Jquery Dependency

Any update on when this re-release is?

37
Jess
Unbouncer
5 years ago
Rob
RobFormer Unbouncer
posted in News and Announcements

Removal of Jquery Dependency

I had you (unbounce) hook up with a thirdparty validation company to come up with new versions of the scripts they provide their customers, the majority of which make use of your service. The code you came up with between yourselves included the following… $(‘input[type=tel]’).bind(‘change’, function(e) { Which would denote that you (at least at one point) thought that you’d be using the html5 tel input type…

37
Jess
Unbouncer
5 years ago
Rob
RobFormer Unbouncer
posted in News and Announcements

Removal of Jquery Dependency

@julien_level Really quick dirty fix for the telephone issue… Assuming your field is called “telephone”… $(’#telephone’).removeAttr(‘pattern’); document.getElementById(‘telephone’).type = “tel”;

37
Jess
Unbouncer
5 years ago
Rob
RobFormer Unbouncer
posted in News and Announcements

Removal of Jquery Dependency

While you’re looking at the telephone field it’s not assigning type=“tel” either. So our custom validation built for this new version doesn’t recognise telephone fields… @Brian_Burns

37
Jess
Unbouncer
5 years ago
Rob
RobFormer Unbouncer
posted in News and Announcements

Removal of Jquery Dependency

Thanks @Jess I did remove my post when we (myself and rob) started chatting over email on this. Given him a detailed explanation of my findings for the day. Might still be an idea to post the amended date for this though 😉

37
Jess
Unbouncer
5 years ago
Rob
RobFormer Unbouncer
posted in News and Announcements

Removal of Jquery Dependency

Hi Jess, We’ve been in regular communication with both our account manager and Rob over this. I don’t think our being on GMT helps with communications with this though. That email about the release was around 9:40pm GMT on a Friday suggesting a Monday release… there would have been radio silence from our end too 😉 I was kinda hoping that the issue with the shim would be fixed so that we wouldn’t need to change every single page we host. Rob was kind enough to setup a test account for us so we could test the various scripts we make use of. I have put together a working equivalent of the isValid function making use of the reportValidity method you guys are moving to. This is our isValid for checking if a selection of field is valid so that you can make use of a next button to switch between different pages with a portion of the total number of fields in the form. There is both the original function and the newer function here so I am hoping this can help in your debugging of the

37
Jess
Unbouncer
5 years ago
Rob
RobFormer Unbouncer
posted in News and Announcements

Removal of Jquery Dependency

Figured it might be an idea to try this avoiding the Shims you’ve put in place to make older pages work in this new system. The following is the older function we were using for page specific validation and the quick test function I put together… it appears to be working with the first page I tested this on… Going to continue testing… var isValidOld = function(page) { var fieldsArr = pages[page].split(','); var validateArr = []; for (var i = 0; i < fieldsArr.length; i++) { var x = fieldsArr[i].replace(/(#container_)/g, '').trim(); validateArr.push('[name="' + x + '"]'); } return lp.jQuery(validateArr.join()).valid(); }; var isValid = function(page) { var fieldsArr = pages[page].split(','); for (var i = 0; i < fieldsArr.length; i++) { var x = fieldsArr[i].replace(/(#container_)/g, '').trim(); if (!document.getElementById(x).reportValidity()){ return false; } } return true; }; [edit: Doesn’t appear to work for radio

37
Jess
Unbouncer
5 years ago
Rob
RobFormer Unbouncer
posted in News and Announcements

Removal of Jquery Dependency

@Brian_Burns That multipage script is a seriously simple test case. Firstly it’s throwing many errors about fields not being focusable. ((second time I loaded it threw a whole new batch of errors, third time different warnings)) It appears that the shim you’re applying isn’t taking into account that it maybe trying to focus on a field that isn’t on the current page of the multipage form. Secondly on the test account we had @Rob setup for our use we are having issues with validation of multiple fields on the same page. It appears that running lp.jQuery(validateArr.join()).valid(); Where validateArr is an array containing multiple fields to run validation against is only running the first validation and then returning true. So are you able to modify the example page you have so there are multiple fields on each page and test that. And can I reiterate the request for you to share the link to the multipage script you use in this example?

37
Jess
Unbouncer
5 years ago
Ed_Stanfield
Ed_Stanfield
posted in Ask a Question

3rd Party App for a file upload

On the forms we run with file uploads, we AJAX the file to our web server… All custom coded I am afraid. Would be interested to see if you come across another solution for this. 😉

1
TimothyDO
5 years ago
Jess
Unbouncer
JessFormer Community Manager @ Unbounce
asked in Tips & Scripts

Multi-Field, Multi-Step Form 🔥

Apologies but my original page where I was testing this is lost in discarded pages… I would say (complete guess work) that the append is appending to something outside the page structure… therefore you can see all numbers on all pages. | can’t for the life of me remember where this.progressBar was defined as… but that is where I’d start looking… Sorry again…

100
S
6 months ago
Jess
Unbouncer
JessFormer Community Manager @ Unbounce
posted in News and Announcements

RawGit is sunsetting

You might want to check through the TOS on Github pages. They are predominately are for use in relation to a repository. So informational page for the script they host. They state that they dislike advertising and monetisation (except for donate links etc.). We looked at using github pages to act as a CDN and there are enough grey areas in the TOS that we avoided it. Went with JSDelivr instead and although we are just rolling out with it, it’s looking great already. (still using github to host the scripts themselves but JSDelivr to cache and serve) (unsure on the other two)

1
TimothyDO
5 years ago
Jess
Unbouncer
JessFormer Community Manager @ Unbounce
asked in Tips & Scripts

Multi-Field, Multi-Step Form 🔥

Try something along the lines of https://stackoverflow.com/questions/3366828/how-to-disable-submit-button-once-it-has-been-clicked and add that in after the line if ( this.currentStep === this.steps.length - 1 ) { That ways it should cut in after the final button press if the form is valid… else your not blocking the persons ability to modify errors and try a submission again… ((would have a better go at this but trying to sort out database issues… ))

100
S
6 months ago
Noah
NoahFormer Unbouncer
posted in Tips & Scripts

[How to] Run Custom Code/Scripts on Form Submission

Just had a rather long but much appreciated email from support over the issues we having with this and other scripts. @Noah has just updated this script to make it more durable. So I’ve stripped out a considerable about the the code from this newer script so it’s bare essentials. Mostly I’ve removed the aspects that should fire the validations/submissions that e.preventDefault is meant to be stopping. With what is left in the following script all that should happen is the background colour should change… It shouldn’t validate and show errors. It shouldn’t submit the form on the button press. It does fire the payload code but it’s still ignoring the e.preventDefault(); <script type="text/javascript"> function yourSubmitFunction(e, $) { e.preventDefault(); try { $('.lp-pom-block-content').css("background-color","red"); } catch(err) { console.log(err); } finally { } } lp.jQuery(function($) { $('.lp-pom-

28
Anna_Z
Unbouncer
4 months ago
Noah
NoahFormer Unbouncer
posted in Tips & Scripts

[How to] Run Custom Code/Scripts on Form Submission

As I mentioned in the other post you replied to @BillRothVMware I am trying to convince support that this script is broken. When I pointed this out the reply was: This page was last saved and republished 2 days ago with this exact script in place as it was being tested specifically: https://www.random.gq/blank-page/ - the only script running on it is an alert - feel free to test it out. But as you can see when you do test it - the script is firing okay 🙂 I’ve created a page that shows the issues and explained the exact steps to replicate both issues with the script. Issues being: Payload doesn’t fire on a mobile device. Script won’t obey a e.preventDefault call Besides this script this also breaks both the multipage scripts on the forum as they both rely upon the e.preventDefault to stop the enter key from causing the entire form to validate. Therefore when a user presses enter the form will display all the validation issues on the entire form rather than just the specific

28
Anna_Z
Unbouncer
4 months ago

Badge winners

Show all badges
Terms & ConditionsCookie settings