DEV Community

John Ellee Robado
John Ellee Robado

Posted on • Updated on

Drop Down List Category(Daily, Weekly, Yearly) with search box using HTML, jQuery and PHP

Drop Down List Category(Daily, Weekly, Yearly) with search box using jQuery with PHP

So today, I will teach you how you do it

HTML, first you create a drop down list and two textbox


Daily
Weekly
Monthly
Search (Slow Search)

To

jQuery code

$(document).ready(function(){
$(".category").change(function(){
if($(".category option:selected").val()=="4"){
$(".date1").fadeIn();
$(".label_to").fadeIn();
$(".date2").fadeIn();
}
else{
$(".date1").fadeOut();
$(".label_to").fadeOut();
$(".date2").fadeOut();

}
});
)};

PHP Code

<?php
//Declare variable
$date1;
$date2;

//Set Timezone
date_default_timezone_set("America/New_York");
//Daily
if($_POST['category']==1){
$date1=date("Y-m-d");
$date2=date("Y-m-d");
}
//Weekly
if($_POST['category']==2){
$days=array("Monday"=>0,"Tuesday"=>1,"Wednesday"=>2,"Thursday"=>3,"Friday"=>4);
foreach ($days as $key => $value) {
if(date("l")==$key){
$date1=date("Y-m-d",strtotime("-".$value."days"));
$date2=date("Y-m-d",strtotime("+".(4-$value)."days"));
}
}
}
//Monthly
if($_POST['category']==3){
$date1=date("Y-m-1");
$date2=date("Y-m-t");
}
//Yearly
if ($_POST['category']==4) {
$date1=date('Y-01-01');
$date2=date('Y-12-31');
}
//Search
if($_POST['category']==5){
$date1=date("Y-m-d",strtotime($_POST['date1']));
$date2=date("Y-m-d",strtotime($_POST['date2']));
}
?>

Note: You must include this jquery library

Top comments (0)