Ajax post request to get data in json encoding

[eburlea]

Hi all.

I have 2 pages:

1. that provides data from mysql in json encoding if a correct "key" is provided, in my case the "key" sent by method post should be "1".
   Link: http://semaffiliate.local/public/api/getemployees
   Code in Zend:

   public function getemployeesAction()
   {
       $key = $this->getRequest()->getPost('key');
       if (isset($key)) {
           if ($key == 1) {
               $employeeModel = new Application_Model_DbTable_Employee();
               $employees = $employeeModel->fetchAll()->toArray();
               $res = array('status' => 'Success', 'settings' => $employees);
           } else {
               $res = array('status' => 'Error', 'message' => 'Access denied, invalid key supplied.');
           }
       } else {
           $res = array('status' => 'Error', 'message' => 'Access denied, you must supply a key.');
       }
           $json = Zend_Json_Encoder::encode($res);
           header('Content-Type: application/json; charset=utf-8');
           print Zend_Json::prettyPrint($json);
   }
   

2. that has a form, a div where the result should come and an ajax request.
   Link: http://soccerstatistics.local/public/api/index2
   Code:

      <form id="myform" action="#">
       <input id="mytext" type="text" name="key" size="10" placeholder="Type the key here..." />
       <input id="mysubmit" type="submit" value="OK" />
       </form>
   
   
   
   <div id="mydata"></div>
   
   <script type="text/javascript">
   $(document).ready(function(){
       $('#myform').submit(function(){
           var postData = "key=" + $('#mytext').value();
           $.ajax({
               type: "POST",
               url: "http://semaffiliate.local/public/api/getemployees",
               data: postData,
               success: function(data) {
                   $('#mydata').html(data);
               },
               error: function() {
                   alert('Error');
               }
           });
       });
   })
   </script>
   

After I submit the form, the link becomes: http://soccerstatistics.local/public/api/index2?key=1# and nothing is returned.

Please advise what can be the problem. Thanks.

[eburlea]

NOTE!

It is working if I replace:

<form id="myform" action="#">

with:

<form id="myform" action="http://semaffiliate.local/public/api/getemployees" method="post">

The problem is that the result I get on the other page, but I need it in the same page as the form.

[pritaeas]

Likely the action is executed after the submit function ends (because you are using a submit type button). You should be able to prevent it if you use return false; as last statement in the submit function.

[eburlea]

The main problem is that it is not possible to send values by POST method directly to another domain (it would be possible through a php file).

In case the domain would be the same, it would be necessary to add "return false;" as last statement in the submit function - as stated by pritaeas in the post above, and also ".value();" from line 13 need to change to ".val();".