Os usuários devem preencher um formulário ao criar um tópico?

É possível fazer com que os usuários preencham um formulário ao criar um tópico? (Ou seja, ao abrir a janela de criação de tópico, exibir um formulário dentro do tópico que eles precisam preencher).

Ao usar o modelo de tópico ao criar uma categoria, posso incluir algumas instruções sobre o que os usuários devem inserir. No entanto, isso é diferente de um formulário. As instruções podem ser excluídas (o que deixa usuários menos experientes sem saber o que fazer com elas), e a página fica sobrecarregada se houver várias instruções na mesma tela.

Um formulário ofereceria uma experiência de usuário mais limpa e simples no caso em que desejo que os usuários preencham algumas informações-chave em seu tópico ao criá-lo.

Isso é possível? Encontrei este componente de tema, mas, embora ainda não tenha certeza do que ele faz, acredito que não atende ao que tenho em mente. Também vi esta solicitação de vários anos atrás — parece que nenhuma ação foi tomada.

Além disso, sei que o plugin Custom Wizard permite criar um formulário para os usuários preencherem, mas, neste caso, preciso que o formulário esteja dentro de um tópico do Discourse (para que ele apareça como um tópico com toda a funcionalidade correspondente, como tags, respostas, etc.). E preciso que a experiência do usuário permaneça claramente dentro do aplicativo (acredito que o plugin Wizard leva os usuários a uma página separada com menus diferentes, etc.).

3 curtidas

Essa coisa é certamente tecnicamente possível em um componente de tema.

3 curtidas

Um tópico antigo muito relacionado para quem está interessado:

1 curtida

Obrigado.

Como você acha que isso poderia funcionar?

Aqui estão algumas ideias que tenho, embora ainda haja algumas perguntas a serem respondidas:

Básico que já existe: Espaços reservados. Mas, atualmente, é 'tudo ou nada'

A estrutura mais simples que consigo pensar para imitar o comportamento de um formulário seria fazer com que o “formulário” apareça no editor (o “d-editor” que surge ao clicar em criar tópico).

Nesse editor, você poderia fornecer diferentes “seções”, como:

Nome


Localização


Problema


Cada título de seção seria um espaço reservado, de modo que, quando o usuário clicasse nele, o título (por exemplo, Nome) desapareceria.

Até agora, configurar isso é possível com o componente de tema de texto de espaço reservado.

Mas isso não chega totalmente ao comportamento semelhante a um formulário, porque os espaços reservados que existem atualmente aparecem de forma “tudo ou nada”, como descrevo a seguir.


Comportamento semelhante a um formulário com espaços reservados. Mas como acessar divs no editor?

Para tornar isso mais parecido com um formulário, cada seção deve se comportar de forma independente.

Atualmente, com o componente de tema de texto de espaço reservado, é tudo ou nada: se o usuário clicar no editor, todos os títulos de espaço reservado desaparecem.

Portanto, para ter um comportamento básico de formulário, em vez de fazer com que todos os títulos apareçam ou desapareçam simultaneamente, precisaríamos que cada seção de título de espaço reservado se comportasse de forma independente. Assim, quando o usuário clicar no espaço reservado “Nome”, apenas esse espaço reservado desaparece, enquanto os outros espaços reservados (“Localização” e “Problema”) permanecem.

Isso seria possível se cada espaço reservado pudesse fazer parte de sua própria div com um ID exclusivo dentro do editor de texto. Então, com jQuery, você poderia mostrar ou ocultar o espaço reservado dependendo se o usuário clicou na área. Isso requer a adição de divs separadas dentro do que é atualmente uma área de texto, e não tenho certeza de como fazer isso.

Pergunta para essa abordagem: Como acessar divs dentro da área de texto do editor, para que você possa tomar uma ação quando o usuário clicar nelas?


Alternativa: usar a opção de texto de modelo existente. Mas como fazer com que o texto não seja editável?

Provavelmente, uma alternativa seria que os cabeçalhos de seção não “desapareçam” quando o usuário clicar. Assim, os cabeçalhos de seção (exemplo: Nome, Localização e Problema) seriam texto que permaneceria na página. Para torná-lo mais parecido com um formulário, em comparação com o padrão atual de modelo de tópico básico:

  1. O texto do cabeçalho da seção não poderia ser editado pelo usuário (ou seja, contenteditable="false")
  2. Os pontos de quebra de seção não poderiam ser removidos pelo usuário
  3. Haveria espaço abaixo do cabeçalho da seção onde fica claro que o usuário pode digitar. No modelo padrão atual, eles teriam que ir até onde está o texto, pressionar enter, para criar espaço para digitar.

Pergunta para essa abordagem: Como inserir texto de modelo, mas (i) fazer com que esse texto não seja editável pelo usuário e (ii) ter locais claros para o usuário inserir informações abaixo de cada parte do texto?


Talvez exista uma maneira melhor de obter um comportamento semelhante a um formulário?

2 curtidas

Presumivelmente, você precisaria fazer uma passagem no modelo antes de renderizar um conjunto mais complexo de campos de entrada, em vez de uma área de texto monolítica.

Depois, faça um pós-processamento para inserir o texto nos locais corretos.

Você precisaria de algum padrão de marcação para identificar os títulos/pontos de entrada de texto…

Isso poderia ser uma solução mais leve, já que tudo seria mantido no mundo do front-end. (tudo ainda seria armazenado como um único post de texto).

A principal desvantagem dessa abordagem seria que seria muito mais difícil pesquisar e agregar dessa maneira…

Parece um projeto divertido :slight_smile:

Estou procurando algo que permaneça no front-end por enquanto. A análise e a busca em diferentes partes do formulário não são necessárias neste momento, e acredito que na maioria dos casos de uso. O foco é garantir que os usuários insiram suas respostas de forma consistente.

Não entendi o que você quis dizer com:

Espero retomar isso. Estou na expectativa de que exista uma maneira no front-end de fazer com que os usuários preencham algo que (para eles) pareça um formulário. Por exemplo, ao criar um tópico, eles veriam algo como:

“Nome”


“Localização”


“Problema”


Tudo isso pode permanecer no front-end. Não tenho necessidade (seria bom, mas não é necessário agora) de analisar as diferentes seções do que os usuários enviam — tudo pode ser enviado como está atualmente. O objetivo é garantir uma submissão mais uniforme por parte dos usuários e oferecer uma interface limpa quando houver diferentes instruções.

A diferença entre isso e o que está disponível atualmente ao adicionar um modelo de tópico:
  1. O usuário não poderia excluir essas instruções (ou seja, não poderia excluir “Nome”, “Localização” e “Problema”).

  2. Idealmente, eu poderia adicionar algum estilo de formulário para tornar mais óbvio para o usuário onde ele deve digitar. Isso permitiria uma interface mais limpa para um usuário criando um tópico quando há várias instruções diferentes. Com os modelos de tópico, o usuário precisa criar seu próprio espaço para digitar suas respostas para cada instrução. Além disso, a janela de criação de tópicos começa a ficar bastante lotada quando há diferentes instruções no caso de usar os modelos de tópicos atuais.

@sam havia respondido anteriormente:

Parece que isso realmente deve ser possível. Meu maior problema: como faço, em um componente de tema (ou plugin), para alterar o que aparece dentro da janela de criação de tópicos? Atualmente, parece uma caixa preta em um iframe quando tento fazer isso.

Sei que pode haver alguma maneira de entrar lá, dado que é isso que os modelos de tópicos fazem e o que o plugin placeholder faz. Mas ainda não descobri como eles fazem isso.

Alguma dica sobre o que posso fazer com código para alterar o que está na janela de criação de tópicos?

1 curtida

Dê uma olhada no Guia do Desenvolvedor para Temas do Discourse. É por ali que você deve começar.

Se você está se referindo ao nome de usuário e à localização, eles estão no perfil do usuário, então talvez não sejam necessários?

Obrigado pela sua resposta. Estou familiarizado com a criação de temas e plug-ins. O que estou procurando aqui é orientação sobre o código específico para acessar o iframe do formulário de criação de tópico. Não preciso que alguém detalhe tudo, mas qualquer orientação seria muito apreciada. Já tive dificuldades no passado para encontrar uma maneira de fazer alterações nesse formulário.

O exemplo de nome, localização, etc., foi apenas hipotético, como um formulário comum. No meu caso específico, haveria prompts diferentes que eu precisaria.

3 curtidas

Também estou interessado em uma solução como um formulário que solicite aos usuários a entrada ao criar um tópico, preferencialmente com a opção de tornar alguns campos obrigatórios; alguns desses dados podem ser sensíveis e eu gostaria de armazená-los em alguns campos personalizados no tópico.

1 curtida

Verifique Introducing Experimental Form Templates