Tips for transferring the anchor value using jQuery AJAX to PHP

I have been attempting to use jQuery to send the values of a couple of anchors to a PHP file, but I am not receiving any callback from the PHP script.

<div class="result"></div>

<a href="#" value="5" class="star">Star 5</a>
<a href="#" value="4" class="star">Star 4</a>
<a href="#" value="3" class="star">Star 3</a>
<a href="#" value="2" class="star">Star 2</a>
<a href="#" value="1" class="star">Star 1</a>

Here is the jQuery code:

$('a').on('click', function(e) {
    e.preventDefault();

    var star = $(this).attr('value'); 

    $.ajax({
        url: 'process.php',
        type: 'POST',
        data: { star: star },

        success: function(data){
            $('.result').html(data);                        
        }       
    });
});

And this is the PHP code (process.php):

if (isset($_POST['star'])) {        
    $star = $_POST['star'];
    echo $star;
}

What could be causing this issue?

My objective is to click on "Star 5" and receive the value "5" back. Click on "Star 4" and get the value "4" back, and so forth...

Answer №1

value is not a valid attribute for <a> tags. Refer to this link for the list of available attributes.

I suggest using the following HTML code:

<div class="result"></div>

<a href="#" data-value="5" class="star">Star 5</a>
<a href="#" data-value="4" class="star">Star 4</a>
<a href="#" data-value="3" class="star">Star 3</a>
<a href="#" data-value="2" class="star">Star 2</a>
<a href="#" data-value="1" class="star">Star 1</a>

<script>
$('a').on('click', function(e) {
    e.preventDefault();

    var star = $(this).data('value');

    $.ajax({
        url: 'process.php',
        type: 'POST',
        data: {star:star},
        success: function(data){
            $('.result').html(data);                        
        }       
    });
});
</script>

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

How can I extract nodes with the content type "application/xml" from an XML document using PHP?

I received an XML file (created from SharePoint) that is displayed as follows (in the browser): Example of XML File <?xml version="1.0" encoding="utf-8"?> <feed xml:base="https://www.example.com/_api/" xmlns="http://www.w3.org/2005/Atom" xmlns:d ...

Tips for updating the content of a div with fresh data using a slideshow effect in jQuery

Imagine you have a div called A and an array filled with text data. When t=0, div A will display $data[0]. Then, after every n seconds, I want the div to show the next piece of data in the array. I am interested in creating a transition effect similar to ...

The functionality of a radio button triggering a form submission to different pages is experiencing issues with Firefox

This piece of code is designed to submit a form when a radio button is clicked, and depending on which radio button is selected, the form action should change. While this code works fine in Chrome and Opera, it doesn't seem to function properly in Fir ...

The chain assignment of variables within a PHP class is not functioning properly

Trying something new can sometimes result in unexpected issues. While experimenting with chain assignment for the first time, I encountered a problem. Here is the code snippet: class test { private $col1 = $col2 = $col3 = $col4 = ""; } As a result, ...

Problem with Dynamic JqGrid: Paging feature not functioning as expected

I am facing a requirement to populate a grid dynamically based on the selected view. I have referred to the following resources for guidance on populating the grid dynamically. Link to Code Review Problem with jqGrid Dynamic Column Binding This approach ...

In PHP and MySQL, the GROUP BY clause does not function properly with datetime data types

I have a variety of datetimes stored in my MySQL database, listed as follows: 2016-11-15 10:00:00 2016-11-16 10:00:00 2016-11-17 10:00:00 2016-11-17 12:00:00 2016-11-17 19:30:00 2016-11-20 10:00:00 2016-12-15 10:00:00 2017-11-15 10:22:00 I need to displa ...

Determine the precise quantity of kids using jQuery

When attempting to determine the exact number of child elements and then apply a specific class to another element with a matching class, keep in mind that it may not be the immediate parent element where this action needs to be executed. $(".test").eac ...

Identifying the JS Tree nodes that have been repositioned via drag-and-drop

I'm working with a JS Tree structure that includes drag and drop functionality. Here's the basic code I have so far: $('#using_html_1').jstree({ "core": { "check_callback":true }, "plugins" : ["dn ...

Exploring the combination of PHP programming and ethical hacking techniques

Despite being well-versed in security concerns such as SQL injection, XSS issues, SSL, and session hijacking, I still can't shake the feeling that a skilled hacker is laughing at my efforts. How can I proactively test and improve the security of my we ...

Can one ascertain the cleared Kendo grid column filter using jQuery?

I am working with a kendo grid that has approximately 10 to 12 columns, each with its own filtering option. My current task requires me to identify when a column filter is cleared and determine which specific column triggered the event. Is there an event w ...

Using DIV to "enclose" all the elements inside

I need assistance with my HTML code. Here is what I have: <div id="cover" on-tap="_overlayTapped" class$="{{status}}"> <form method="POST" action="/some/action"> <input required id="name" name="name" label="Your name"></input> ...

External variable accessing the getjson function

I have a question about optimizing the usage of the title variable within the getJSON function. Here's a sample code snippet that I'm working with: for (var x = 0; x < temp_addresses.length; x++) { var title = temp_addresses[x].title; ...

When attempting to send JSON data using Ajax, you may encounter an issue such as receiving an error message

I am currently working on developing a login with Facebook application using Codeigniter. My challenge is passing JSON data to my controller through AJAX. This is the code snippet I am using: var data = JSON.stringify(response); alert(data); $.ajax ...

Tips for including a Places Autocomplete box within an InfoWindow on Google Maps

I am currently working with the Google Maps Javascript API v3 and I am facing a challenge. I want to integrate a Places Autocomplete box inside an InfoWindow that pops up when a user clicks on a marker. I have successfully created an autocomplete object a ...

``There seems to be an issue decoding the JSON array

I am currently working on a PHP script to decode JSON data and insert the objects into my database. However, I am encountering an error: Fatal error: Cannot use object of type stdClass as array in phptest.php on line 21 $postdata = file_get_contents("php: ...

The options in the dropdown menu vanish when interacting with a jQuery feature that relies on

Recently, I have found AJAX, JSON, and jQuery to be indispensable tools in my coding endeavors. The application I am working on is a replacement for a flawed one, and it is coming along nicely. Despite making progress with the AJAX method, I have encounte ...

Show information on the following screen by utilizing ajax when the button is pressed

I need to implement functionality on my cshtml page, ListZoneRecords.cshtml, where clicking on a zone row should display its details on another page. I am looking to achieve this using ajax. //ListZoneRecords.cshtml <script> $('#btn_sbmt_details ...

Utilizing Laravel 5.2 to showcase a video

I am currently developing in Laravel 5.2 and facing an issue with displaying a video on my view page. While I can successfully store the video in my database table, I am encountering difficulties when trying to fetch and display it. In my database table, I ...

JavaScript and PHP open-source libraries for enabling voice chat functionality

Seeking assistance on incorporating voice-chat functionality into my website through PHP and JavaScript. Are there any open-source libraries available for this purpose? I am willing to utilize Flash if necessary, but limited to using only Flash, JavaScri ...

A guide on creating a Utility function that retrieves all elements in an array starting from the third element

I've been working on a tool to extract elements from an array starting after the first 2 elements. Although I attempted it this way, I keep getting undefined as the result. // ARRAYS var arr = ['one', 'two', 'three', &a ...