无法在我的php页面中修复未定义的索引

I am trying to access the token from my html page having input element having the token when i run this page on server (wamp) in windows 7. I am getting an error as undefined index on the "api_key" . How do i fix it ? php code:

  <?php
    $Cname=$_POST['api_key'];
    if($Cname=="To-do")
    {
    $api_key=$_POST['api_key'];
    $file1="i have some url here not mentioning it for valid reason".$api_key;
    $data = file_get_contents($file1);
    $json_o=json_decode($data);
    echo "<pre>";
    print_r($json_o);
    echo "</pre>";
    }
    ?>

//html page:
//script is within head
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js "></script>
<script type="text/javascript">
$(document).ready(function() {
      $("#postJson").click(function(event){
          $.post( 
             "get_task_by_column.php",{hidden:$('#api_key').val()},
             function(data) {
            $('#response').html(data);

             }

          );
      });
});

</script>
//body starts
<div>
    <form>  
    <input type="hidden" name="api_key" value="024b427a5d41a62edd218bddb55ed1fc" id="api_key" >
    <input type="text" id="txthtml">
    <input type="button" value="Get tasks by column name" id="postJson"/>

    </div>

    <div id='response'></div>

    </form>

Change these

$Cname=$_POST['api_key'];
$api_key=$_POST['api_key'];

to these

$Cname=isset($_POST['api_key'])?$_POST['api_key']:null;
$api_key=isset($_POST['api_key'])?$_POST['api_key']:null;

and in js part

"get_task_by_column.php",{hidden:$('#api_key').val()},

to

 "get_task_by_column.php",{api_key:$('#api_key').val()},

Use isset()

<?php
    $Cname=isset($_POST['api_key']) ? $_POST['api_key'] : '';
    if($Cname=="To-do")
    {
    $api_key=$_POST['api_key'];
    $file1="i have some url here not mentioning it for valid reason".$api_key;
    $data = file_get_contents($file1);
    $json_o=json_decode($data);
    echo "<pre>";
    print_r($json_o);
    echo "</pre>";
    }
    ?>

The index in the $_POST is hidden, if you want api_key, then change

{hidden:$('#api_key').val()}

to

{api_key:$('#api_key').val()}

The value you are posting will be $_POST['hidden'] as that is what you are defining it as in your jQuery

If you want it to be api_key

Change it to

api_key: $('#api_key').val()

Your are accessing $_POST['api_key'] before post api_value

<?php
$Cname ="";
if(isset($_POST['api_key']))
{
    $Cname=$_POST['api_key'];
 }
    if($Cname=="To-do")
    {
    $api_key=$_POST['api_key'];
    $file1="i have some url here not mentioning it for valid reason".$api_key;
    $data = file_get_contents($file1);
    $json_o=json_decode($data);
    echo "<pre>";
    print_r($json_o);
    echo "</pre>";
    }
    ?>

//html page:
//script is within head
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js "></script>
<script type="text/javascript">
$(document).ready(function() {
      $("#postJson").click(function(event){
          $.post( 
             "get_task_by_column.php",{hidden:$('#api_key').val()},
             function(data) {
            $('#response').html(data);

             }

          );
      });
});

</script>
//body starts
<div>
    <form action="index.php" method="post">   
    <input type="hidden" name="api_key" value="024b427a5d41a62edd218bddb55ed1fc" id="api_key" >
    <input type="text" id="txthtml">
    <input type="submit" value="Get tasks by column name" id="postJson"/>

    </div>

    <div id='response'></div>

</form>

Try this one

<?php

    $Cname = false;
    if(isset($_POST['api_key'])){
        $Cname=true;
    }

    if(isset($_POST['toDo']) && $_POST['toDo'] == "To-do" && $Cname){
        $api_key=$_POST['api_key'];
        $file1="i have some url here not mentioning it for valid reason".$api_key;
        $data = file_get_contents($file1);
        $json_o=json_decode($data);
        echo "<pre>";
        print_r($json_o);
        echo "</pre>";
    }
?>

//html page:
//script is within head
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js "> </script>
<script type="text/javascript">
    $(document).ready(function() {
       $("#postJson").click(function(event){
          $.post("get_task_by_column.php",{api_key:$('#api_key').val(), toDo:1}, function(data) {$('#response').html(data);});
      });
    });
</script>
//body starts
<div>
    <form action="index.php" method="post">   
        <input type="hidden" name="api_key" value="024b427a5d41a62edd218bddb55ed1fc" id="api_key" >
        <input type="text" id="txthtml">
        <input type="submit" value="Get tasks by column name" id="postJson"/>
    </form>
</div>
<div id='response'></div>