Всем привет.
Задача: Нужно сделать реализацию добавления сообщений без перезагрузки страницы.
Решение:
- Сделал форму с текстовым input и button, к которому привязал событие onclick с отработкой функции send_mesage()
- Создал инфоблок, куда будут грузиться все комментарии
- Прописал блок, в который GetList-ом будут выводится все элементы этого самого инфоблока
- Написал скрипт, который посредством ajax будет отправлять на эту же страницу данные из формы.
Всё это одной странице и выглядит вот так.
Сначала идёт js с функцией ребута блока, затем функция отправки данных ajax-ом (создание объекта getXmlHttpRequest я не писал, но оно есть, подключено):
function mode(){
$.ajax({
url: location.href,
success: function(data) {
$('#result_form').html(data);
}
});
};
var message;
function mess_add(){
var objForms = document.forms.ajax_form[0].name + "=" + document.forms.ajax_form[0].value;
message = getXmlHttpRequest();
message.open("POST", location.href, false);
message.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
message.onreadystatechange = function(){
if(message.readyState == 4){
if(message.status == 200){
mode();
}
}
}
message.send(objForms);
}
Далее мы создаём элемент в инфоблоке
if(isset($_POST["comments_text"])){
CModule::IncludeModule('iblock');
$elCom = new CIBlockElement;
$PROP = array();
$PROP["COMMENTS"] = $_POST["comments_text"];
$PROP["USER_AUTHOR"] = $USER->GetID();
$PROP["ID_EVENT"] = $arResult["ID"];
$fieldsComments = Array(
"DATE_CREATE" => date("d.m.Y H:i:s"), //Передаем дата создания
"CREATED_BY" => $USER->GetID(),
"IBLOCK_ID" => 33,
"PROPERTY_VALUES"=> $PROP,
"NAME" => "unknow",
"ACTIVE" => "Y", // активен
);
$IDcom = $elCom->Add($fieldsComments);
if($IDcom){
// LocalRedirect("/youdo/event_view/detail.php?ID=".$arResult["ID"]);
}
}
Далее идёт блок с выводом сообщений
<div id="result_form">
<table style="width: 100%;">
<? $arSelect = Array("ID", "IBLOCK_ID", "DATE_CREATE");
$arFilter = Array("IBLOCK_ID" => 33, "ACTIVE"=>"Y", "PROPERTY_ID_EVENT" => $arResult["ID"]);
$res = CIBlockElement::GetList(Array(), $arFilter, false, Array(), $arSelect);
while($final_array = $res->GetNextElement()){
$arFields = $final_array->GetFields();
$arProps = $final_array->GetProperties();
$rsUser = CUser::GetByID($arProps["USER_AUTHOR"]["VALUE"]);
$arUser = $rsUser->Fetch();
$arImage = CFile::GetPath($arUser['PERSONAL_PHOTO']);?>
<tr>
<td rowspan="2" style="width: 110px;"><?if(!empty($arImage)):?><img src="<?=$arImage;?>" alt=""><?else:?><img src="<?=CUtil::GetAdditionalFileURL(SITE_TEMPLATE_PATH.'/image/user.png')?>" alt=""><?endif;?></td>
<td style="color: #343F4B;"><?=$arUser["NAME"]." ".$arUser["LAST_NAME"];?></td>
<td style="width: 15%; text-align: right; font-size: 12px; color: silver;"><?=$arFields["DATE_CREATE"];?></td>
</tr>
<tr>
<td colspan="2" style="color: #8492A6;"><?=$arProps["COMMENTS"]["VALUE"];?></td>
</tr>
<?}?>
</table>
</div>
И сама форма.
<form action="" method="get" id="form_message_add">
<input type="text" name="message">
<button onclick="send_message()">Отправить</button>
</form>
Всё окей. Элементы добавляются, но в указанный блок с id result_form первым ответом приходит вся страница. Блок ребутается, но туда помещается не обновлённые данные а вся страница. Кто направит на путь истинный? Заранее спасибо.
