DEV Community

loading...

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

John Ellee Robado
I am a person that has passion in coding Web Design & Development, Programming
Updated on ・1 min read

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

Discussion (0)

Forem Open with the Forem app