Blockquote
У меня есть чат-бот с несколькими диалоговыми окнами с водопадом, и в одном из них используется адаптивная карта для отображения формы для получения входных данных, и она разработана с использованием MS Bot Framework на C # с использованиемШаблон SDK V4 и канал WebChannel, в результате HTML был использован на бэк-энде для работы бота
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>Web Chat: Full-featured bundle with ES5 polyfills</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!--
For demonstration purposes, we are using the development branch of Web Chat at "/master/webchat.js".
When you are using Web Chat for production, you should use the latest stable release at "/latest/webchat.js",
or lock down on a specific version with the following format: "/4.1.0/webchat.js".
-->
<script src="https://cdn.botframework.com/botframework-webchat/latest/webchat-es5.js"></script>
<style>
html, body {
height: 100%
}
body {
margin: 0
}
#webchat {
height: 100%;
width: 100%;
}
</style>
</head>
<body>
<div id="webchat" role="main">
</div>
<script>
const token = 's7W';
const styleOptions = {
botAvatarImage: '',
botAvatarInitials: 'BF',
userAvatarImage: '',
userAvatarInitials: 'WC',
bubbleBackground: 'rgba(0, 0, 255, .1)',
bubbleFromUserBackground: 'rgba(0, 255, 0, .1)'
};
var d = new Date();
var tzoffset = d.getTimezoneOffset();
const store = window.WebChat.createStore(
{},
function (_ref) {
const dispatch = _ref.dispatch;
return function (next) {
return function (action) {
if (action.type === 'DIRECT_LINE/CONNECT_FULFILLED') {
dispatch({
type: 'WEB_CHAT/SEND_EVENT',
payload: {
name: 'webchat/join',
value: tzoffset.toString()
}
});
}
return next(action);
};
};
});
window.WebChat.renderWebChat({
directLine: window.WebChat.createDirectLine({ token: token }),
styleOptions: styleOptions,
store: store,
webSpeechPonyfillFactory: window.WebChat.createBrowserWebSpeechPonyfillFactory()
}, document.getElementById('webchat'));
document.querySelector('#webchat > *').focus();
</script>
</body>
</html>
в браузере или веб-канале.
Мой запрос:
Я хочу сохранить условия в адаптивной карте, такие как:
- Проверка обязательных значений поля,
- Комуотображать контейнер на основе определенного значения, выбранного в раскрывающемся списке
- Как проверить правильность значения электронной почты или нет с помощью REGEX
- Как проверить значения в данном контейнере (который отображается на основеесли выбрано значение, выбранное в раскрывающемся списке), то есть обязательная проверка значений?
Я предполагаю, что это должно быть сделано с помощью JavaScript, который должен быть встроен в страницу HTML на обратной стороне, но проблемая не уверен как? поскольку я очень новичок в отношении javascript.
Пожалуйста, помогите мне с запросом или проблемой, предоставив подробности в пошаговом порядке или в виде руководства, так как я очень новичок в javascript и кодировании с пакетом es5.
Текущий HTML-файл в ChatBot, который я приложил для справки, где я использовал несколько строк скрипта в HTML или некоторых других вещах с помощью веб-сайта и некоторые из моих предыдущих вопросов о ChatBot с использованием пакета es5.
Обновление запроса для ясности 29 октября 2019 года:
У меня есть адаптивная карта, созданная со следующими контейнерами:
- Контейнер 1: Имеетнесколько текстовых вводов, которые нужно заполнить
- Контейнер 2: необходимо установить несколько флажков
- Контейнер 3: раскрывающийся параметр, в котором 1, 2 или Оба являются опциями для выбора
- Контейнер 4: Несколько других текстовых полей для ввода
- Наконец: кнопка отправки вне всех контейнеров
Мои запросы следующие:
Если я выберу 2 или Оба в качестве опций в раскрывающемся списке как часть Контейнера 3, то должен отображаться только Контейнер 4. Если я выберу 1, то контейнер 4 должен быть отключен или скрыт. Это достижимо с помощью кода JavaScript или C # или любых других настроек? Если да, то как, пожалуйста, объясните подробно, насколько это возможно, шаг за шагом, так как я очень плохо знаком с кодированием?
Можем ли мы пройти обязательную проверку значений при отправке данных в адаптивную карту, т.е. согласно моему измененному выше объяснению, если я нажимаю на кнопку отправки, не вводя текстовые вводы, предоставленные в контейнере 1, я должен получить всплывающее окно или любое сообщение об ошибке, возможно, что обязательные значения не предоставлены? Возможно ли достичь какого-либо JavaScript или C # в адаптивной карте, если да, то как, пожалуйста, объясните подробно, насколько это возможно, шаг за шагом, так как я очень плохо знаком с кодированием?
Один изтекстовые вводы - это электронная почта, как сделать проверки для ввода электронной почты, где пользователь может предоставить несколько электронных писем с разделенной точкой с запятой (;), но значение должно быть в правильном формате электронной почты, таком как john.doe@gy.com. Как мы можем обеспечить такой вид проверки в адаптивных картах?