<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div id="enquirypopup" class="modal fade in" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content row">
<div class="modal-header custom-modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Enquire Now</h4>
</div>
<div class="modal-body">
<div class="form-group">
<h4>Add or Remove User</h4>
<select id="lstFruits" value="<?php echo $query2['Email']; ?>" multiple="multiple" name="email[]" >
<?php
$dbHost = 'localhost';
$dbUser = 'dbangar';
$dbPass = 'Aelux@19038';
$dbName = 'StreetLightPortal_DB';
$db = mysqli_connect($dbHost, $dbUser, $dbPass, $dbName)
or die('Error Connecting to MySQL DataBase');
$sql1 = "CREATE TEMPORARY TABLE
temp_table2 (SELECT numbers.n, City1.City_Name, SUBSTRING_INDEX( SUBSTRING_INDEX( City1.Email, ',', numbers.n ) , ',', -1 ) name
FROM (
SELECT 1 n
UNION ALL
SELECT 2
UNION ALL SELECT 3
UNION ALL
SELECT 4
UNION ALL SELECT 5
UNION ALL SELECT 6
UNION ALL SELECT 7
UNION ALL SELECT 8
UNION ALL SELECT 9
UNION ALL SELECT 10
UNION ALL SELECT 11
UNION ALL SELECT 12
UNION ALL SELECT 13
UNION ALL SELECT 14
)numbers
INNER JOIN City1 ON CHAR_LENGTH( City1.Email ) - CHAR_LENGTH( REPLACE( City1.Email, ',', '' ) ) >= numbers.n -1
)";
mysqli_query($db, $sql1);
$result1=mysqli_query($db,"select * from temp_table2 where City_Name='$City_id' ");
while ($row1 = $result1->fetch_assoc()){
$location[]=$row1['name'];
}
foreach ( $location as $location1 )
{?>
<option value=<?php echo $location1; ?> selected="selected"><?php echo $location1; ?> </option>
<?php }?>
<?php
$result2=mysqli_query($db,"SELECT Email FROM register where Role <> 'Admin' ");
while ($row2 = $result2->fetch_assoc()){
$location2[]=$row2['Email'];
}
foreach ( $location2 as $location3 )
{?>
<option value=<?php echo $location3; ?> ><?php echo $location3; ?> </option>
<?php }?>
</select>
</div>
</form>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<link href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css"
rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script>
<link href="http://cdn.rawgit.com/davidstutz/bootstrap-multiselect/master/dist/css/bootstrap-multiselect.css"
rel="stylesheet" type="text/css" />
<script src="http://cdn.rawgit.com/davidstutz/bootstrap-multiselect/master/dist/js/bootstrap-multiselect.js"
type="text/javascript"></script>
<script>
$(document).ready(function() {
$('#closeButton').on('click', function(e) {
$('#previewBox').remove();
});
});
</script>
<script type="text/javascript">
$(function () {
$('#lstFruits').multiselect({
includeSelectAllOption: true
});
});
</script>
<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#enquirypopup">Open Modal</button>
#enquirypopup .modal-dialog {
width: 400px;
padding: 0px ;
position: relative;
}
#enquirypopup .modal-dialog {
width: 400px;
padding: 0px ;
position: relative;
}
#enquirypopup .modal-dialog:before {
content: '';
height: 0px;
width: 0px;
border-left: 50px solid #17B6BB;
border-right: 50px solid transparent;
border-bottom: 50px solid transparent;
position: absolute;
top: 1px;
left: -14px;
z-index: 99;
}
.custom-modal-header {
text-align: center;
color: #17b6bb;
text-transform: uppercase;
letter-spacing: 2px;
border-top: 4px solid;
}
#enquirypopup .modal-dialog .close {
z-index: 99999999;
color: white;
text-shadow: 0px 0px 0px;
font-weight: normal;
top: 4px;
right: 6px;
position: absolute;
opacity: 1;
}
.custom-modal-header .modal-title {
/* font-weight: bold; */
font-size: 18px;
}
#enquirypopup .modal-dialog:after {
content: '';
height: 0px;
width: 0px;
/* border-right: 50px solid rgba(255, 0, 0, 0.98); */
border-right: 50px solid #17b6bb;
border-bottom: 50px solid transparent;
position: absolute;
top: 1px;
right: -14px;
z-index: 999999;
}
.form-group {
margin-bottom: 15px !important;
}
.form-inline .form-control {
display: inline-block;
width: 100%;
vertical-align: middle;
}
