Модальное окно ошибки

Содержание:

1.       Где можно увидеть такой текст сообщения о том, что использование модальных окон запрещено и что это значит?

2.       Изменение настройки использования модального режима окна в конфигураторе

3.       Изменение программного кода для открытия модального окна

1.      Где можно увидеть текст сообщения о том, что использование модальных окон запрещено и что это значит?

Обычно, текст «Использование модальных окон в данном режиме запрещено» можно увидеть в составе программной ошибки при работе в пользовательском интерфейсе на последних версиях платформы 1С.

1С высокими темпами двигается в WEB. А WEB, в свою очередь, имеет свои ограничения и прикладные моменты, требующие уважения. Так в интернет при работе в браузере назойливая реклама плотно засела во всплывающих окнах. Разработчикам браузеров этот метод работы с пользователями известен, поэтому, в подавляющем большинстве в настройках браузеров всплывающие окна по умолчанию отключены. Помимо этого, часть браузеров вообще не поддерживают всплывающие окна.

Такое ограничение вынуждены учитывать разработчики 1С, ведь при использовании модальных окон мы как раз работаем с всплывающими окнами, которые блокируют весь интерфейс программы, ожидая определенного действия пользователя, когда открывается модальное окно.

И этот факт мог бы легко остаться незамеченным, вызывая некорректную работу 1С в WEB, если бы не забота разработчиков 1С и назидательное напоминание о том, что при разработке программных интерфейсов необходимо учитывать среду использования создаваемых программ.

Начиная с версии 8.3.3.721 (06.09.2013) появилась настройка, доступная через конфигуратор, «Режим использования модальности». По умолчанию значение этой настройки «Не использовать». Подобный шаг информирует разработчиков прикладных решений 1С:Предприятие о том, что не везде программа будет вести себя корректно, и что необходимо обеспечить ее корректное поведение не только для работы в интерфейсе 1С, но и в других местах их потенциального использования для открытия модальных окон.

То есть программная ошибка в данном случае – это предупреждение. А предупреждения всегда оставляют право выбора. Поэтому варианты реагирования на контекст «Использование модальных окон в данном режиме запрещено» могут быть следующими:

1. Если использование прикладного решения планируется исключительно в интерфейсе 1С, то достаточно изменить значение настройки в конфигураторе, чтобы ошибка больше не возникала.

2. Если же использование прикладного решения планируется в WEB интерфейсе, тогда стоит пересмотреть подход к написанию программного кода с учетом обозначенных ранее ограничений браузеров. 

2. Изменение настройки использования модального режима окна в конфигураторе

Для того чтобы исключить появление ошибки программы 1С про модальный режим окна, если написанная программа не планируется к использованию в WEB, достаточно установить значение «Использовать» или «Использовать с предупреждениями» у настройки «Режим использования модальности».

Найти эту настройку можно в свойствах конфигурации в разделе «Совместимость» (правая кнопка на «Корне» конфигурации -> Свойства -> Последний раздел свойств.

Путь настройки для разрешения открытия модальных окон

Путь настройки для разрешения открытия модальных окон

Режим использования модальности

Режим использования модальности — Использовать с предупреждениями  

3.      Изменение программного кода для открытия модального окна

Есть несколько способов избавления от модальности в разрабатываемой конфигурации. Среди них:

1. Проверка конфигурации -> Логическая проверка -> Расширенная проверка -> Поиск использования модальности (для ручного исправления);

2. Рефакторинг -> Модальные вызовы -> Найти модальные вызовы модуля (проверка одного конкретного модуля для ручного исправления);

3. Конфигурация -> Рефакторинг -> Анализ модальных вызовов конфигурации (проверка всей конфигурации с анализом возможности автоматического исправления).

А само изменение подразумевает замену одних конструкций, использующих модальность на конструкции, не использующие модальность. Далее приведена таблица, в которой обозначены модальные методы и их немодальные аналоги.

 модальные методы и их немодальные аналоги

Специалист компании «Кодерлайн»

Сергей Пушкин

как делал это я, возможно быдлокод

<form enctype="multipart/form-data" class="gl_form">
<input type="text" name="name">
<input type="text" name="name2">
<input type="text" name="name3">
<div id="order" class="btn btn-success form-control">Заказать</div>
</form>

$('#order').on('click', function(){
        var msg   = $('.gl_form').serialize();
        $.ajax({
            type: 'post',
            url: '{{url()->current()}}',
            headers: { 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content') },
            data: msg,
            dataType: 'json',
            success: function(data){
                 if(data.success == 'yes'){
                    $('.yes').html('<h3>Спасибо за ваш заказа. Мы скоро с вами свяжемся</h3>');
                 }
                $.each(data, function(key, val) {
                    $.each(val, function(keyy, vall) {
                        $('.zakaz').prepend(vall);
                    });
                });

                 
            }
    });
    });

В методе котроллера
вверху вставляем

use Illuminate\Http\Request;
use Validator;

потом пишем свой метод

public function Order(Request $request){

$messages = [
    'name.required' => 'Текст ошибки',
    'file.required' => 'Текст ошибки',
    'transport_position.numeric' => 'Текст ошибки',
    ];
$validator = Validator::make($request->all(), [
    'name'=>'required',
    'file'=>'required',
    'transport_position' => 'numeric|between:1,99'
    ],$messages);


//Если ошибки возвращаем респонс с ними
if ($validator->fails()) {
    return Response()->json(array('errors' => $validator->getMessageBag()->toArray()));
    }

//Если нет ошибок возвращаем респонс, что все окей
    return Response()->json(array('success' => 'yes'));
}

I have implemented my MVVM error message as a message dialog that subscribes to error messages via a mediator class, so that other viewmodels can notify it if any errors occur.

When an error occurs, I set the visibility attribute in the viewmodel to Visible, to display the error window. This is all bound in the Error window from the viewmodel.

However, this window is NOT modal! I need to show it as a dialog and not just set the visibility to true — is there any kind of binding I can do, even if I have to extend the functionality of the window? I’d rather not break MVVM if I can avoid it.

Thanks!

asked Aug 24, 2009 at 9:28

bluebit's user avatar

1

The View/ViewModel split is meant to divide look from functionality. I firmly believe the Window is functionality and look rolled into one. For instance, what if in your ErrorMessageViewModel, you had this code that executes when there are errors:

class WindowViewModel : Window
{
}

.
.
.

WindowViewModel newDialog = new WindowViewModel();
newDialog.Content = myErrorListViewModel;
newDialog.Parent = mainWindowViewModel;
newDialog.ShowDialog();

So the contents of the dialog is the ViewModel for your error list. Define your View as a data template that automatically applies itself to the error list ViewModel.

Doesn’t that look like MVVM?

The fact is, the Window class is a ViewModel for the Window you see on the screen. By changing the properties of the Window object, it affects the «view» just like if the properties of the WindowView were bound to a WindowViewModel. The only thing missing is the ability to «restyle» the Window using WPF, and it doesn’t matter how hard you try to implement it, you’re not going to be able to do that. The user can restyle a Window by modifying their desktop theme, but you’re not in control of it. The best you can do is turn off the chrome and/or make it full screen.

answered Aug 25, 2009 at 17:38

Scott Whitlock's user avatar

Scott WhitlockScott Whitlock

13.7k7 gold badges66 silver badges114 bronze badges

1

You find an example how windows (don’t matter if they are modal or not) are shown, in the ViewModel example of this project:

WPF Application Framework (WAF)

http://waf.codeplex.com

answered Aug 29, 2009 at 10:17

jbe's user avatar

jbejbe

2,3141 gold badge14 silver badges2 bronze badges

I am also working on a MVVM project where I need modal dialogboxes or messageboxes. I have found the following way of solving it:

The software uses only one window. The layout root element is a Grid with no row- or columndefinitions. The grid has three children:

  1. A dockpanel that contains all the usual stuff like menus, tabbed views, status bar and so on.
  2. A grid that has a gray background and a 50% opacity. This is used as a veil to cover the dockpanel when a modal box is in effect. The veil grid is usually collapsed.
  3. A grid holding modal views, this is usually collapsed.

The viewmodel for the main window has a member called Modal. If this is null, the two grids for modal use are collapsed through databinding and a converter for Visibility.Collapsed.

When the program wants to display for example a modal message box, a MessageBoxViewModel is instantiated and assigned to MainViewModel.Modal. The MessageBoxViewModel has a Command for an OK-button. This Command raises an event that sets the MainViewModel.Modal to null again.

The veil grid occludes the main DockPanel, so that no controls outside the Modal control accept input.

Your program can either run a messagepump until OK is pressed, or the OK-Command can trigger the next. There are many ways of solving different needs, but the Model-ModelView solution should support them.

I feel that this is as good a model of the view in the modal mode as one can hope for.

answered Feb 18, 2010 at 19:07

Guge's user avatar

GugeGuge

4,5694 gold badges35 silver badges47 bronze badges

I made a behhavior to tie some modal dialogs to the command.

http://www.clr-namespace.com/post/MVVMModal-dialog-before-running-Command.aspx

<Confirm:Confirm IsConfirm="{Binding ElementName=checkBoxConfirm, Path=IsChecked}"
Command="{Binding Path=ButtonCommand}" 
CommandParameter="{Binding ElementName=textBoxParameter, Path=Text}" 
ConfirmMessage="Are you sure you want to fire the command?" 
ConfirmCaption="Question" >
</Confirm:Confirm>

answered Jun 12, 2010 at 7:16

Tau's user avatar

In my recent blog post you can find simple solution for Modal Dialogs and Message Boxes in MVVM for Silverlight but this can be simply reused in WPF:

Modal dialogs with MVVM and Silverlight 4

answered Jan 21, 2010 at 21:37

Roboblob's user avatar

RoboblobRoboblob

1,7951 gold badge22 silver badges27 bronze badges

1

i’m using the same method as Scott Whitlock.

there is just one more important property to set:

class ModalDialog: Window
{
}

.
.
.

var dlg = new ModalDialog {
    Content = viewModelName,
    **TopMost = true,**
    Parent = mainWindowViewModel
};

dlg.ShowDialog();

answered Jun 11, 2012 at 13:46

Pascalsz's user avatar

PascalszPascalsz

1,09011 silver badges10 bronze badges

Всем большое спасибо за помощь. Я решение нашел путем подключения другого скрипта.
Вот,что мне помогло:

JQUERY

$(document).ready(function() { // вся мaгия пoсле зaгрузки стрaницы
    $('a#go').click( function(event){ // лoвим клик пo ссылки с id="go"
        event.preventDefault(); // выключaем стaндaртную рoль элементa
        $('#overlay').fadeIn(400, // снaчaлa плaвнo пoкaзывaем темную пoдлoжку
            function(){ // пoсле выпoлнения предъидущей aнимaции
                $('#modal_form') 
                    .css('display', 'block') // убирaем у мoдaльнoгo oкнa display: none;
                    .animate({opacity: 1, top: '50%'}, 200); // плaвнo прибaвляем прoзрaчнoсть oднoвременнo сo съезжaнием вниз
                });
    });
    /* Зaкрытие мoдaльнoгo oкнa, тут делaем тo же сaмoе нo в oбрaтнoм пoрядке */
    $('#modal_close, #overlay').click( function(){ // лoвим клик пo крестику или пoдлoжке
        $('#modal_form')
            .animate({opacity: 0, top: '45%'}, 200,  // плaвнo меняем прoзрaчнoсть нa 0 и oднoвременнo двигaем oкнo вверх
                function(){ // пoсле aнимaции
                    $(this).css('display', 'none'); // делaем ему display: none;
                    $('#overlay').fadeOut(400); // скрывaем пoдлoжку
                }
                );
        });
});

Структура HTML:

<a href="#" id="go">Обратная связь</a>
<div id="modal_form">
	<span id="modal_close">X</span>
		<form>
			<h3 class="form">Обратная связь</h3>
			<h5>Ваше имя*</h5>
			<input type="text" name="name" required>
			<h5>Телефон*</h5>
			<input type="tel" name="tel" required>
			<h5>Email*</h5>
			<input type="email" name="email" required>
			<h5>Сообщение</h5>
			<textarea name="text"></textarea>
			<input type="submit" class="send_form" value="Отправить">
		</form>
	</div>
	<div id="overlay"></div>

Стили CSS:

#modal_form {
	width: 468px; 
	height: 577px; /* Рaзмеры дoлжны быть фиксирoвaны */
	background: #fff;
	position: fixed; /* чтoбы oкнo былo в видимoй зoне в любoм месте */
	top: 25% !important; /* oтступaем сверху 45%, oстaльные 5% пoдвинет скрипт */
	left: 44%; /* пoлoвинa экрaнa слевa */
	margin-top: -150px;
	margin-left: -150px; /* тут вся мaгия центрoвки css, oтступaем влевo и вверх минус пoлoвину ширины и высoты сooтветственнo =) */
	display: none; /* в oбычнoм сoстoянии oкнa не дoлжнo быть */
	opacity: 0; /* пoлнoстью прoзрaчнo для aнимирoвaния */
	z-index: 5; /* oкнo дoлжнo быть нaибoлее бoльшем слoе */
	padding: 20px 10px;
	text-align: center;
}
/* Кнoпкa зaкрыть для тех ктo в тaнке) */
#modal_form #modal_close {
	width: 21px;
	height: 21px;
	position: absolute;
	top: -21px;
	right: -21px;
	cursor: pointer;
	display: block;
	color: #fff;
	font-size: 17px;
	background-color: rgba(127,127,127,0.8);
}
/* Пoдлoжкa */
#overlay {
	z-index:3; /* пoдлoжкa дoлжнa быть выше слoев элементoв сaйтa, нo ниже слoя мoдaльнoгo oкнa */
	position:fixed; /* всегдa перекрывaет весь сaйт */
	background-color:#000; /* чернaя */
	opacity:0.8; /* нo немнoгo прoзрaчнa */
	-moz-opacity:0.8; /* фикс прозрачности для старых браузеров */
	filter:alpha(opacity=80);
	width:100%; 
	height:100%; /* рaзмерoм вo весь экрaн */
	top:0; /* сверху и слевa 0, oбязaтельные свoйствa! */
	left:0;
	cursor:pointer;
	display:none; /* в oбычнoм сoстoянии её нет) */
}

Цитата

Студворк — интернет-сервис помощи студентам

ВОПРОС ВНИЗУ
Сразу скажу спасибо за любую помощь!
И, если есть желание, можно связаться по скайпу, например. «maks-effect»

На данном этапе реализовано отдельно модальное окно при нажатии на «свою» кнопку и вывод ошибок при нажатии тоже на «свою» другую кнопку.
Нужно все это дело соединить. Вожусь с проблемой весь день. все мысли пришли в тупик..

МОДАЛЬНОЕ ОКНО

Кнопка загрузки и само модальное окно

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
            
<div id="button">   
    <input type="image" name="ok" onclick="show_modal()" src="https://www.cyberforum.ru/images/zakaz.png"/>
</div>
<div id="popupContact" style="z-index:101">
     <div style="position:relative;top:20px;z-index:3">
           <img src="https://www.cyberforum.ru/images/modal_back.png">
     </div>
     <div style="position:absolute;margin-left:120px;top:10px;z-index:4">
          <font style="font-size:13px" color="#000000" face="MyriadPro-Regular">
                Заполните, пожалуйста, корректно следующие области
            <!--Cюда должен помещаться текст-->
                        
           </font>
      </div>
</div>
<div id="backgroundPopup" style="z-index:100"></div>

Код функций

Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
    
var popupStatus = 0;
//Функция модального окна
function loadPopup(){// думал, сюда сделать один аргумент - сообщение из функции проверки, и далее его вывод в м.о.
    if(popupStatus==0){
        $("#backgroundPopup").css({
            "opacity": "0.7"
        });
        $("#backgroundPopup").fadeIn("slow");
        $("#popupContact").fadeIn("slow");
        popupStatus = 1;
    }
    //$('#popupContact').text(err); - собственно - его вывод
}
    
//Загрузка popup
    $("#button").click(function(){ // сюда была мысль поместить функцию проверки, и, при неуспешном исходе, - модальное окно с ошибками
        //центрирование 
        centerPopup();
        //загрузка
        loadPopup();
    });
                
    //Закрытие
    //Click out event!
    $("#backgroundPopup").click(function(){
        disablePopup();
    });
});

ПРОВЕРКА ПОЛЕЙ
Форма

HTML5
1
2
3
4
5
6
<form id="data" method = "post" action="#" onsubmit="return checkForm(this);">
... 
<!--поля-->
...
<form>
<input type="image" name="ok" src="https://www.cyberforum.ru/images/checkON.png" form="data"/> <!--кнопка(она находится вне формы-->

Код функции

Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
function checkForm(obj){
    ...
    ...
    ...
 
    // заносим значения полей в переменные
    ...
    ...
    ...
 
    // объявляем переменную куда будет заносится текст сообщения
    var error_msg = "Не корректно заполнины поля: ";    
   
    //проверка полей
    ...
    ...
    ...
    
    //проверка на наличие ошибок, если возникла ошибка ввыводим текст сообщения
    if(!return_value)
        alert(error_msg);
           
    return return_value;
}

Нужно:При нажатии одной кнопки, осуществлять проверку написания, и, если все верно — перенаправление на другую стр., если нет — высвечивается модальное окно с ошибками.

Добавлено через 16 часов 9 минут
спасибо, проблема решена.

Добавлено через 23 секунды
спасибо, проблема решена.

Понравилась статья? Поделить с друзьями:
  • Мода эксель ошибка
  • Множественные ошибки обновления привели к завершению игры mir4
  • Мода excel ошибка
  • Модель коррекции ошибок eviews
  • Множественная регрессия стандартная ошибка оценки