javascript - How to call multiple functions using AJAX

291

In this code I am using AJAX. I want to append the values in atd. I already append the values for one column and after that I want to append the values of secondtd. I don't know how to do this. See below my code what is my requirement i mentioned below my code. Insteed ofhtmlString += '<td>' + 'castename' + '</td>'; I want call the functioncastename().

$(document).ready(function(){
        $("#reservation").on("change", function() {
           var reservation = $(this).val();
              $.ajax({
                  type: 'post',
                  url: 'date-range.php',
                  data: {
                      logindate: reservation,
                  },
                  async : false,
                 success: function(data) {
                  var res = jQuery.parseJSON(data); // convert the json
                  console.log(res);
                  if (res['status'] == "success") {
                    $('#datatable-editable > tbody').empty();//emtpy tbody at the begining
                    $.each(res['data'], function(key, value) {
                      var htmlString = ''; //Place declaration inside each
                      htmlString += '<tr>';
                      var ssm_id = value.ssm_id; // here i got ssmid
                      htmlString += '<td>' + value.ssm_id + '</td>';

                      $.ajax({
                        type: 'post',
                        url: 'config/functions.php',
                        data: {
                          'ssm_id': ssm_id,
                         /* 'caste':ssm_id,
                          'reg_date':ssm_id,
                          'status':ssm_id,
                          'source':ssm_id*/
                        },
                        async : false,
                        success: function(fname) {
                          htmlString += '<td>' + fname + '</td>'; 
                          htmlString += '</tr>';
                          $('#datatable-editable > tbody').append(htmlString);
                        }
                      });


                      $.ajax({
                        type: 'post',
                        url: 'config/functions.php',
                        data: {
                          'caste': ssm_id,

                        },
                        async: false,
                        success: function(caste) {
                          htmlString += '<td>' + caste + '</td>'; 
                          htmlString += '</tr>';
                          $('#datatable-editable > tbody').append(htmlString);
                        }
                      });

                    });

                  }
                }
              });
            });
        });

mycode.php

<?php
    $ssm_id = $_POST['ssm_id'];
    $caste_name = $_POST['caste'];
    $reg_date = $_POST['reg_date'];

    if (!empty($ssm_id))
    {
        echo firstname($ssm_id);
    }

    if (!empty($caste_name)) {
        echo castename($caste_name);
    }

    if (!empty($reg_date)) {
        echo regdate($reg_date);
    }

    function firstname($id)
    {
        $f = "SELECT firstname FROM register WHERE matri_id='$id'";
        $rr = mysql_query($f);
        while ($row=mysql_fetch_array($rr))
        {
            $firstname = $row['firstname'];
        }
        return $firstname;
    }

    unction castename($id)
    {
        $f = "select caste_name from caste where caste_id='$id'";
        $rr = mysql_query($f);
        while ($row=mysql_fetch_array($rr))
        {
            $caste_name = $row['caste_name'];
        }
        return $caste_name;
    }

    function regdate($id)
    {
        $f = "SELECT reg_date FROM register WHERE matri_id='$id'";
        $rr = mysql_query($f);
        while ($row=mysql_fetch_array($rr))
        {
            $reg_date = $row['reg_date'];
        }
        return $reg_date;
    }
?>
619

Answer

Solution:

Seems your ajax request's success function are overlapped.

User Ajaxasync:false

For more information see click on this

Try this :-

$(document).ready(function() {
    $("#reservation").on("change", function() {
        var reservation = $(this).val();
        $.ajax({
            type: 'post',
            url: 'date-range.php',
            data: {
                logindate: reservation,
            },
            async: false,
            success: function(data) {
                var res = jQuery.parseJSON(data); // convert the json
                console.log(res);
                if (res['status'] == "success") {
                    $('#datatable-editable > tbody').empty(); //emtpy tbody at the begining
                    $.each(res['data'], function(key, value) {
                        var htmlString = ''; //Place declaration inside each
                        htmlString += '<tr>';
                        var ssm_id = value.ssm_id; // here i got ssmid
                        htmlString += '<td>' + value.ssm_id + '</td>';

                        $.ajax({
                            type: 'post',
                            url: 'config/functions.php',
                            data: {
                                'ssm_id': ssm_id,
                                /* 'caste':ssm_id,
                                 'reg_date':ssm_id,
                                 'status':ssm_id,
                                 'source':ssm_id*/
                            },
                            async: false,
                            success: function(fname) {
                                htmlString += '<td>' + fname + '</td>';                                                              
                            }
                        });


                        $.ajax({
                            type: 'post',
                            url: 'config/functions.php',
                            data: {
                                'caste': ssm_id,

                            },
                             async: false,
                            success: function(caste) {
                                htmlString += '<td>' + caste + '</td>';
                            }
                        });
                    htmlString += '</tr>';
                    $('#datatable-editable > tbody').append(htmlString);
                    });

                }
            }
        });
    });
});

People are also looking for solutions to the problem: Change key value by the given time in PHP

Source

Didn't find the answer?

Our community is visited by hundreds of web development professionals every day. Ask your question and get a quick answer for free.

Ask a Question

Write quick answer

Do you know the answer to this question? Write a quick response to it. With your help, we will make our community stronger.

Similar questions

Find the answer in similar questions on our website.