1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Problem in (PHP, MySQL) AJAX Dropdown-checkbox

Discussion in 'PHP' started by abhi10kumar, Mar 11, 2013.

  1. #1
    I have dropdown down boxes with checkboxes; I'm using jguery to display Dropdown with checkboxes; I'm populating Select Locality with Select City dropdown. Now, when I select a city from dropdown It should display its locality in dropdown with checkboxes but showing localities in dropdown only.

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Paying Guests/PG/Hostels Accomodations for Students/Girls/Males/Professionals</title>
    <META name="description" content="Find Single/Sharing PG/Hostels Accommodation within budget for Boys, Men, Girls, Ladies, Women all over India." />
    <link rel="stylesheet" type="text/css" href="style.css" media="screen">
    <link href="css/pagination.css" rel="stylesheet" type="text/css" />
    <link href="css/A_red.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="divgetcity.js"></script>
    <style>
    form .outer-submit {
    margin : 0 auto;
    background:transparent url("images/search.png") no-repeat top left;
    }
    form input[type=submit] {
    border : none;
    background:transparent url("images/search.png") no-repeat top right;
    width:90px;
    height:29px;
    }
    </style>
    <script language="JavaScript1.2">
    function openwindow(pg_id)
    {
    window.open("view_album.php?pg_id="+pg_id,"mywindow","menubar=1,resizable=1,width=1000,height=800");
    }
    </script>
    <script>
    function limitText(limitField, limitCount, limitNum)
    {
    if (limitField.value.length > limitNum)
    { limitField.value = limitField.value.substring(0, limitNum);}
    else
    { limitCount.value = limitNum - limitField.value.length; }
    }
    function validate(theform)
    {
    if(theform.name.value=="")
    {
    alert('Please Enter Name');
    theform.name.focus();
    return false;
    }
    if(theform.email.value=="")
    {
    alert('Please Enter E Mail');
    theform.email.focus();
    return false;
    }
    if(theform.email.value.length>0)
    {
    if(theform.email.value.indexOf(" ") >= 0)
    {
    alert("Please enter your email-id without any white space character.");
    theform.email.focus();
    return (false);
    }
    if ( (theform.email.value.indexOf("@") == -1) || (theform.email.value.indexOf(".") == -1) )
    {
    alert("Please enter a valid email-id");
    theform.email.focus();
    return (false);
    }
    BeforeAtRate = theform.email.value.substring(0,theform.email.value.indexOf("@"));
    AfterAtRate = theform.email.value.substring(theform.email.value.indexOf("@")+1,theform.email.value.length);
    if (AfterAtRate.indexOf(".") == -1)
    {
    alert("Please enter a valid email-id");
    theform.email.focus();
    return (false);
    }
    middle = AfterAtRate.substring(0, AfterAtRate.indexOf("."));
    last = AfterAtRate.substring(AfterAtRate.indexOf(".") + 1,AfterAtRate.length);
    if (BeforeAtRate.length == 0 || middle.length == 0 || last.length == 0)
    {
    alert("Please enter a valid email-id");
    theform.email.focus();
    return (false);
    }
    }
    if(theform.contactno.value=="")
    {
    alert('Please Enter Contact Number');
    theform.contactno.focus();
    return false;
    }
    if(isNaN(theform.contactno.value))
    {
    alert('Please Enter Valid Contact Number; Only Digits');
    theform.contactno.focus();
    return false;
    }
    if(theform.city.value=="")
    {
    alert('Please Enter City');
    theform.city.focus();
    return false;
    }
    if(theform.locality.value=="")
    {
    alert('Please Enter Locality');
    theform.locality.focus();
    return false;
    }
    if(theform.from.value=="" && theform.to.value=="")
    {
    alert('Please Choose FROM and TO Price');
    theform.from.focus();
    return false;
    }
    if((theform.from.value > theform.to.value) || (theform.from.value == theform.to.value))
    {
    alert('Please Choose Valid Price Range');
    theform.from.focus();
    return false;
    }
    return true;
    }
    </script>
    <link rel="stylesheet" type="text/css" href="assets/jquery.multiselect.css" />
    <link rel="stylesheet" type="text/css" href="assets/style.css" />
    <link rel="stylesheet" type="text/css" href="assets/prettify.css" />
    <link rel="stylesheet" type="text/css" href="assets/jquery-ui.css" />
    <script type="text/javascript" src="assets/jquery.js"></script>
    <script type="text/javascript" src="assets/jquery-ui.min.js"></script>
    <script type="text/javascript" src="assets/prettify.js"></script>
    <script type="text/javascript" src="assets/jquery.multiselect.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
    $("#pgfor").multiselect({checkAllText:"All", uncheckAllText:"None", minWidth:"100", height:"50"});
    $("#city").multiselect({checkAllText:"All", uncheckAllText:"None", minWidth:"100", height:"150", multiple:false, header:false});
    $("#locality").multiselect({checkAllText:"All", uncheckAllText:"None", minWidth:"100", height:"150", header:false});
    $("#roomtype").multiselect({checkAllText:"All", uncheckAllText:"None", minWidth:"100", height:"50"});
    $("#pricetype").multiselect({checkAllText:"All", uncheckAllText:"None", minWidth:"100", height:"50"});
    $("#price_value").multiselect({checkAllText:"All", uncheckAllText:"None", minWidth:"130", height:"100"});
    });
    </script>
    </head>
    <link rel="stylesheet" type="text/css" href="src/common.min.css" media="screen">
    <link rel="stylesheet" type="text/css" href="src/destinations.min.css" media="screen">
    <link rel="stylesheet" type="text/css" href="src/destinationsdynamic.min.css" media="screen">
    <body style="background-image:url(images/bg123.jpg); background-repeat:repeat-x; background-attachment:fixed; background-color:#E9E9E9;">
    <div id="main_container">
    <div id="header">
    <style>
    .register
    { background:transparent url('images/register.png') no-repeat top; width: 90px; height: 29px; color:white; border:none; }
    .login
    { background:transparent url('images/register.png') no-repeat top; width: 90px; height: 29px; color:white; border:none; }
    </style>
    <table style="width:100%;">
    <tr>
    <td>
    <div id="logo">
    <a href="index.php"><img src="images/logo3.jpg" alt="" title="" border="0"></a>
    </div>
    </td>
    <td>
    <div align="right" style="padding-top:5px; font-size:11px; padding-right:10px;">
    <span style="padding-right:5px;"><strong>Welcome
    Guest ! </strong></span>
    <span style="padding-right:10px;">
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <style>
    .register
    { background:transparent url('images/register.png') no-repeat top; width: 90px; height: 29px; color:white; border:none; }
    .login
    { background:transparent url('images/register.png') no-repeat top; width: 90px; height: 29px; color:white; border:none; }
    </style>
    <script type="text/javascript">
    $(document).ready(function() {
    $("#login").click(function() {
    var action = $("#form1").attr('action');
    var form_data = {
    username: $("#username").val(),
    password: $("#password").val(),
    is_ajax: 1
    };
    $.ajax({
    type: "POST",
    url: action,
    data: form_data,
    success: function(response)
    {
    if(response == 'success')
    window.location='index.php';
    else
    $("#message").html("<p class='error'>Invalid username and/or password.</p>");
    }
    });
    return false;
    });
    /********************************/
    /* Forget E Mail */
    /*******************************/
    $("#forget").click(function() {
    var action = $("#form2").attr('action');
    var form_data = {
    forgetemail: $("#forgetemail").val(),
    is_ajax: 2
    };
    $.ajax({
    type: "POST",
    url: action,
    data: form_data,
    success: function(response)
    {
    if(response == 'success')
    {
    $("#message").html("<p class='error'>Link E Mail has been sent.</p>");
    $("#forgetemail").val('');
    }
    else
    $("#message").html("<p class='error'>Invalid E Mail.</p>");
    }
    });
    return false;
    });
    });
    </script>
    <html>
    <head>
    <title>LIGHTBOX EXAMPLE</title>
    <style>
    .black_overlay{
    display: none;
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    z-index:1001;
    -moz-opacity: 0.8;
    opacity:.80;
    filter: alpha(opacity=80);
    }
    .white_content {
    display: none;
    position: absolute;
    top: 25%;
    left: 25%;
    width: 50%;
    height: 40%;
    padding: 4px;
    border: 5px solid #999999;
    background-color: white;
    z-index:1002;
    overflow: auto;
    }
    </style>
    </head>
    <body>
    <a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">Login</a>
    <div id="light" class="white_content" align="left">
    <table width="100%;" cellpadding="0" cellspacing="0">
    <tr>
    <td width="95%" style="background-color:#7AC7FB; height:30px; color:#333333; padding-left:10px; font:bold 14px Arial" colspan="3">Sign-In</td>
    <td style="background-color:#7AC7FB;" align="right" width="3%" colspan="3"><a href = "javascript:void(0)" onclick ="document.getElementById('light').style.display='none';document.getElementById('fade')
    .style.display='none'">
    <img src="images/close.gif">
    </a></td>
    </tr>
    <tr>
    <td style="height:30px; border-right:1px #CCCCCC dashed; text-align:center; color:#0000FF; padding-top:5px">
    <div id="message" align="center" style="text-align:center"></div>
    </td>
    <td></td>
    </tr>
    <tr>
    <td style="padding-left:10px; border-right:1px #CCCCCC dashed; vertical-align:top" width="30%">
    <div id="">
    <form id="form1" name="form1" action="doLogin.php" method="post">
    <table>
    <tr>
    <td colspan="3" style="font:bold 14px Verdana; color:black; padding-bottom:10px">Login</td>
    </tr>
    <tr>
    <td style="font:normal 12px Verdana; vertical-align:top; padding-top:3px;">E Mail</td>
    <td style="padding:0 2px 0 2px; vertical-align:top; padding-top:3px;"></td>
    <td style="padding-bottom:5px;"><input type="text" name="username" id="username" style="width:120px;" /></td>
    </tr>
    <tr>
    <td style="font:normal 12px Verdana;">Password</td>
    <td style="padding:0 2px 0 2px;"></td>
    <td><input type="password" name="password" id="password" style="width:120px;" /></td>
    </tr>
    <tr>
    <td></td>
    <td></td>
    <td style="padding-top:10px;">
    <input type="submit" id="login" name="login" value="" style="background:transparent url('images/login.png') no-repeat top; width: 90px; height: 29px; color:white; border:none;" /></td>
    </tr>
    </table>
    </form>
    </div>
    <div id="" style="border-top: #CCCCCC dashed 1px; padding-top:8px;">
    <form id="form2" name="form2" action="doForget.php" method="post">
    <table>
    <tr>
    <td colspan="3" style="font:bold 14px Verdana; color:black; padding-bottom:10px; ">
    Forget Password
    </td>
    </tr>
    <tr>
    <td style="font:normal 12px Verdana; vertical-align:top; padding-top:2px;">E Mail</td>
    <td style="padding:0 2px 0 2px; vertical-align:top; padding-top:2px;"></td>
    <td style="padding-bottom:5px;">
    <input type="text" name="forgetemail" id="forgetemail" style="width:140px;" /></td>
    </tr>
    <tr>
    <td></td>
    <td></td>
    <td style="padding-top:10px;">
    <input type="submit" id="forget" name="forget" value="" style="background:transparent url('images/sendpassword.png') no-repeat top; width: 130px; height: 29px; color:white; border:none;" /></td>
    </tr>
    </table>
    </form>
    </div>
    </td>
    <td style="padding:10px;width:auto; vertical-align:top;">
    <table>
    <tr>
    <td colspan="2" style="padding-bottom:10px; color:#000000; font-size:14px; font-weight:bold;">
    Benefits of Registered User</td>
    </tr>
    <tr>
    <td style="padding-left:10px; padding-bottom:5px; font-size:12px;" valign="top">
    <div style="line-height:20px; padding-left:20px;">
    <ul>
    <li>Get accessed by over 1 Lakh buyers</li>
    <li>Showcase your property as Rental, PG or for Sale</li>
    <li>Get instant queries over Phone, Email and SMS</li>
    <li>Add detailed property information & multiple photos per listing</li>
    <li>Preference in search & Track queries & views online</li>
    </ul>
    </div>
    </td>
    </tr>
    <td style="padding-left:10px; padding-bottom:5px; font-size:12px;">
    <input type="button" value="" class="register" onClick="window.location='login-register.php'">
    </td>
    </table>
    </td>
    </tr>
    </table>
    </div>
    <div id="fade" class="black_overlay"></div>
    </body>
    </html> |
    <a href="login-register.php"> Register</a>
    </span><img src="images/phone1.png" style="padding-right:5px;" />
    <span style="padding-right:103px;">+91-11-25088735 | +91-11-65780120</span>
    </div>
    <div align="right" style="padding-top:5px; font-size:11px; padding-right:122px;">
    <img src="images/phone1.png" style="padding-right:10px;" />+91-9873448316 &nbsp;| +91-9999316331
    </div>
    <div align="right" style="padding-top:5px; font-size:11px; padding-right:182px;">
    <img src="images/email_contact.png" style="padding-right:10px;" />
    </div>
    <div align="right" style="padding-top:5px; font-size:11px; padding-top:10px; padding-right:100px;">
    <img src="images/fb.jpg" style="padding-right:10px;" />
    <img src="images/tw.jpg" style="padding-right:10px;" />
    <img src="images/g+.jpg" style="padding-right:10px;" />
    </div>
    </td>
    </tr>
    </table>
    <div style="text-align:center; padding-bottom:3px;"><a href="book-pg-at-rs-199.php"><img border="none" src="images/strip2.gif" /></a></div> </div>
    <div id="menu">
    <link href="megamenu.css" rel="stylesheet" type="text/css" />
    <script type='text/javascript' src='src/jquery.hoverIntent.minified.js'></script>
    <script type='text/javascript' src='src/jquery.dcmegamenu.1.2.js'></script>
    <script type="text/javascript">
    $(document).ready(function($){
    $('#mega-menu-tut').dcMegaMenu({
    rowItems: '3',
    speed: 'fast'
    });
    });
    </script>
    </head>
    <body>
    <div class="dcjq-mega-menu">
    <ul id="mega-menu-tut" class="menu">
    <li><a href="pg-hostels-in-ahmedabad.php">Ahemdabad</a></li>
    <li><a href="pg-hostels-in-bangalore.php">Bangalore</a></li>
    <li><a href="pg-hostels-in-chennai.php">Chennai</a></li>
    <li><a href="pg-hostels-in-delhi-ncr.php">Delhi-NCR</a></li>
    <li><a href="pg-hostels-in-hyderabad.php">Hyderabad</a></li>
    <li><a href="pg-hostels-in-noida.php">NOIDA</a></li>
    <li><a href="pg-hostels-in-jaipur.php">Jaipur</a>
    <li><a href="pg-hostels-in-kolkata.php">Kolkata</a>
    <li><a href="pg-hostels-in-mumbai.php">Mumbai</a>
    <li><a href="#"> More... </a>
    <ul>
    <li>
    <ul>
    <li><a href="pg-hostels-in-gurgaon.php">Gurgaon</a></li>
    <li><a href="pg-hostels-in-chandigarh.php">Chandigarh</a></li>
    <li><a href="pg-hostels-in-faridabad.php">Faridabad</a></li>
    <li><a href="pg-hostels-in-jammu.php">Jammu</a></li>
    </ul>
    </li>
    <li>
    <ul>
    <li><a href="pg-hostels-in-pune.php">Pune</a></li>
    <li><a href="pg-hostels-in-agra.php">Agra</a></li>
    <li><a href="pg-hostels-in-panchkula.php">Panchkula</a></li>
    <li><a href="pg-hostels-in-surat.php">Surat</a></li>
    </ul>
    </li>
    <li>
    <ul>
    <li><a href="pg-hostels-in-ghaziabad.php">Ghaziabad</a></li>
    <li><a href="pg-hostels-in-ludhiana.php">Ludhiana</a></li>
    <li><a href="pg-hostels-in-jalandhar.php">Jalandhar</a></li>
    </ul>
    </li>
    </ul>
    </li>
    </ul>
    </div>
    </body>
    </html>
    </div>
    <div class="green_box" style="margin:0 auto">
    <table cellpadding="0" cellspacing="0">
    <tr>
    <td><div style=" padding-left:5px;" >
    <form method="post" action="index.php">
    <table style="color:#FFFFFF;">
    <tr>
    <td width="137" style="padding-bottom:5px; font-size:12px; padding-left:5px;"><strong>Pg For</strong></td>
    <td width="145" style="padding-bottom:5px; font-size:12px;"><strong>Select City</strong></td>
    <td width="205" style="padding-bottom:5px; font-size:12px;"><strong>Select Locality</strong></td>
    <td width="145" style="padding-bottom:5px; font-size:12px;"><strong>Room Type</strong></td>
    <td width="109" style="padding-bottom:5px; font-size:12px;"><strong>Price Type</strong></td>
    <td width="132" style="padding-bottom:5px; font-size:12px;"><strong>Price Range (Rs)</strong></td>
    <td width="116" style="padding-bottom:5px; font-size:12px;"></td>
    </tr>
    <tr>
    <td style="width:125px; padding-left:5px; vertical-align:top;">
    <select name="pgfor" id="pgfor" style="width:100px;">
    <option value="">-- Select --</option>
    <option value="1">Male </option>
    <option value="0">Female</option>
    </select>
    </td>
    <td style="width:145px; vertical-align:top;">
    <!-- <select name="city" id="city" onchange="searchshowlocality(this.value)"> -->
    <select name="city" id="city" style="width:120px;" onchange="searchshowlocality(this.value)">
    <option value="502">Agra</option>
    <option value="129">Ahmedabad</option>
    <option value="641">Bangalore</option>
    <option value="272">Bhopal</option>
    <option value="98">Chandigarh</option>
    <option value="469">Chennai</option>
    <option value="576">Dehradun</option>
    <option value="617">Delhi</option>
    <option value="156">Faridabad</option>
    <option value="532">Ghaziabad</option>
    <option value="651">Gurgaon</option>
    <option value="8">Hyderabad</option>
    <option value="453">Jaipur</option>
    <option value="422">Jalandhar</option>
    <option value="190">Jammu</option>
    <option value="594">Kolkata</option>
    <option value="457">Kota</option>
    <option value="547">Lucknow</option>
    <option value="424">Ludhiana</option>
    <option value="661">Mangalore</option>
    <option value="431">Mohali</option>
    <option value="616">Mumbai</option>
    <option value="335">Nashik</option>
    <option value="620">Noida</option>
    <option value="166">Panchkula</option>
    <option value="167">Panipat</option>
    <option value="85">Patna</option>
    <option value="338">Pune</option>
    <option value="184">Solan</option>
    <option value="151">Surat</option>
    <option value="464">Udaipur</option>
    <option value="152">Vadodara</option>
    </select> </td>
    <td style="width:205px; vertical-align:top" id="slocalitydiv" >
    <select id="locality" style="width:180px; vertical-align:top;">
    <option value="1"> City 1 </option>
    <option value="0"> City 2</option>
    <option value="1"> City 3 </option>
    <option value="0"> City 4</option>
    </select>
    </td>
    <td style="width:145px; vertical-align:top;">
    <select id="roomtype" name="roomtype" style="width:125px;" >
    <option value="">-- Select --</option>
    <option value="1">Single Sharing</option>
    <option value="2">Sharing Basis</option>
    </select>
    </td>
    <td style="width:105px; vertical-align:top">
    <select id="pricetype" name="pricetype" style="width:95px; vertical-align:top;">
    <option value="">-- Select --</option>
    <option value="m">Monthly</option>
    <option value="d">Daily</option>
    </select>
    </td>
    <td style="width:125px; vertical-align:top">
    <select style="width:115px" name="price_value[]" multiple="multiple" id="price_value" >
    <option value="" selected="selected"> -- Select --</option>
    <option value=" (price>=1 and price<=2000) "> Below 2000</option>
    <option value=" (price>=2001 and price<=4000)"> 2001 - 4000</option>
    <option value=" (price>=4001 and price<=6000)"> 4001 - 6000</option>
    <option value=" (price>=6001 and price<=8000)"> 6001 - 8000</option>
    <option value=" (price>=8001 and price<=10000)"> 8001 - 10000</option>
    <option value=" (price>=10001)"> Above 10001</option>
    </select>
    </td>
    <td width="116" style="vertical-align:top">
    <input type="submit" name="submit" value="" style="background:transparent url('images/search (1).png') no-repeat top; width: 90px; height: 29px; color:white; border:none;" />
    </td>
    </tr>
    </table>
    </form>
    </div></td>
    </tr>
    </table>
    </div>
     
    abhi10kumar, Mar 11, 2013 IP