Streaming live at 10am (PST)

Antispam captcha with checkbox?


#1

Hi everyone,

Do you think this checkbox are enough to avoid spam?

http://africa54.webflow.com/contacto

Thanks


Form Captcha, is this possible?
#2

Hey not a bad idea! It's worth checking. Although it seems like radio button would work better?


#3

Hi Sergie,

Radio buttons for any reason?

Cheers


#4

With the checkboxes you can select all of the options and pass the "test". With radio buttons you have to choose the "right one". Just a thought


#5

You are rigth. It's better.
Thanks for your comments.


#6

Opss, I have have tested it now and doesn´t work. The right option is set as required but the form is submitted anyway. Any idea?
The public link is: https://webflow.com/design/africa54?preview=9a06112d99e34d2faeb0e201c228a8ec
Page: Contacto


#7

What you set as required is your radiobutton (group), which means it will be enough if one is selected. It has nothing to do with its each label's value.


#8

Hi pastiwibawa, thats right, the attribute required works with any radio button in a group. Even if you change the group name for every radio button, choosing all the buttons the form is submitted.


#9

Oh no my plan failed! I had a hunch it wouldn't work. Maybe there's a simple javascript captcha library you can embed into your form element... Any ideas @pastiwibawa


#10

Hi @thesergie would be very nice too a slide to activate the submit button. It´s easy to use and could be very stylish


#11

Hi @rafagama54, @thesergie. Things like this which done with client-side script, people can pass it easily, as I believe you knew that. But here is very simple solution that will push 'human' to chose right answer (radiobutton).

@rafagama54 delete your existing radiobutton and use this instead: copy-paste code below to Embed thingy in webflow.

<label class="humano">Are you human? Please check 20 + 5</label>
<div class="w-radio radio">
<input class="w-radio-input" id="radio" type="radio" name="radio" value="Radio" data-name="Radio" onClick="alert('wrong answer!');document.getElementById('radio').checked=false;">
<label class="w-form-label" for="radio">82</label>
</div>
<div class="w-radio radio">
<input class="w-radio-input" id="radio-2" type="radio" name="radio" value="Radio 2" data-name="Radio" onClick="alert('wrong answer!');document.getElementById('radio-2').checked=false;">
<label class="w-form-label" for="radio-2">53</label>
</div>
<div class="w-radio w-clearfix radio">
<input class="w-radio-input" id="radio-3" type="radio" name="radio" value="Radio 3" data-name="Radio" required="required" onClick="alert('right answer!');">
<label class="w-form-label" for="radio-3">25</label>
</div>

If you don't like the alert box you can delete it or you may want to replace with something more fancy as you can find here http://www.tutorialscollection.com/jquery-alert-how-to-use-alert-box-in-jquery-with-code-and-running-example/

Cheers


#12

Hi @pastiwibawa works like a charm! Just I have to stylish better and simple...
Many thanks!


#13

Pasti you're a beast! thumbsup


#14

So I added this to a site and it seems it did cut down on spam... even though a live user can easily by pass. Guess a spam bot can't select the correct answer? Real captcha sure would be nice.


#15

Seems this captcha doesn't work on mobile, any idea why ?

Any other solution for captcha ? Definitely need this


#16

#17