Как определить, откуда вызвано модальное окно?
Добрый день.
У меня в форме есть два элемента, "От кого" и "Кому", при их нажатии открывается список пользователей в модальном окне. Список один на оба элемента, как мне определить, из какого элемента он был вызван и куда мне передавать данные? |
|
Спасибо. Вы мне очень помогли
|
mbp64,
Цитата:
Но это чисто гипотетически, т.к. в вашем вопросе практически нет информации об используемых технологиях. http://javascript.ru/forum/misc/3706...-otvetili.html |
Проблема в том, что я доделываю сайт вместо прежнего разработчика.
Там непонятно, как он вызывает модальные окна Я занимаюсь программированием только в крайней необходимости, когда успеваю всё забыть :( Если бы мне подвернулась работа админом, я бы с радостью послал все это дело подальше |
А где можно посмотреть пример реализации модальных окон?
|
mbp64, боюсь, без более подробной информации об используемых технологиях/фреймворках/цмс вы помощи не дождетесь, потому что реализаций очень много и они могут очень сильно различаться.
|
Мне что-нибудь простое на jquery, выбрать в таблице строку вида
<tr id="3443"><td>блабла</td></tr> и передать значение id в вызвавшую его форму. какие еще нужны подробности? |
Точнее, не в вызвавшую форму, а поместить в поле, из которого было вызвано окно
|
mbp64, я так понял, у вас уже есть какой-то код, который писали не вы, и вам для него надо сделать "надстройку". Без хотя бы минимального представления о том, что там уже есть, сделать что-то адекватное вряд ли получится.
|
нет, я хочу это переделать
|
я быстро нарисую на php таблички для выбора, сделаю их скрытыми, мне нужно сделать выбор и передачу значения в поле
|
mbp64,
https://jqueryui.com/dialog/ - модальные окна https://api.jquery.com/click/ - обработчик клика http://api.jquery.com/attr/ - прием-передача атрибутов типа id, class и любых других |
причем, чем проще, тем лучше
|
Не получается обработать клик :(
|
<input name="otkogo" type="text" />
<input name="komu" type="text" />
<div class="table" style="display:none">
<div class="user">
<span class="id">1</span>
<span class="name">меня</span>
</div>
<div class="user">
<span class="id">2</span>
<span class="name">забанили</span>
</div>
<div class="user">
<span class="id">3</span>
<span class="name">в</span>
</div>
<div class="user">
<span class="id">4</span>
<span class="name">гугле</span>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$('input').focusin(function(){
var name = $(this).attr('name');
$('.table').attr('kuda',name).fadeIn();
});
$('.table').on('click','.user',function(){
var kuda = $('.table').attr('kuda');
var value = $(this).find('.id').html()+' - '+$(this).find('.name').html();
$('*[name="'+kuda+'"]').val(value);
$('.table').fadeOut();
});
</script>
|
Спасибо. Я попробую в этом разобраться
|
mbp64, все выглядит примерно так:
<script>
$('input').focusin(function(){// - при получении полем фокуса сработают две следующие строки
var name = $(this).attr('name');// - присваиваем переменной name атрибут name поля, которое в фокусе
$('.table').attr('kuda',name).fadeIn();// - передаем в атрибут "kuda" дива, в котором пользователи атрибут name поля, которое в фокусе и показываем таблицу
});
$('.table').on('click','.user',function(){// - при клике по строке с пользователем сработают следующие четыре строки
var kuda = $('.table').attr('kuda');// - присваиваем переменной kuda значение атрибута kuda блока с пользователями, в котором находится имя поля
var value = $(this).find('.id').html()+' - '+$(this).find('.name').html();// - создаем текст, который нужно запихать в текстовое поле и укладываем его в переменную value
$('*[name="'+kuda+'"]').val(value);// - кладем в текстовое поле значение из предыдущей строки
$('.table').fadeOut();// - прячем таблицу
});
</script>
|
:write:
<meta charset="utf-8">
<input name="otkogo" type="text" />
<input name="komu" type="text" />
<div class="table" style="display:none">
<div class="user">
<span class="id">1</span>
<span class="name">меня</span>
</div>
<div class="user">
<span class="id">2</span>
<span class="name">забанили</span>
</div>
<div class="user">
<span class="id">3</span>
<span class="name">в</span>
</div>
<div class="user">
<span class="id">4</span>
<span class="name">гугле</span>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
var obj = {};
$('input').focusin(function(){
obj.el = this;
$('.table').fadeIn();
});
$('.table').on('click','.user', obj,function(e){
var value = $(this).find('.id').html()+' - '+$(this).find('.name').html();
$(e.data.el).val(value);
$('.table').fadeOut();
});
</script>
|
mbp64,
В хроме: 1. Правой кнопки мыши по элементу на котором установлен обработчик события 2. Инспектировать элемент 3. Справа в панеле. Таб - Event Listeners, пункт - click |
Не получается. Список не отображается, но значения откуда-то подставляются
|
mbp64, код-то покажите))))
|
Ясно, спасибо
|
Вот поля ввода:
<div id="fromuser" class="form-group">
<label>От сотрудника<input type="text" name="from_user" value=""></label>
</div>
<div id="touser" class="form-group">
<label>Сотруднику<input type="text" name="to_user" value=""></label>
</div>
</div>
А здесь я генерю форму:
<div class="table" style="display:none">
<?php foreach($tpl->users_list as $user) { ?>
<div class="user">
<span class="id"><?php echo $user['user_id']; ?></span>
<span class="name"><?php echo $user['last_name'].' '.$user['first_name'].' '.$user['patronymic']; ?></span>
</div>
<?php } ?>
</div>
Код Js взял из примера без измений |
mbp64, в консоли пишется что-нибудь?
|
выкинул всё, оставил только
$('input').focusin(function(){
alert('999');
});
- не работает.как же я ненавижу это кривое глючное уёбище! |
ничего
|
Спасибо всем, кто ответил
|
| Часовой пояс GMT +3, время: 02:49. |