Giter Site home page Giter Site logo

Comments (3)

timobrembeck avatar timobrembeck commented on September 13, 2024 1

I think this is just a limitation of Django's widget implementation.

The name of a widget is a special attribute which is directly inherited from the field name and cannot be overwritten by other custom attributes. If you have a look at the actual source code (not the code inspection tool), you will see that the name attribute exists twice on your input field and browsers just consider the first name attribute to be the correct one.

There are also a few questions on StackOverflow about this topic, e.g.:

However, just out of curiosity: What is your use case for this? Why not simply changing the name in the form itself? Keep in mind that you won't be able to submit the input field with the new name, since the form expects the original name in response.

from django-widget-tweaks.

ruslaniv avatar ruslaniv commented on September 13, 2024

@timoludwig
Thank you for your answer! That pretty much clears it.

However, just out of curiosity: What is your use case for this? Why not simply changing the name in the form itself? Keep in mind that you won't be able to submit the input field with the new name, since the form expects the original name in response.

I was just watching one tutorial and the guy was overriding the field names and labels left and write using bootstrap4 Django package. So, although this was a username field, he wanted to display email label with this:

{% bootstrap_label "Email" %}
{% bootstrap_field form.username show_label=False placeholder="Email" %}

Which is pretty bad coding practice if you ask me, but the curiosity got the best of me (well, actually in this case - the worst of me) and I wondered if I could do something similar using crispy-forms and widget-tweaks.

from django-widget-tweaks.

timobrembeck avatar timobrembeck commented on September 13, 2024

Well, but that's a totally different question 😅
The name attribute is only visible in the source code and used on the server-side to identify the submitted values.
What you show to your users in the label and placeholder is up to you - of course you can customize that.

The recommended way of changing the label is in the field definition of the form class rather than in the html code, but of course you can just write:

<label for="{{ form.username.id_for_label }}">Email</label>

and the placeholder can e.g. be customized via the render_field tag:

{% render_field form.username placeholder="Email" %}

as mentioned in the README.

I don't know anything about crispy-forms, but at first sight I think it serves a similar purpose like widget-tweaks, so I don't see a reason to use both at the same time.

from django-widget-tweaks.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.