Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

Feature: Form designer

Abierto
#28 1 comentario 0 reacciones 0 asignados Ver en GitHub

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
5/5
Tiempo estimado
Más de una semana
Aptitud para principiantes
25/100
Tipo de issue
Nueva funcionalidad
Claridad
Necesita aclaración
Estado de actividad
Estancado
Stack tecnológico
javascript
Área
frontend

Línea de trabajo

No se especifican archivos, pruebas ni puntos de entrada. Empieza por convertir el área de formularios propuesta, el comportamiento de dragula, las etiquetas y descripciones contenteditable y la exportación de formArea.innerHTML en un alcance concreto; el trabajo terminado debe incluir un diseño acordado y un formato de persistencia definido.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

enhancement

Using this issue to jot down ideas about the form designer. We could try to reuse dobt's form designer ... but if we didn't....

We could use dragula and HTML5's contenteditable, and simply serialize the DOM.

So there'd be a form area, and a way to add fields to it. Adding an <input type="text"> would actually add a <div class="draggable"><label><input><p class="description"></div>. The <div> would have dragula enabled on it. Dragging it around simply rearranges it in the DOM. The <label> and description <p> would have contenteditable="true", letting the user directly edit their contents (which also just updates the DOM).

"Saving" the form would be a matter of exporting formArea.innerHTML. Sure, we could serialize it into JSON if we want to, but there may be an advantage to simply storing the HTML. For instance, you could very easily customize it to infinity. We'd just need a way to associate the fields with the data, but that shouldn't be too hard; just require that each field has a <label> and use an underscorified_version_of_the_label as the field name.

Sounds like fun!

Lenguaje dominante
Python
Estrellas
22
Forks
5
Métricas de merge de PR
Sin PR fusionados en 30 d

Preparar el entorno

Aún no hemos revisado los archivos de configuración de este proyecto. Empieza por su README y consulta nuestra guía para la primera contribución para los pasos generales.

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de CodeForPhilly/stately

Todos los issues de CodeForPhilly/stately

Issues similares

Más issues de Python

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.