Отправить конкретную переменную php с помощью ajax

Question

У меня есть много элементов, я хочу опубликовать конкретную информацию о товаре после нажатия кнопки ajax. Обычно я храню его информацию по атрибуту data-name, data-date и т. Д. Я использую jquery, чтобы получить его по .attr(). Я не знаю, как это сделать, если текст слишком длинный или каждый элемент имеет массив текста {"Text1", "Text2","Text3"...."Text20"}. Я не могу хранить его как атрибут. Я не могу понять, куда его поместить или как & как получить jQuery?

мои детали выглядят очень просто, как этот

<div class="item"> 
    <a data-name="item1" data-available="1" data-color="blue">Item1</a> 
</div> 
<div class="item"> 
    <a data-name="item2" data-available="1" data-color="pink">Item2</a> 
</div> 

Это мой JQuery

jQuery(".item a").on('click', function() { 
      var url = "/test.php";   
      var item_name = jQuery(this).attr("data-name");  

      jQuery("#display").html("<img id='loading_gif' src='/loading.gif'>"); 
      jQuery("#display").load(url,{item_name:item_name}); 
      return false; 
    }); 

Answer 1

Вы можете отправить данные JSON в файл PHP с использованием Ajax,

jQuery(".item a").on('click', function() { 
    var available = $(this).attr("data-available"), 
     color = $(this).attr("data-color"); 

    $.ajax({ 
     url: 'url_to_your_phpfile.php', 
     type: 'post', 
     data: { 
      avail: available, 
      color: color 
     }, 
     success: function (data){ 
      console.log(data); // do something 
     } 
    }); 
} 

И ваш файл PHP, вы можете получить переменную, просто используя $_POST['avail'] и $_POST['color']

EDIT

Поскольку вы хотите получить доступ к данным из PHP в ваш JavaScript, вы можете хранить, что в яваскрипте переменного, например

<?php 
    $products = array(
     array("id" => 1, "name" => "Item 1", "color" => "red", "desc" => "some large text..."), 
     array("id" => 2, "name" => "Item 2", "color" => "blue", "desc" => "some large text...") 
    ); 
    echo '<script>var products = '.json_encode($products).'</script>'; 
    // and then display 
    foreach($products as $product): 
     echo '<div class="item"><a data-id="'.$product->id.'" data-color="'.$product->color.'">'.$product->name.'</a></div>'; 
    endforeach; 

И я предполагаю, что ваш Javascript файл будет всегда находиться в нижней части страницы, поэтому вы всегда можете вызвать переменную products на свой код javascript. В ваших JS, вы всегда можете добавить пользовательскую функцию, чтобы найти свой продукт по его ID

function findProduct(id){ 
    var product = products.filter(function (product){ 
     if(product.id == id){ 
      return product; 
     } 
    }); 
    return products.length > 0 ? products[0] : product; 
} 

$('.item a').on('click', function() { 
    // get the id 
    var id = $(this).attr("data-id"); 
    // now, make a function that finds other data for that product with that ID 
    var product = findProduct(id); // finds a product from variable products 
    // product variable will now contain id, name, color, desc and 
    // can be accessed directly with product.id, product.desc, etc. 
});