Purchase in one click (1C-Bitrix)?

Question

1C-Bitrix

Hi all! Please tell me how to correctly make the "buy in one click" function work on the product card WITHOUT adding to the cart, by simply clicking on the button in the product card.
That is, now I have this module, it works only when any product in the cart, but when the cart is empty, it doesn’t work (I stupidly display the button on the product card, well, the message “cart is empty” naturally pops up), as I understand it, do I need to register the product ID?
HERE is the actual code for this component (in the small basket template)

<?$APPLICATION->IncludeComponent(
   "westpower:sale.order.oneclick", 
   "template_new", 
   array(
      "IBLOCK_TYPE" => "dict",
      "IBLOCK_ID" => "179",
      "OFFERS_PROPERTY_CODE" => array(
         0 => "",
         1 => "",
      ),
      "IS_JQUERY" => "Y",
      "PERSON_TYPE" => "1",
      "PERSON_TYPE_PROPS" => array(
         0 => "1",
         1 => "2",
         2 => "3",
      ),
      "ORDER_PRODUCT" => "2",
      "PAYSYSTEM" => "1",
      "DELIVERY" => "1",
      "USE_USER" => "N",
      "USE_COMMENT" => "N",
      "EVENT_MESSAGE_ID" => array(
      ),
      "USE_CAPTCHA" => "N",
      "TITLE_POPUP" => "Оформление заказа в один клик",
      "CONFIRM_ORDER" => "Спасибо. Ваш заказ принят.",
      "IMAGE_WIDTH" => "130",
      "IMAGE_HEIGHT" => "130",
      "HIDE_BUTTON" => "Y",
      "COMPONENT_TEMPLATE" => "template_new",
      "PRODUCT_ID" => "",
      "PRICE_CODE" => "BASE",
      "USE_COUNT" => "N",
      "PRODUCT_PRICE" => "100",
      "PRODUCT_WEIGHT" => "0",
      "PRODUCT_NAME" => "",
      "PRODUCT_URL" => ""
   ),
   false
);?>

same style

<st yle>
#SALE_ORDER {
    background-color: #ff8000 !important;
      /*border: 2px solid #000 !important;*/
    border-radius: 8px !important;
    color: #fff !important;
   font-size:16px !important;
   font-weight: bold;
font-family: "franckercyr-light";
    text-shadow: none !important;
    margin-top: 15px;
    padding: 8px;
   margin-top:-40px;
   float:left;
}
</style>

Here is the html code

<div><input type="submit" name="SALE_ORDER" id="SALE_ORDER" value="В 1 клик" border="0" oncl ick="fShowAllowDelivery(
   'Оформление заказа в один клик', 
   'Оформить', 
   'Закрыть',
   '/bitrix/components/westpower/sale.order.oneclick/component.php',
   '0',
   'Спасибо, ваш заказ принят.'
);"></div><br/>

Here is the component template (template_new)

<div id="sale-order-popup<?=$arParams["PRODUCT_ID"]?>" class="sale-order-popup">
   <fo rm action="<?=$APPLICATION->GetCurPage()?>" name="order-form<?=$arParams["PRODUCT_ID"]?>" id="sale-order-form<?=$arParams["PRODUCT_ID"]?>" method="post">
   <?=bitrix_sessid_post()?>
   <input type="hidden" name="AJAX_CALL" value="Y">
   <input type="hidden" name="AJAX_PARAMS" value='<?=$arResult["PARAMS"]?>'>
   <input type="hidden" name="AJAX_SEND" id="AJAX_SEND<?=$arParams["PRODUCT_ID"]?>" value="N">

   <div id="sale-error<?=$arParams["PRODUCT_ID"]?>"></div>
   
   <table class="order-popup-table">
      <?if (!empty($arResult["ELEMENTS"])):?>
         <tr>
            <td colspan="2" class="order-popup-title"><?=$arResult["ELEMENTS"]["NAME"]?></td>
         </tr>
      <?endif;?>
      <tr>
         <?if (!empty($arResult["ELEMENTS"])):?>
            <td>
               <?if (strlen($arResult["ELEMENTS"]["RESIZE_PICTURE"]["src"]) > 0):?>
                  <img src="<?=$arResult["ELEMENTS"]["RESIZE_PICTURE"]["src"]?>" alt="">
               <?else:?>
                  <div class="order-popup-nofoto"></div>
               <?endif;?>
               <div class="order-popup-price">
                  <?if (is_array($arResult["ELEMENTS"]["PRICES_MIN_OFFERS"])
                     && strlen($arResult["ELEMENTS"]["PRICES_MIN_OFFERS"]["VALUE"]) > 0):?>
                     <?=GetMessage("SALE_PRICE_FROM")?>:
                     <span><?=$arResult["ELEMENTS"]["PRICES_MIN_OFFERS"]["PRINT_VALUE"]?></span>
                  <?else:?>
                     <?=GetMessage("SALE_PRICE")?>:
                     <span><?=$arResult["ELEMENTS"]["PRICES"]["PRICE"]["PRINT_PRICE"]?></span>
                  <?endif;?>
               </div>
            </td>
         <?endif;?>
         <td>
            <?if (!empty($arResult["ELEMENTS"]["OFFERS"])):?>
               <?foreach ($arResult["ELEMENTS"]["OFFERS"] as $key => $val):?>
                  <div class="order-popup-offers">
                     <div class="order-offers-name">
                        <input type="radio" name="element_offers" value="<?=$val["ID"]?>" id="element_offers_<?=$val["ID"]?>" <?=($key == 0)?"checked":"";?>> 
                        <label for="element_offers_<?=$val["ID"]?>"><?=$val["NAME"]?></label>
                     </div>
                     <?if (!empty($val["DISPLAY_PROPERTIES"])):?>
                        <?foreach ($val["DISPLAY_PROPERTIES"] as $item):?>
                           <div class="order-offers-props"><?=$item["NAME"]?>: <?=$item["VALUE"]?></div>
                        <?endforeach;?>
                     <?endif;?>
                     <div class="order-offers-props price"><?=GetMessage("SALE_PRICE")?>: <?=$val["PRICE"]?></div>
                  </div>
               <?endforeach;?>
            <?endif;?>
            
            <?include($_SERVER["DOCUMENT_ROOT"].$templateFolder."/props.php");?>
         </td>
      </tr>
   </table>
   
   <?if($arParams["USE_CAPTCHA"] == "Y"):?>
      <table class="captcha">
      <tr>
         <td class="title"><?=GetMessage("SALE_CAPTCHA")?><span class="required">*</span></td>
         <td class="field">
            <input type="hidden" id="captcha_sid<?=$arParams["PRODUCT_ID"]?>" name="captcha_sid" value="<?=$arResult["capCode"]?>">
            <img src="/bitrix/tools/captcha.php?captcha_sid=<?=$arResult["capCode"]?>" width="180" height="40" alt="CAPTCHA" id="captha-img<?=$arParams["PRODUCT_ID"]?>">
            <div class="mf-text"><?=GetMessage("SALE_CAPTCHA_CODE")?></div>
            <input type="text" name="captcha_word" id="captcha_word<?=$arParams["PRODUCT_ID"]?>" class="captha" maxlength="50" value="">
            
            <input type="button" name="reload-captcha" class="sale-reload-captcha" value="" onCl ick="reloadCaptcha('<?=$arParams["PRODUCT_ID"]?>');" title="<?=GetMessage('SALE_CAPTHA_TITLE');?>">
         </td>
      </tr>
      </table>
   <?endif;?>

   </form>
</div>

<?if ($arResult["HIDE_BUTTON"] != "Y"):?>
   <input type="submit" name="SALE_ORDER" id="SALE_ORDER" value="<?=GetMessage("SALE_BTN")?>" 
   onCl ick="fShowAllowDelivery(
   '<?=$arParams["TITLE_POPUP"];?>', 
   '<?=GetMessage('SALE_BTN_ORDER');?>', 
   '<?=GetMessage('SALE_BTN_CLOSE')?>',
   '<?=$arResult["URL_POST"]?>',
   '<?=$arParams["PRODUCT_ID"]?>',
   '<?=GetMessage("SALE_ORDER_CONFIRM");?>'
   );">

Answer 1

Make Bitrix web forms.