Improve a simple custom URL field with WTForms (Python/Flask)

Question

The WTForms documentation on custom widgets is very sparse and gives no hints at how I can achieve what I want. I tried to play with the examples, but that didn't work...

Other questions on stackoverflow don't explain how to develop widgets in general:

All I am looking for is a simple text input field which will contain an URL, with the clickable hyperlink right next to it. So basically, the custom field would only append a hyperlink to the standard input field, which contains its value.

Simple, straightforward examples like this should be in the docs IMHO.

Any instructions or resources explaining how this can be done?

UPDATE: My solution is inelegant but it works...

from wtforms import Field
from wtforms.widgets import TextInput

class MyUrlWidget(TextInput):
    def __init__(self):
        super(MyUrlWidget, self).__init__()

    def _value(self):
    if self.data:
        return self.data
    else:
        return ''
    def __call__(self, field, **kwargs):
        w = super(MyUrlWidget, self).__call__(field, **kwargs)
        w = w + '<a href="'+field._value()+'">link</a>'
        return w

class MyUrlInput(Field):
    widget = MyUrlWidget()

Can anyone help improve this?

score 2 · Answer 1 · answered May 19 '15 at 03:24

class UrlWidget(object):
def __call__(self, field, **kwargs):

    href_link = None
    href = None

    # for template kwargs

    if 'example' in kwargs:
        kwargs.setdefault('example', field.example or "example")
    if 'input_type' in kwargs:
        kwargs.setdefault('input_type', field.input_type or "text")
    if 'href_text' in kwargs:
        href_link = kwargs.pop('href_text')
    if 'href' in kwargs:
        href = kwargs.pop('href')

    # for init kwargs

    if field.example:
        kwargs.setdefault('example', field.example)
    if field.input_type:
        kwargs.setdefault('input_type', field.input_type or "text")

    # ext > int if use in template rendering

    html_param = html_params(**kwargs)

    if href or field.href:
        html = "<input %s /><a href=\"%s\" > %s </a>"
        result= HTMLString(html % (html_param, href and href or field.href, href_link and href_link or field.href_text))

    else:
        html = "<input %s />"
        result = HTMLString(html % html_param)

    return result

class UrlField(Field):
widget = UrlWidget()

def __init__(self, href=None, href_text=None, example=None, input_type=None, label=None, validators=None, **kwargs):
    super(UrlField, self).__init__(label=None, validators=None, **kwargs)
    self.example = example
    self.href = href
    self.input_type = input_type
    self.href_text = href_text


def _value(self):
    if self.data:
        return u''.join(self.data)
    else:
        return u''


class SimpleForm(Form):
    newurl = UrlField(href="http://localhost.simple", href_text="Simple link here", example="example", input_type="text")

routing

@app.route('/')
def root():
    form=SimpleForm(request.form)
    return render_template('index.html',form=form)

template rendering

<body>
Init kwargs: {{ form.newurl }}
Kwargs in template: {{ form.newurl(href="http:/enjoy.dude",  href_text="new link text here for enjoy dude") }}
</body>

html code

Init kwargs: <input example="example" input_type="text" />
<a href="http://localhost.simple" > Simple link here </a>
Kwargs in template: <input example="example" input_type="text" />
<a href="http:/enjoy.dude" > new link text here for enjoy dude </a>

Enjoy Dude :)

Improve a simple custom URL field with WTForms (Python/Flask)

1 Answers1