AJAX. Why does the entire document come back?

Question

1C-Bitrix

Hello.
Task: It is necessary to make the implementation of adding messages without reloading the page.
Decision:

1. I made a form with a text input and a button, to which I attached an onclick event with the send_mesage () function
   
2. Created an infoblock where all comments will be loaded
   
3. Registered a block in which GetList will display all the elements of this very infoblock
   
4. I wrote a script that, using ajax, will send data from the form to the same page.
   

It's all on one page and looks like this.

First comes js with the block reboot function, then the ajax data sending function (I did not write the creation of the getXmlHttpRequest object, but it is there, connected):

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);
  }

Next, we create an element in the infoblock

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"]);
  }
}

Next comes the block with the output of messages

<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>

And the form itself.

<form action="" method="get" id="form_message_add">
<input type="text" name="message">
<button onclick="send_message()">Отправить</button>
</form>

Everything is OK. Elements are added, but the first response to the specified block with id result_form is the entire page. The block is rebuilt, but not the updated data is placed there, but the entire page. Who will guide you on the right path? Thanks in advance.

Answer 1

restartbuffer
https://dev.1c-bitrix.ru/support/forum/forum6/topi...