Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Как правильно обработать AJAX (https://javascript.ru/forum/misc/69301-kak-pravilno-obrabotat-ajax.html)

konst37 13.06.2017 10:37

Как правильно обработать 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 собранной кнопки, параметры для сбора кнопки на клиенте? И как потом повесить на эту вновь полученную кнопку скрипт на событие?

laimas 13.06.2017 11:02

Цитата:

Сообщение от konst37
Вопрос в том, что мне отправить в ответе сервера?

А что вы у него запрашиваете?

konst37 13.06.2017 11:14

Сейчас ничего не возвращаю.
Мне просто нужно изменить вид кнопки и надпись на ней, чтоб отразить ситуацию. К примеру если работник отработал в дневную смену, то кнопка белая с надписью "Дневная", а если по ней кликнуть, то на сервер уходит AJAX и смена апдейтится на ночную. Соответственно кнопка должна стать синей с надписью "Ночная".

laimas 13.06.2017 11:19

Цитата:

Сообщение от konst37
Мне просто нужно изменить вид кнопки и надпись на ней, чтоб отразить ситуацию.

Отражайте, причем тут Ajax тогда? Первый html-код связан по событию с js-кодом. Чего там запрашивается и зачем, одному богу известно, ибо параметры запроса и близко никак не связать с третьим кодом. Так в чем вопрос то?

ksa 13.06.2017 11:21

Цитата:

Сообщение от konst37
К примеру если работник отработал в дневную смену, то кнопка белая с надписью "Дневная", а если по ней кликнуть, то на сервер уходит AJAX и смена апдейтится на ночную. Соответственно кнопка должна стать синей с надписью "Ночная".

Пусть сервер шлет слова "Дневная" или "Ночная", а так же имя класса для ЦСС-оформления документа. Ну и значение для data-свойства...

laimas 13.06.2017 11:46

Цитата:

Сообщение от ksa
Пусть сервер шлет слова "Дневная" или "Ночная", а так же имя класса для ЦСС-оформления документа.

А что клиент сам с этим разобраться не может? :)

ksa 13.06.2017 13:20

Цитата:

Сообщение от laimas
А что клиент сам с этим разобраться не может?

Ты странные вопросы мне задаешь... :)))

Задам странный вопрос и тебе:
- А зачем с этим разбираться клиенту?

laimas 13.06.2017 13:38

Цитата:

Сообщение от ksa
А зачем с этим разбираться клиенту?

Вот я и спрашиваю, зачем, если клиент и без сервера знает какую кнопку нажали, и слова "Дневная", "Ночная" вполне и без сервера написать сможет? :)

ksa 13.06.2017 13:40

laimas, делай как тебе нравится... Не нужно ко мне приставать со своими проблемами. Я их решать не стану. :no:

laimas 13.06.2017 13:47

Цитата:

Сообщение от ksa
laimas, делай как тебе нравится...

Я тут причем? :D Я вообще не понимаю почему форум должен догадываться, что сервер должен возвращать.


Часовой пояс GMT +3, время: 00:57.