Показать сообщение отдельно
  #1 (permalink)  
Старый 13.06.2017, 10:37
Новичок на форуме
Отправить личное сообщение для konst37 Посмотреть профиль Найти все сообщения от konst37
 
Регистрация: 12.06.2017
Сообщений: 5

Как правильно обработать AJAX
Хочу реализовать панель с кнопками-переключателями, которые будут менять внешний вид в зависимости от своего data-атрибута, т.е.
<div id="work-1" class="btn btn-default btn-sm day-work" data-flag="1"> Дневная </div>
<div id="work-1" class="btn btn-success btn-sm day-work" data-flag="2"> Ночная </div>

Сейчас на кнопке висит скрипт, который отправляет на сервер data-атрибут. В контроллере апдейтится поле в зависимости от пришедшего параметра и отправляется ответ с новым data-аттрибутом кнопки.
<script>
        $(".day-work").on("click", function (){
            var dataFromButton = $(this).data("flag");
            var workerLocalId = $(".worker-local-id").data("worker-local-id");
            var periodId = $(".period-id").data("period-id"); 
            var dayMonth = $(this).parents(".panel-body").prev(".panel.panel-heading").data("day-month");            
            $.ajax({
                url: '/worker/update-day-work',
                type: 'POST',
                data: {
                    workerLocalId : workerLocalId,
                    periodId : periodId,
                    dayMonth : dayMonth,
                    flag : dataFromButton
                },
                success: function (data, textStatus, jqXHR) {
                            alert("Прибыли данные!" + data);
                        }
            })
        });
</script>

Панель с кнопками пока выглядит так.
<div class ="col-lg-2"> 
	<div class="panel panel-default">
		<div class="panel panel-heading text-center"  data-day-month=<?= $workDate ?>> <b> <?= date("d", strtotime($day["workDate"])) ?> </b> </div>           
		<div class="panel panel-body"> 
			<div class ="row">
				<div class ="col-sm-4 center-block"> 
					<div id="<?= 'work-' . $i ?>" class = "btn btn-<?= $buttonType ?> btn-sm day-work" data-flag=<?= $day["workShiftId"] ?>> <?= $buttonTitle ?> </div>  
				</div> 
				<div class ="col-sm-4 center-block">
					<div class = "btn btn-default btn-sm day-repair" data-flag=1>Ремонт</div>
				</div>
				<div class ="col-sm-4 center-block">
					<div class = "btn btn-default btn-sm day-leave" data-flag=1>Отпуск</div>
				</div>
			</div>
		</div>
	</div>
</div>

Вопрос в том, что мне отправить в ответе сервера? HTML собранной кнопки, параметры для сбора кнопки на клиенте? И как потом повесить на эту вновь полученную кнопку скрипт на событие?
Ответить с цитированием