MySQL & PHP References: ajax

Showing posts with label ajax. Show all posts

Friday, August 7, 2020

AJAX JSON response from PHP MySQL rows to html table

After lots of banging head and stackoverflow here is how to displaly AJAX JSON response from PHP MySQL to html table for your referenses

RESPONSE.PHP ---- get user query json response from PHP MySQL

<?php include('config.php');
	$rno = $_POST["yno"];
//$rno = '215412141';
	$mst = mysqli_query($con,'select * from usermst where uno="' . $rno . '"');

    $rst = mysqli_fetch_assoc($mst);

    $ucode = $rst["ucode"];

  $result = mysqli_query($con,'select uno,ucode,uref,uname,uphone,uemail from usermst where uref="' . $ucode . '"');

$rows = array();

while($r = mysqli_fetch_assoc($result)){
    $rows[] = array('data' => $r);
}

echo json_encode($rows); 
?>

AJAX Response Data Retrival Page

<script>
  $( function() {
    var availableTags = [
    <?php $ukd = mysqli_query($con,'select uname,uno,ucode from usermst order by uno ASC') or die('usermst retrival error : ' . mysqli_error($con));
    while($kref = mysqli_fetch_assoc($ukd)){ ?>
      "<?php echo $kref['uno'] . ' - ' . $kref['uname']; ?>",
  <?php } ?>
    ];
    $( "#uref" ).autocomplete({
      source: availableTags
    });
  } );
  

  function getRef(){
  	var xtr = document.getElementById("uref").value;
  	var xref = xtr.split(" - ");

	   	$.ajax({
        url: 'getref.php',
        type: 'post',
        data: {yno:xref[0]},
	   // crossDomain: true,
        dataType: 'JSON',
        success: function(response){

    	console.log(response);

        var len = response.length;

        if(len == null){
            for(var i=0; i<len; i++){
                var id = response[i].data.uno;
                var icode = response[i].data.ucode;
                var name = response[i].data.uname;
                

                var tr_str = "<tr>" +
                    "<td align='center'>" + (i+1) + "</td>" +
                    "<td align='center'>" + id + "</td>" +
                    "<td align='center'>" + icode + "</td>" +
                    "<td align='center'>" + name + "</td>" +
                    "</tr>";

                $("#records_table tbody").append(tr_str);
            }
        } else {
        	$('#records_table tbody').after('<tr><td colspan="4">No Records Found</td></tr>');
        }

        }
    });
 }

  </script>

Wednesday, December 27, 2017

Multiple Links - AJAX load Page in DIV PHP

Check this for simply load dynamic php content into a DIV using AJAX

<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Include</title>
    </head>
    <body>
        <a href="#link1">Link1</a>
        <a href="#link2">Link2</a>
        <a href="#link3">Link3</a>
        <a href="#link4">Link4</a>


        <div id="include"></div>

        <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
        <script type="text/javascript"> 
            var includeDiv = $("#include");
            $(window).on('hashchange', function() {
                var href = location.hash.slice(1) +".html";
                includeDiv.load('include/' + href);
            });
        </script> 
    </body>
</html>

Thursday, March 9, 2017

Password & Confirm Password AJAX Javascript - Solved

Simple AJAX...


<form>
<input type="password" name="pxwd" id="pxwd" maxlength="10" />
<input type="password" name="rtpwd" id="rtpwd" maxlength="10" />
<div id="divCheckPasswordMatch" style="color:red;"></div>
</form>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script> 
     $('#rtpwd').on('keyup', function () { 
       if ($(this).val() == $('#pxwd').val()) { 
           $('#divCheckPasswordMatch').html('matching').css('color', 'green'); 
       } else $('#divCheckPasswordMatch').html('not matching').css('color', 'red'); 
     }); 
</script>

Tuesday, February 28, 2017

jQuery Ajax - Checkbox Load / Unload - External Page into DIV

Simple Bro / Sissy...

<input type="checkbox" name="rtrip" id="rtrip"> Need A Return-Trip?

<script>
$('#rtrip').click(function() {
    if($("#rtrip").checked){
  $("#rxtrip1").load("p2p-rtrip.php");
 } else {
  $("#rxtrip1").empty();
 }
});
</script>

Our New Delivery : NJ Metro Limo

Wednesday, January 18, 2017

Google Ajax Library & jQuery library conflict

Many a times we use Google Ajax jQuery Libraries for specific components

and

All the time jQuery proprietary CDN

Conflict is EXPECTED ALWAYS

How to Solve???>
1st in section place Google Ajax jQuery Libraries CDN & Call in Scripts (like Datepicker or any scripts)
Remember to Encapsule your codes with well formed jQuery.noConflict();

<script>
jQuery.noConflict();
(function( $ ) {
  $(function() {
     $('#csdate').datetimepicker({
 timepicker:false,
 format:'m/d/Y'
   });
  });
})(jQuery);
</script>

Just Before tag Place your All you jQuery libraries
Hope that helps you. Cheers!!!

Ajax Checkbox Load External Page

It is pretty simple to load external page in a div element on click checkbox

Do It yourself

<!DOCTYPE html>
<html>
   <head>
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

     
   </head>
   <body>
      
<input type="checkbox" id="isAgeSelected"/> Return Trip
<div id="txtAge" style="display:none"></div>


<script type="text/javascript">

$('#isAgeSelected').click(function() {
    $("#txtAge").toggle(this.checked);
 $("#txtAge").load("rtrip.php");
});
 </script>
   </body>
</html>

Wednesday, August 3, 2011

Ajax Triple Dropdown with States Cities Database

Ajax Dropdown Menu it's make easy for user to use interface. When you choose first dropdown menu data in second dropdown will be filter and data related in first dropdown will be show automatic

For This Example Code is PHP and Database is MySQL

Dropdown Updater Script

Friday, June 18, 2010

jQuery - Ajax Image Uploader

jQuery - Ajax Image Uploader

How do you upload images now? You select a file and click upload. Simple, right? Except that once you select your image, you can no longer see what was selected. The name of the file is at the end of the input field, and if the input field is short or the file path is deep, you won’t see anything useful. You’ll forget what you selected and have no idea what you’re about to upload.

MySQL & PHP References

Search This Blog