How to Create Dynamic Dependent Select Box

How to Create Dynamic Dependent select box using ajax

You need a dynamic dependent select box. We will explain how to create a dynamic dependent select box in PHP, jquery and ajax. index.php <?php include_once 'dbconfig.php'; ?> <html> <head> <title>Dynamic Dependent Select Box using Ajax</title> <script type="text/javascript" src="jquery-1.4.1.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $("#loding1").hide(); $("#loding2").hide(); $(".country").change(function() { $("#loding1").show(); var id=$(this).val(); var dataString = 'id='+ id; […]
Read Full Article
How to Create Animation using jQuery

How to Create Animation using jQuery

In this article, you will learn How to Create Animation using jQuery like hiding and show. Example:- <html> <head> <title>Animation in jQuery</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script> $(document).ready(function(){ $("button").click(function(){ var div = $("div"); div.animate({left: '250px'}, "slow"); div.animate({fontSize: '3em'}, "slow"); }); }); </script> </head> <body> <button>Click to Animation</button> <div style="background:red;color:#fff;height:200px;width:500px;position:absolute;">Welcome to Hub of Tutorials</div> </body> </html> Check on […]
Read Full Article
How to Add New HTML Content using jQuery

How to Add New HTML Content using jQuery

In this article, you will learn How to Add New HTML Content using jQuery. Four jQuery Methods for add new content. append() prepend() after() before() jQuery append() method <html> <head> <title>jQuery append() Method</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script> $(document).ready(function(){ $("#btn1").click(function(){ $("p").append(" <b>Appended text</b>."); }); $("#btn2").click(function(){ $("ol").append("<li>Appended item</li>"); }); }); </script> </head> <body> <p>paragraph.</p> <p>another paragraph.</p> <ol> <li>item 1</li> <li>item 2</li> <li>item […]
Read Full Article
How to Create Remove Element or Content using jQuery

How to Create Remove Element or Content using jQuery

In this article, You will Learn How to Create Remove Element or Content using jQuery jQuery remove() Method Example:- <html> <head> <title>jQuery remove()</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script> $(document).ready(function(){ $("button").click(function(){ $("#div1").remove(); }); }); </script> </head> <body> <div id="div1" style="height:100px;width:300px;border:1px solid black;background-color:red;color:#ffffff"> <p>Welcome to Hub of Tutorials</p> <p>jQuery remove Method.</p> </div> <br> <button>Remove div element</button> </body> </html> jQuery empty() […]
Read Full Article
How to Create jQuery CSS() Method

How to Create jQuery CSS Method

In this article, you will learn How to Create jQuery CSS Method. CSS is a cascading stylesheet so we will explain How to Create jQuery CSS() Method. Example:- <html> <head> <title>jQuery css() Method</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script> $(document).ready(function(){ $("button").click(function(){ $("p").css({"background-color": "yellow", "font-size": "200%"}); }); }); </script> </head> <body> <p style="background-color:#ffb100">Welcome to </p> <p style="background-color:#00ff00">Hub of Tutorials</p> <p […]
Read Full Article