Dont understand why I have error undefined inside my javascript

Question

I try to solve a problem inside my javascript.

My first file product.php I have a php loop give me a value on $languages[$i]['id']

         <?php
          for ($i = 0, $n = \count($languages); $i < $n; $i++) {
            ?>

   <div class="col-md-4 input-group" id="products_head_title_tag<?php echo $i; ?>">
                <?php echo '&nbsp;' . HTML::inputField('products_head_title_tag[' . $languages[$i]['id'] . ']', SeoAdmin::getProductsSeoTitle($pInfo->products_id, $languages[$i]['id']), 'maxlength="70" size="77" id="products_head_title_tag_' . $i . '" data-language="' . $languages[$i]['name'] . '" data-languageid="' . $languages[$i]['id'] . '"', false);
                var_dump('data-languageid="' . $languages[$i]['id'] . '"');
                ?>
              </div>
            <?php
              }
             ?>

the result of :

var_dump('data-languageid="' . $languages[$i]['id'] . '"');

take the value for the loop, 1, 2 .... This the id of the language

my php loop does not have a problem works very fine.

Now in another files I call script.php mix php and js.

What happen ! Inside my loop I have 2 iterations, but inside the script when is loaded, I have 4 iterations like that on this value $languages[$i]['id']

undefined
1
undefined
2

for languageName

I tried to solve this problem to add a condition, and inside the condition, the value is correct but after the condition questionResponse is always empty due at undefined I think

I try to add let questionResponse = null but it does not resolve the problem. questionResponseis always undefined.

I do not know how to resolve this situation, Do you have an idea to try ?

Thank you

     $content = '<button type="button" class="btn btn-primary btn-sm submit-button" data-index="0">';
      $content .= '<i class="bi-chat-square-dots" title="' . $this->app->getDef('text_seo_page_title') . '"></i>';
      $content .= '</button>';

$output = <<<EOD
<!------------------>
<!-- ChatGpt start-->
<!------------------>
<script>
$('[id^="products_head_title_tag"]').each(function(index) {
  let button = '{$content}';
  let newButton = $(button).attr('data-index', index);
  let inputId = $(this).attr('id'); // Récupérer l'id de l'input pour l'itération actuelle
  let regex = /(\d+)/g; // Expression régulière pour extraire l'id
  let idProductsHeadTitleTag = regex.exec(inputId)[0]; // Extraire l'id de l'input
  let productsName = '{$ProductsAdmin->getProductsName($id)}';
  
  let languageName = $(this).data('language'); // Extraire la valeur de data-language

alert(languageName);

  if (typeof languageName !== 'undefined' && languageName !== 'undefined') { 
      let languageId = $(this).data('languageid'); // Extraire la valeur de data-languageId      
    var questionResponse = '{$this->app->getDef('text_seo_page_title_question', ['languageName' => "' + languageName + '", 'productsName' => "' + productsName + '"])}';
  }
   
  newButton.click(function() { // Ajouter un listener pour chaque bouton
    let message = questionResponse; // Valeur envoyée 

    alert(message); ===> here it's always empty


    $.post("{$url}", {message: message}, function(data) {
      $("#products_head_title_tag_" + idProductsHeadTitleTag).val(data); 
    });
  });

  $(this).append(newButton); 
});
</script>
EOD;
      return $output;