Sending php generated form data via Ajax from Dialog box

Question

Hi Guys any help on this? I have a dialog box triggered by a button click that calls my php script to generate a form which needs to be filled and submitted. I want to do the sending and conformation via Ajax. I have been recoding and researching for a few days but nothing on StackExchange or other websites help me with it. Here's the code:

Dialog box snippet;

$k('#CreateTable').click(function(e){
          e.preventDefault();
         var Call =  $k('#CreateTable').attr('value');//.attr('id');

         var util = $k(this).attr('id');//.attr('id');

         $k('#dialog').dialog({
             autoOpen: false,
            title: 'Running Utility for: '+Call,
            modal: true,
            width: 450,
            close: function(event, ui) {
             $k("#dialog").dialog('destroy');//event.target
            }//END CLOSE

        }).dialog('open');
        var utility = { 'utility' : util };
        $k.ajax({
                  type: "post",
                  url: "inc/runUtilities.php",
                  dataType: "html",
                  data: utility,
                  success: function(data) {
                        $k('#DlgTxt').html(data).fadeIn('slow');
                  }
        });
            //return false;
        });//END DIALOG

The PHP snippet;

$show .=  "<form id='cContact' name='cContact' method='post'>";
    // action='".$_SERVER['REQUEST_URI']."'
    $show .= '<table align="center" width="425" border="0">
       ';

        $query = "SHOW COLUMNS FROM `".$_SESSION['WorkTable']."`"; 
        if($output = mysqli_query($this->MySQLCxn->MySQLCxn, $query))
        {
            $columns = array();
            while($row = mysqli_fetch_assoc($output))
            {
                if($row['Field'] == 'id') {}
                else
               $show .= '
                <tr>
                  <td width="175"><div align="right">'.@$row['Field'].':</div></td>
                  <td width="155">
                    <input type="text" name="'.@$row['Field'].'" placeholder="'.@$row['Field'].'" />
                  </td>
                  <td width="115">&nbsp;</td>
                </tr>
                ';
            }
        }


    $show .= '
        <tr>
          <td>Submit </td><td>

          <button type="button" id="cContactSbmt" onclick="doSubmitForm(this); return false;" name="cContactSbmt" value="cContactSbmt">Create contact</button>


          <!-- <input type="submit" class="button" value="Save" name="submit"> -->
          </td> <td>&nbsp;</td>
        </tr>
      </table></form>
      <div id="thanks">

      </div>
       ';

And the JQuery that i am currently using trying to have it call my php to process the form being sent.

var $j = jQuery.noConflict(); 

(function($j){
 $j(document).ready(function() {
    $j("#cContactSbmt").click(function(e){//'click',
         e.preventDefault();
             alert('cContactSbmt clicked...');
         $j.ajax ({
          type:"POST",
          url:"inc/runUtilities.php",
          data: $j(this).serialize(),
          success: function(msg){
            $j("#thanks").html(msg)
            $j(this).modal('hide');
          },
          error: function(){
            alert("failure");
          }
        });
      });


});

})($j);

For some reason its not working nothing showing up in the console as well. again: i have a dialog box that gets populated via Ajax with a php generated from that needs to get submitted to another php script that is to process it and reply to the dialogs. Any suggestions?

low_rents · Accepted Answer · 2015-01-22 12:56:55Z

2

your php ist not outputting ("echoing") anything. you need to echo whatever you want to return to your ajax-call.

update: plus for debugging try to log the returned data in every success callback, for example:

success: function(data) {
    console.log(data);
}

edited Jan 22, 2015 at 12:56

answered Jan 22, 2015 at 12:49

low_rents

4,4813 gold badges30 silver badges55 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

1 Comment

Geraldo Isaaks Over a year ago

Guys i have spent about 2 days just on this code please have a good look at it - i'm only about a year with JQuery so i may be missing some. as to the php code - echoing - the code is a snippet from a class that does quite a lot so i left out the other code...

Geraldo Isaaks · Accepted Answer · 2015-01-23 14:48:31Z

Hi Guys so I got it working with the following changes: On the form;

<button id="cContactSbmt" onClick="doContactsCreate(\'#cContact\')" type="button" class="form-submit"  name="cContactSbmt" value="cContactSbmt">Create contact</button>

I added the onclick method with a callback to a function doContactsCreate(\'#cContact\'), which has the id of the form passed to it.

function doContactsCreate(obj)
{
     alert(obj+': cContactSbmt clicked...');
    /* */
    var frmData = $k(obj).serialize();
         $k.ajax ({
          type:"POST",
          url:"inc/runUtilities.php",
          data: frmData,
          success: function(data){
          $k("#thanks").html(data);
          console.log(data);
            $k(obj).modal('hide');
          },
          error: function(){
            alert("failure");
          }
        });

}

I've just enclosed the JQuery code in this function definition and placed it outside the

(function($k){
 $k(document).ready(function() {
//rest of JQuery code
})($k);

Don't know why but i think that was the main problem

Collectives™ on Stack Overflow

Sending php generated form data via Ajax from Dialog box

3 Answers 3

6 Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

6 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related