CODEWITHSUNDEEP
javascriptphpjqueryhtml
Rai
Rai

Reputation: 1

Send a POST request in jQuery when a div is clicked

I am having trouble figuring out how to get the following done.

I've searched quite a bit and tried using some of the solutions proposed but it failed.

Here's my folder structure:

+ html
    - index.html
+ js
    - eventhandling.js
+ php
    - test.php

HTML

<div class="channel" id="channel1">
    <p class="title">CHANNEL 01</p>
    <p class="stb_sub_menu" id="model">STB Model</p>
    <p class="network_sub_menu" id="network">Network</p>
    <p class="smartcard_sub_menu" id="smartcard">Smartcard</p>
    <p id="reboots">Reboots</p>
</div>
<p id="demodata">Demo Data</p>

PHP

<?php echo "PHP script -> You called master?"; ?>

JS

$(".channel").click(function(){
    /*alert(I am clicked");*/
    $.post('test.php', {name: 'John'}, function(data) {
        $("#demodata").val("data");
    });
});

The click event is successful because the alert pops up. Nothing shows on the Firebug console window.

Upvotes: 0

Views: 1131

Answers (2)

Arpit Jain
Arpit Jain

Reputation: 455

Might be the service URL you passed into post is wrong (according to the folder structure). The code must be like this.

$(".channel").click(function(){
    var postData = {"name":"john"};
    $.ajax({
        type: "POST",
        url: '../php/test.php',
        data: postData ,
        contentType: "application/json",
        dataType: "json", 
        processdata: true,
        success: function (response) {

        },
        error: function(error){
        }
      });
   });

This will work for you.

Upvotes: 1

Marek
Marek

Reputation: 7433

$(".channel").click(function(){
    /*alert(I am clicked");*/
    $.post('test.php', {name: 'John'}, function(data) {
        $("#demodata").text(data);
    });
});

Upvotes: 0

Related Questions