recentpopularlog in

kme : forms   73

Flask, WTForms, and duplicate IDs |
This actually works fine; I don't see what's so suboptimal about it.
Currently I do the following (I hope the code is clear enough):

<code class="language-python">
@app.route('/create', methods=('GET', 'POST'))
def create():
form = IUser()
if request.method == 'POST' and form.validate():
user = User()
except DuplicateKeyError: # I wish MySQLdb would have
# something like this
from.username.errors.append('Duplicated user name.')
flash('User "%s" created.' %['username'])
return redirect(url_for('manage.users.index'))
return render_template('users/create.html', form=form)

but it feels suboptimal. Suggestions?

See also
<code class="language-python">class Unique(object):
""" Validator that checks field uniqueness """
def __init__(self, model, field, message=None):
self.model = model
self.field = field
if not message:
message = u'This element already exists'
self.message = message

def __call__(self, form, field):
check = self.model.query.filter(self.field ==
if check:
raise ValidationError(self.message)
python  flask  wtforms  webdevel  forms  validation  solution 
march 2018 by kme
http - application/x-www-form-urlencoded or multipart/form-data? - Stack Overflow

The moral of the story is, if you have binary (non-alphanumeric) data (or a significantly sized payload) to transmit, use multipart/form-data. Otherwise, use application/x-www-form-urlencoded.

According to the specification:

[Reserved and] non-alphanumeric characters are replaced by `%HH', a percent sign and two hexadecimal digits representing the ASCII code of the character

That means that for each non-alphanumeric byte that exists in one of our values, it's going to take three bytes to represent it. For large binary files, tripling the payload is going to be highly inefficient.
questions  http  post  html  forms  webdevel  answered 
february 2017 by kme
css - Can I use the :after pseudo-element on an input field? - Stack Overflow
This is why the :checked:after (with an SVG data-uri) for TodoMVC's VanillaJS version didn't work in Firefox.

Seems like perhaps wrapping in a "span" might do the trick, though.
css  pseudoelements  forms  webdevel  webdesign  maybesolution 
february 2016 by kme
css - CSS3 :after pseudo element with input - Stack Overflow
I've also thought that the same thing would be useful, but alas, the simplest way I have been able to get the before/after pseudo elements to work reliably is by wrapping the input in a SPAN tag and applying a class to that.

See also:
firefox  css  pseudoelements  forms  webdesign  maybesolution 
february 2016 by kme
46845 – Form elements don't reset upon manually reloading page
I actually *like* the behavior of retaining form element values until you reset the form or force-reload.
firefox  webdevel  html  forms  ui  bug  webdesign  watchthisspace 
march 2015 by kme
Using XMLHttpRequest - Web API Interfaces | MDN
Their little "didactic" framework doesn't handle <selects>s with the "multiple" attribute set on them.
ajax  forms  html  webdevel  solution 
march 2015 by kme
perl - How can I assign different actions for different submit buttons in same html form? - Stack Overflow
If you're using HTML5, this is now easier thanks to the formaction attribute. This attribute applies to input and button elements of type="submit" and forces the form to submit to the location specified in the formaction attribute of the clicked element.

Then only drawback of this attribute is that it's not supported by Internet Explorer 9 and lower, but this limitation can be easily overcome using a little JavaScript.


<form method="post" action="go_default">
<input type="submit" value="Go Left" formaction="go_left" />
<input type="submit" value="Go Right" formaction="go_right" />

For IE 9 and lower:

<script type="text/javascript">
$(function () {
var $submit = $('form [type="submit"][formaction]');

$ {
var $this = $(this),
action = $this.prop('formaction'),
$form = $this.closest('form');

$form.prop('action', action).submit();
perl  cgi  formaction  html5  formprocessing  html  forms  webdevel  maybesolution 
january 2015 by kme
Please do not use a pattern for email validation. Every regular expression for email validation is missing something. Lots of people gone through a process with the conclusion, that it is nearly impossible to get a perfect validation. The good part about is, we can leave this to our browser developers. They got it quite right and we should use their standard for email validation now.

<input type="email" name="" value="" required />

See also:
webdevel  validation  forms  email  programming  reference  newbie  nih 
october 2014 by kme Common input element attributes — HTML Standard
This implies that the regular expression language used for this attribute is the same as that used in JavaScript, except that the pattern attribute is matched against the entire value, not just any subset (somewhat as if it implied a ^(?: at the start of the pattern and a )$ at the end).
html5  forms  validation  regex  webdevel 
june 2014 by kme
The CSS3 Placeholder Pseudo-element | Treehouse Blog
This was important:
They each need to be defined separately, otherwise the entire rule will be ignored by the browser.
html5  css3  forms  placeholder  reference  webdevel 
june 2014 by kme
HTML5 Placeholder Styling with CSS -
I learned an important lesson. It seems when you're using vendor-specific selectors, you shouldn't try to separate them with commas. They need to be one selector (or vendor-prefixed attribute) per line.
html5  css3  html  css  forms  solution  placeholder  a11y 
june 2014 by kme
50 U.S. States Dropdown Box HTML Code Snippets
<select name="state"> <option value="AL">AL</option> <option value="AK">AK</option> <option value="AZ">AZ</option> <option value="AR">AR</option> <option value="CA">CA</option> <option value="CO">CO</option> <option value="CT">CT</option> <option value="DE">DE</option> <option value="DC">DC</option> <option value="FL">FL</option> <option value="GA">GA</option> <option value="HI">HI</option> <option value="ID">ID</option> <option value="IL">IL</option> <option value="IN">IN</option> <option value="IA">IA</option> <option value="KS">KS</option> <option value="KY">KY</option> <option value="LA">LA</option> <option value="ME">ME</option> <option value="MD">MD</option> <option value="MA">MA</option> <option value="MI">MI</option> <option value="MN">MN</option> <option value="MS">MS</option> <option value="MO">MO</option> <option value="MT">MT</option> <option value="NE">NE</option> <option value="NV">NV</option> <option value="NH">NH</option> <option value="NJ">NJ</option> <option value="NM">NM</option> <option value="NY">NY</option> <option value="NC">NC</option> <option value="ND">ND</option> <option value="OH">OH</option> <option value="OK">OK</option> <option value="OR">OR</option> <option value="PA">PA</option> <option value="RI">RI</option> <option value="SC">SC</option> <option value="SD">SD</option> <option value="TN">TN</option> <option value="TX">TX</option> <option value="UT">UT</option> <option value="VT">VT</option> <option value="VA">VA</option> <option value="WA">WA</option> <option value="WV">WV</option> <option value="WI">WI</option> <option value="WY">WY</option> </select>
html  forms  webdevel  snippet  solution 
june 2014 by kme

Copy this bookmark:

to read