Подробное описание процесса создания формы Обратная связь

В этой статье подробно разберем как создавать форму на примере формы сбора обратной связи. Неавторизованный пользователь заполняет форму, данные сохраняются в базе, а также идет уведомление в телеграм пользователю. 

Вот так выглядит форма: 

Наши действия по шагам: 

1. Создаем форму в /forms с кодом siteReview. 

2. Создаем колонки формы с указанными настройками: 

У нас 4 поля, 2 выбора radio, многострочное поле и строковое поле. 

Для полей выбора (q1,q2) мы также прописываем процедуру списка значений: 

CREATE PROCEDURE [dbo].[fm_siteReview_q1_dict]
   @username nvarchar(256), 
   @itemID nvarchar(128)   
AS
BEGIN	
	select 1 Text, 1 Value
    union 
    select 2 Text, 2 Value
    union 
    select 3 Text, 3 Value
    union 
    select 4 Text, 4 Value
    union
    select 5 Text, 5 Value
END

и для q2: 

CREATE PROCEDURE [dbo].[fm_siteReview_q2_dict]
   @username nvarchar(256), 
   @itemID nvarchar(128)   
AS
BEGIN	
	select 1 Text, 1 Value
    union 
    select 2 Text, 2 Value
    union 
    select 3 Text, 3 Value
    union 
    select 4 Text, 4 Value
    union
    select 5 Text, 5 Value
END

В процедурах мы просто делаем список от 1 до 5. В поле text можно было бы использовать и строковые значения. 

3. Прописываем процедуру GetItem для формы (она выполняется перед загрузкой формы и позволяет инициализировать настройки формы и поля)

CREATE PROCEDURE [dbo].[fm_siteReview_getItem]
    @itemID int,	
	@username nvarchar(256)
AS
BEGIN	
    -- SELECT 1 
    select '' texp, '' contact, '{"maxlength": 500}' options_text
    
    -- SELECT 2 
    select 1 LineLabel, 'h2' headerTag, 'Помогите нам пожалуйста улучшить платформу Falcon Space'  Subtitle
END

В SELECT 1 указываются значения полей формы. Также мы здесь используем параметр options_ для настройки максимального количества символов в поле text.

В SELECT 2 задаются общие настройки формы: указываем что метки полей будут на отдельной строке, тег залоговка уменьшим до h2 и прописываем подпись к форме (здесь может быть любая разметка). 

4. Прописываем пустую процедуру CheckItem - мы не используем здесь ее для проверок значений. Она должна возвращатть модель Result, Msg, поэтому делаем ее такой: 

CREATE PROCEDURE [dbo].[fm_siteReview_checkItem]
   @username nvarchar(256), 
   @itemID int,
   @parameters ExtendedDictionaryParameter readonly  
AS
BEGIN
	select 1 Result, '' Msg	
END

5. Прописываем процедуру для обработки кнопки Отправить. 

CREATE PROCEDURE [dbo].[fm_siteReview_saveItem]
   @username nvarchar(256), 
   @itemID int,
   @parameters ExtendedDictionaryParameter READONLY	  
AS
BEGIN
	declare @formID int = (select id from as_forms where lower(code)='sitereview')
    declare @q1 nvarchar(max) = (select title from as_formCols where formID = @formID and code='q1'  )
    declare @q2 nvarchar(max) = (select title from as_formCols where formID = @formID and code='q2'  )
    
    declare @ip nvarchar(max)
	select @ip = Value2 from @parameters where [key]='userIP'
	
    if(exists(select id from as_trace where code='siteReview' and ip = @ip and created > dateadd(minute, -2, getdate()) )) begin 
    	select 0 Result, 'Слишком частая отправка ' Msg
        return
    end 
    
	declare @pq1 nvarchar(max)
	select @pq1 = Value2 from @parameters where [key]='q1'
	declare @pq2 nvarchar(max)
	select @pq2 = Value2 from @parameters where [key]='q2'
	declare @ptext nvarchar(max)
	select @ptext = Value2 from @parameters where [key]='text'
	declare @pcontact nvarchar(max)
	select @pcontact = Value2 from @parameters where [key]='contact'

	declare @s nvarchar(max) = @q1 + ':' + isnull(@pq1, '') + ', 
' +	@q2 + ':' + isnull(@pq2, '') + ', 
Контакт - ' + isnull(@pcontact, '--')

	insert into as_trace (code, header, text, created, itemID, username, ip)
    values('siteReview', @s,  @ptext, getdate(), 0, @username, @ip)

	-- SELECT 1 
	select 1 Result, 'Спасибо за ваше мнение!' Msg, '' SuccessUrl, 1 HideFormAfterSubmit, '' RefreshContainer, 1 EnableSaveAlert


	-- SELECT 2 Вызов внешнего действия
    select 'notification' type, 'Обратная связь: ' + @s text , 'user1' [to], 'common' typeCode, char(10) + 'Комментарий: ' + @ptext url, '' additional -- notification
	
END

Что происходит в процедуре: 

1. Мы получаем из метаданных формы поля q1 и q2 - какие были вопросы заданы (чтобы в случае их изменения они изменились и здесь, т.е. не пишем их тут отдельно, а извлекаем). 

2. Извлекаем IP пользователя для того, чтобы сделать проверку того, что данный IP не слишком часто отправляет запрос (смотрим его последнее сохранение и если не прошло 2 минуты, то отказываем ему). 

3. Далее извлекаем значения полей из коллекции @parameters (Key - это код поля, а Value2 содержит значение). 

4. Сохраняем данные в trace c кодом siteReview. 

5. SELECT 1 выдает сообщение об успехе операции, а также задает через 1 EnableSaveAlert, что сообщение должно выдаваться через alert справа наверху. Если нам надо обновить какую-то часть страницы, то можно указать jquery селектор в RefreshContainer (если это вся страница, то 'body'). 

6. Отправляем уведомление пользователю user1.

Чтобы это работало, в таблице as_nt_notificationTypes должен быть добавлен код уведомления (в нашем случае это common).Чтобы приходили уведомления пользователю в телеграм должны быть выполнены следующие моменты: 

  • к сайту подцеплен телеграм бот (прописан токен в appsettings)
  • пользователь имеет привязку логина к боту (он указывает логин телеграма в профиле на сайте, а затем обращается к боту с любоой командой - в этот момент создается привязка пользователя к боту). 

7. Добавим в быстрые действия нашу форму. В Быстрые действия  / GetLayout в SELECT 3 добавляем нашу форму: 

select 'form' type,'Обратная связь, отзыв' Title, 'siteReview' Code, '0' itemID, 
' fa-comment' Icon, 'Отправить' btnText, 0 bigModal, 1 slideout, 0 Ord, 1 FloatPanel      

Здесь мы задаем вывод ссылки на модальную форму с кодом siteReview с кнопкой Отправить, которая откроется в малом модальном окне (0 bigModal). FloatPanel задает что эта кнопка будет всегда видна справа на плавающей панели. 

Falcon Space - функциональная веб-платформа разработки на узком стеке MS SQL/Bootstrap. Вводная по Falcon Space
Насколько полезной была статья?

Google поиск по нашей документации

Выгода от использования Falcon Space

В 2-3 раза экономнее и быстрее, чем заказная разработка
Более гибкая, чем коробочные решения и облачные сервисы
Используйте готовые решения и изменяйте под свои потребности
Нужна бесплатная консультация?
Планируете делать веб-проект?
Сайт использует Cookie. Правила конфиденциальности OK