question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Using With Large Forms

See original GitHub issue

I have a huge form with 20+ fields. i feel so much redundancy on the code i write now. What is the best way ?

<script>
new Vue({
    data : {
        user : {
            first_name : "",
            last_name : "",
            username : "",
            and 20+.........
        }
    }
});
</script>

<form>
    <input name="first_name" v-model="user.first_name">
    <input name="last_name" v-model=.user.last_name">
    <input name="username" v-model=.user.username">
    and 20+......... input fields
</form>

i feel something like this would be nice. the user object will be created dynamically… is this possible ?

<script>
new Vue({
    data : {
        user :  Object
    }
});
</script>

<form v-model="user">
    <input name="first_name">
    <input name="last_name">
    <input name="username">
    and 20+......... input fields
</form>

Is this possible ? i have to define each repeatedly in data object and in the form. it would be nice if we can achieve it something similar or simpler than that…

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Comments:13 (7 by maintainers)

github_iconTop GitHub Comments

1reaction
fnlctrlcommented, Aug 26, 2016

This is a non issue because you can already solve it easily enough with v-for. And as Evan said This is a userland problem since it's achievable via components.

0reactions
shakee93commented, Aug 26, 2016

Great !! but will be available in future ? or no way to this ? it will be clean there is alot redundancy of same variable name. can this be a feature request ?

Read more comments on GitHub >

github_iconTop Results From Across the Web

Pattern 5: Improve usability of long forms - UI & Visual Design ...
While clever designers and writers can simplify forms somewhat by cutting unimportant fields, in many cases long forms are essential and unavoidable.
Read more >
Good design for Web Apps with Large Forms [closed]
Good design for Web Apps with Large Forms [closed] · Having a large number of fields in a single page (as mentioned above)...
Read more >
58 Form Design & UX Best Practices - Venture Harbour
Uber's forms use large full-width call to actions that are highly contrasted against the form backgrounds. By making call to actions the ...
Read more >
Big, Boring Forms in React - YouTube
If you're targeting modern browsers (anything newer than IE11, really), there are browser APIs to deal with form directly to get the filled ......
Read more >
7 Best UX Practices for Designing Long Online Forms - Prototypr
For those who are designing long forms that have more than 7 questions, this article is for you. Here is a guide to...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found