javascript - Run php script with AJAX and POST - Stack Overflow

admin管理员组

文章数量:1387401

I'm quite new to AJAX. I did some of them with javascript that returns HTML, but I'm struggling with something that I think should be really simple.

I have a header with an inline element:

<header>
  <span class="right_alignment">
    <a id="delete_work" href="">
      <input id ="work_id" type="hidden" value="<?php echo $work_id ?>"/>
      <i class="fa fa-plus" aria-hidden="true">
      </i>
    </a>
  </span>
</header>

I want to send $work_id to a PHP script that executes a MySQL query that deletes this record in the database. It has to be a POST request, and as it is an inline element I can't use a form. So AJAX is the way. This is my try:

$( document ).ready(function() {
  $("#delete_work").click(function () {
    $.ajax({
      url: 'scripts/script-delete-work.php',
      type: 'POST',
      data: $('#work_id').val(),
    });
  });
});

For now script-delete-work.php don't worry me, so is as simple as:

$edition_id = $_POST['work_id'];
echo $work_id;

But this setup doesn't work. I know that it is the simplest form of an AJAX, but I can't figure how to send the data or what is failing. Any help?

Thanks!

EDIT -- Ok, I solved the data thing. What I have now is:

HTML

<span class="span_edit_right">
  <a id="delete_work" href="">
    <input id="work_id" type="hidden" value="<?php echo $work_id; ?>"/>
        <i class="fa fa-trash-o" aria-hidden="true">
        </i>
  </a>
</span>

Script:

$( document ).ready(function() {
  $("#delete_work").click(function () {
    var val = $('#work_id').val();
    $.ajax({
      url: 'scripts/script-delete-work.php',
      type: 'POST',
      data: { "work_id" : val },
      success: function ()
      {
        alert("works!");
      }
    });
  });
});

PHP

<?php echo $_POST['work_id'];

When I click on #delete_work it returns the alert "works", and reload the page, but doesn't show the page with <?php echo $_POST['work_id'];.

I'm quite new to AJAX. I did some of them with javascript that returns HTML, but I'm struggling with something that I think should be really simple.

I have a header with an inline element:

<header>
  <span class="right_alignment">
    <a id="delete_work" href="">
      <input id ="work_id" type="hidden" value="<?php echo $work_id ?>"/>
      <i class="fa fa-plus" aria-hidden="true">
      </i>
    </a>
  </span>
</header>

I want to send $work_id to a PHP script that executes a MySQL query that deletes this record in the database. It has to be a POST request, and as it is an inline element I can't use a form. So AJAX is the way. This is my try:

$( document ).ready(function() {
  $("#delete_work").click(function () {
    $.ajax({
      url: 'scripts/script-delete-work.php',
      type: 'POST',
      data: $('#work_id').val(),
    });
  });
});

For now script-delete-work.php don't worry me, so is as simple as:

$edition_id = $_POST['work_id'];
echo $work_id;

But this setup doesn't work. I know that it is the simplest form of an AJAX, but I can't figure how to send the data or what is failing. Any help?

Thanks!

EDIT -- Ok, I solved the data thing. What I have now is:

HTML

<span class="span_edit_right">
  <a id="delete_work" href="">
    <input id="work_id" type="hidden" value="<?php echo $work_id; ?>"/>
        <i class="fa fa-trash-o" aria-hidden="true">
        </i>
  </a>
</span>

Script:

$( document ).ready(function() {
  $("#delete_work").click(function () {
    var val = $('#work_id').val();
    $.ajax({
      url: 'scripts/script-delete-work.php',
      type: 'POST',
      data: { "work_id" : val },
      success: function ()
      {
        alert("works!");
      }
    });
  });
});

PHP

<?php echo $_POST['work_id'];

When I click on #delete_work it returns the alert "works", and reload the page, but doesn't show the page with <?php echo $_POST['work_id'];.

• javascript
• php
• jquery
• ajax

Share Improve this question Follow edited Jul 29, 2017 at 12:41 asked Jul 29, 2017 at 11:44 user7499416user7499416 3

• Check the answer below please. Might be helpful. – Kamran Jabbar Commented Jul 29, 2017 at 11:49
• Try data: {work_id: $('#work_id').val()} and get $_POST['work_id'] in php script. – Ivan Bolnikh Commented Jul 29, 2017 at 11:49
• add tihs alert(val); after var val = $('#work_id').val(); , findout variable has value or not. – Asif Thebepotra Commented Jul 29, 2017 at 12:51

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 2

Use this code please

$( document ).ready(function() {
  $("#delete_work").click(function () {
    var val = $('#work_id').val();
    $.ajax({
      url: 'scripts/script-delete-work.php',
      type: 'POST',
      data: { "work_id" : val },
      success: function () 
      {

      }

    });
  });
});

And on your server side just

echo $_POST['work_id'];

Solved!

The problem is apparently that with AJAX you are not going to be sent to another PHP page, so I couldn't see the echo $_POST['work_id'];. But now it works, it was the data problem…

Actual code is:

<span class="span_edit_right">
    <a id="delete_work" href="">
        <input id="work_id" type="hidden" value="<?php echo $work_id; ?>"/>
        <i class="fa fa-trash-o" aria-hidden="true">
        </i>
    </a>
</span>

Script:

$( document ).ready(function() {
  $("#delete_work").click(function () {
    var val = $('#work_id').val();
    $.ajax({
      url: 'scripts/script-delete-work.php',
      type: 'POST',
      data: { "work_id" : val },
      success: function ()
      {
        alert("works!");
      }
    });
  });
});

Thanks!

use the ajax success function. and return $edition_id instead of work_id

success: function(work_id)

It's just that you don't get the value of the checked box.

You forgot ; in value="<?php echo $work_id; ?>".

You are not sending data correctly. You should pass data in javascript object form i.e {'parameter_name':parameter_value} so below is the code.

$( document ).ready(function() {
  $("#delete_work").click(function () {
    var wrkId = $('#work_id').val();
    $.ajax({
      url: 'scripts/script-delete-work.php',
      type: 'POST',
      data: {'work_id':wrkId},
    });
  });
});

Or

 $( document ).ready(function() {
  $("#delete_work").click(function () {
    var wrkId = $('#work_id').val();
    $.post('scripts/script-delete-work.php',{'work_id':wrkId},function(response){
    console.log(response);
    });
  });
});

本文标签： javascriptRun php script with AJAX and POSTStack Overflow