jquery - unable to fix undefined index in my php page -

i trying access token html page having input element having token when run page on server (wamp) in windows 7. getting error undefined index on "api_key" . how fix ? php code:

  <?php     $cname=$_post['api_key'];     if($cname=="to-do")     {     $api_key=$_post['api_key'];     $file1="i have url here not mentioning 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 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 column name" id="postjson"/>      </div>      <div id='response'></div>      </form> 

the index in $_post hidden, if want api_key, change

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

to

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