Размещать контент на php через jquery

Question

Я изо всех сил пытаюсь передать простой текст из div в файл php post. В приведенном ниже примере переменная first_name назначается полю ввода, но я бы предпочел опубликовать текст ниже.

Какое решение будет правильным?

function clickButton() {
  var first_name = document.getElementById('first_name').value;

  $.ajax({
    type: "post",
    url: "cases_action.php",
    data: {
      'first_name': first_name
    },
    cache: false,
    success: function(html) {
      alert('Data Send');
      $('#msg').html(html);
    }
  });
  
  return false;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<form>
  <p>First Name: <input type="text" name="first_name" id="first_name" placeholder="Your first name.."></p>
  <input type="submit" class="btn btn-primary btn-purchase" name="" value="submit" onclick="return clickButton();">
</form>
<p id="msg"></p>

<p>This text should be passed to cases_action via "first_name" instead of content from the input textbox </p>

Answer 1

"из div" ... Я вижу <p>, но не <div>. Они разные.

В любом случае, это просто пояснение по терминологии.

Если вы хотите получить текст из элемента <p>, то это просто - просто напишите код, чтобы посмотреть на этот элемент. Прямо сейчас вы выбираете из поля формы в своем Javascript, поэтому вам просто нужно изменить цель.

Присвойте <p> идентификатор и выберите вместо него (используя .innerText, потому что неформальные элементы не имеют value).

Демо (в котором я ' Мы также предположили, что вы хотите изменить имя поля, которое вы отправляете в AJAX, поскольку это больше не имя:

function clickButton() {
  var text = document.getElementById('text').innerText;
  console.log(text);

  $.ajax({
    type: "post",
    url: "cases_action.php",
    data: {
      'text': text
    },
    cache: false,
    success: function(html) {
      alert('Data Send');
      $('#msg').html(html);
    }
  });
  
  return false;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<form>
  <input type="submit" class="btn btn-primary btn-purchase" name="" value="submit" onclick="return clickButton();">
</form>
<p id="msg"></p>

<p id="text">This text should be passed to cases_action via "first_name" instead of content from the input textbox </p>