Character encoding not declared errors - javascript

Got some error in my local server "The character encoding of the HTML document was not declared. The document will render with garbled text in some browser configurations if the document contains characters from outside the US-ASCII range. The character encoding of the page must be declared in the document or in the transfer protocol.", But in my production server,it never throw that kind of error.Well my problem is, I use my local server for testing and updates,but it will not output properly in a browser.
I use this global layout template.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org /TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<?php include_http_metas() ?>
<?php include_metas() ?>
<?php include_title() ?>
<link rel="shortcut icon" href="/favicon.ico" />
<?php include_stylesheets() ?>
<?php include_javascripts() ?>
<link rel="stylesheet" type="text/css" href="/css/print.css" media="print" />
<link rel="stylesheet" type="text/css" href="/bootstrap/css/bootstrap.min.css" />
<script type="text/javascript" src="/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/bootstrap/js/bootstrap-button.js"></script>
<script type="text/javascript" src="/bootstrap/js/bootstrap-collapse.js"></script>
<script type="text/javascript" src="/bootstrap/js/bootstrap-dropdown.js"></script>
<script type="text/javascript" src="/bootstrap/js/bootstrap-tooltip.js"></script>
<script type="text/javascript" src="/bootstrap/js/bootstrap-popover.js"></script>
<script type="text/javascript" src="/js/jquery.fixedheadertable.min.js"></script>
</head>
<body>
Some Contents
</body>
</html>
And this is the page with error
<style>
body{
/*margin-top: 100px;*/
font-family: 'Trebuchet MS', serif;
line-height: 1.6
}
.container{
/*width: 800px;*/
margin: 0 auto;
}
ul.tabs{
margin: 0px;
padding: 0px;
list-style: none;
}
ul.tabs li{
background: none;
color: #222;
display: inline-block;
/*padding: 10px 15px;*/
padding: 5px 5px;
cursor: pointer;
}
ul.tabs li.current{
background: #ededed;
color: #222;
}
.tab-content{
display: none;
background: #ededed;
/*padding: 15px;*/
padding: 5px;
}
.tab-content.current{
display: inherit;
}
table, td, th {
border: 1px solid green;
}
th {
background-color: green;
color: white;
}
</style>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('ul.tabs li').click(function(){
var tab_id = $(this).attr('data-tab');
$('ul.tabs li').removeClass('current');
$('.tab-content').removeClass('current');
$(this).addClass('current');
$("#"+tab_id).addClass('current');
})
})
</script>
<script type="text/javascript">
$.ajax({
url: '<?php echo url_for("misc/total") ?>',
dataType: 'json',
success: function(data){
console.log(JSON.stringify(data));
console.log("Total: " + data.total);
// update a div content
$("#responsecontainer").html(data.total);
}
});
</script>
<body>
<div class="page-header">
<div id="overdue"><h2 class="btn btn-danger">Borrowers with Overdue/Ongoing Account</h2></div><br />
<div> Number Of Borrowers: <h2 id="responsecontainer" class="btn btn-info"> </h2> Total Number Of Overdue Accounts: <h2 class="btn btn-info"><?php echo "coming soon" ?>
</h2> Number Of Ongoing Acounts: <h2 class="btn btn-info"><?php echo "coming soon" ?></h2>
</div>
</div>
<marquee><h1>Under Construction <span>Testing</span> <?php echo date('l,F d, Y') ?></h1></marquee>
<div class="container">
<ul class="tabs">
<li class="tab-link current" data-tab="tab-1">Bulacan</li>
<li class="tab-link" data-tab="tab-2">Novaliches</li>
<li class="tab-link" data-tab="tab-3">Manila</li>
<li class="tab-link" data-tab="tab-4">Commonwealth</li>
<li class="tab-link" data-tab="tab-5">Pasig</li>
<li class="tab-link" data-tab="tab-6">Libertad</li>
<li class="tab-link" data-tab="tab-7">Parañaque</li>
<li class="tab-link" data-tab="tab-8">Frisco</li>
<li class="tab-link" data-tab="tab-9">San Mateo</li>
<li class="tab-link" data-tab="tab-10">Batasan</li>
<li class="tab-link" data-tab="tab-11">Kamuning</li>
<li class="tab-link" data-tab="tab-12">Marikina</li>
<li class="tab-link" data-tab="tab-13">Makati</li>
</ul>
<div id="tab-1" class="tab-content current">
<p> Total numbers of Borrowers: <small id="divID" style="color: red"></small> Total no of loans <small id="result" style="color: red"></small> Total completed <small style="color: red">Testing</small> Loans overdue<small style="color: red"> Testing</small> Ongoing<small style="color: red">Testing</small></p>
<table class="table table-bordered table-condensed table-striped" id="tableId">
<thead>
<tr>
<th>Code</th>
<th>Name</th>
<th>Added On</th>
<th>Totals</th>
<th>Completed</th>
<th>Overdue</th>
<th>Ongoing</th>
</tr>
</thead>
<tbody>
<?php foreach($applicants as $app): ?>
<?php if($app->area_id ==2): ?>
<tr class="<?php echo fmod($i, 2) ? 'even' : 'odd' ?>">
<td><?php echo mb_strtoupper(mb_substr($app->Areas->name,0,4)) ?>000<?php echo $app->id ?></td>
<td><?php echo $app->getFirstname(), ' ' ,$app->getLastname(), ' ', $app->getMiddlename() ?></td>
<td><?php echo date ('M j, Y', strtotime($app->date_created));?></td>
<td class="d"><small style="font-family:Arial;color: #FF0000"><?php echo (count($app->Loans)); ?></small></td>
<td>
<?php foreach($app->Loans as $loan): ?>
<?php if($loan->is_completed == 'Y'): ?>
<?php echo ($loan->batch_no) ?>,
<?php endif; ?>
<?php endforeach; ?>
</td>
<td>
<?php foreach($app->Loans as $loan): ?>
<?php if($loan->is_completed =='N'): ?>
<?php $dueDate = strtotime($loan['due_date']);?>
<?php $today = time(); ?>
<?php if($dueDate <= $today): ?>
<?php echo($loan->batch_no) ?>,
<?php endif; ?>
<?php endif; ?>
<?php endforeach; ?>
</td>
<td>
<?php foreach($app->Loans as $loan): ?>
<?php if($loan->is_completed =='N'): ?>
<?php $dueDate = strtotime($loan['due_date']);?>
<?php $today = time(); ?>
<?php if($dueDate >= $today): ?>
<?php echo ($loan->batch_no) ?>,
<?php endif; ?>
<?php endif; ?>
<?php endforeach; ?>
</td>
</tr>
<?php endif; ?>
<?php endforeach; ?>
</tbody>
</table>
<script type="text/javascript">
(function() {
var div = document.getElementById('divID');
div.innerHTML = document.getElementById('tableId').getElementsByTagName("tbody") [0].getElementsByTagName("tr").length;
})();
</script>
<script type="text/javascript">
$(calculateSum);
function calculateSum() {
var sum = 0;
$(".d").each(function() {
var value = $(this).text();
//add only if the value is number
if(!isNaN(value) && value.length!=0) {
sum += parseFloat(value);
}
});
$('#result').text(sum);
};
</script>
</div>
Instead of Parañaque,the text is "gargled"...

Related

can't download wordpress posts using javascript

hello i have a list of posts and i use javascript to download a post as pdf
but i have a problem because the download button works just on the first post and not in the others and when i inspect the button in the browser i can see the description below but the button not working
this is a part of my code if some one could help :
ps: the download button is : Imprimer l'offre
<li style=" border: 1px solid black; padding: 20px; margin-bottom: 30px;" <?php job_listing_class(); ?> data-longitude="<?php echo esc_attr($post->geolocation_long); ?>" data-latitude="<?php echo esc_attr($post->geolocation_lat); ?>">
<!-- <a href="<?php the_job_permalink(); ?>">
-->
<!-- <?php the_company_logo(); ?> -->
<div class="work-section">
<h3><?php wpjm_the_job_title(); ?> <?php echo "Job ID: " . $post->ID ?> </h3>
<!-- <div class="company">
<?php the_company_name('<strong>', '</strong> '); ?>
<?php the_company_tagline('<span class="tagline">', '</span>'); ?>
</div> -->
</div>
<!-- <div class="location">
<?php the_job_location(false); ?>
</div> -->
<div id="tblCustomers">
<div id="collapseExample<?php echo $post->ID ?>" class=" collapse job_description">
<?php wpjm_the_job_description(); ?>
</div>
<div id="print-btn"></div>
</div>
<center>
<div class="vc_btn3-container red-btn vc_btn3-inline" style="margin-top: 20px">
<button id="pdfview" data-target="<?php echo $post->ID ?>" style="text-align: center;">
Imprimer l’offre
</button>
<div id="pdfdiv" style="display: none;">
<?php wpjm_the_job_description(); ?>
</div>
<div id="editor"></div>
<script type="text/javascript">
var $ = jQuery.noConflict();
$(window).on('load', function() {
var doc = new jsPDF();
var specialElementHandlers = {
'#editor': function(element, renderer) {
return true;
}
};
$('#pdfview').click(function() {
doc.fromHTML($('#pdfdiv').html(), 15, 15, {
'width': 700,
'elementHandlers': specialElementHandlers
});
doc.save('file.pdf');
});
});
</script>
</div>

I have data table in my page and data table sort is not working

I have data table in my page and I want to add sort in my table but its is not working.
View:
<link rel="stylesheet" href="<?php echo base_url(); ?>assets/plugins/datatables/dataTables.bootstrap4.css">
<link rel="stylesheet" href="<?php echo base_url(); ?>assets/custom/css/custom_style.css">
<style>
.highlight { background-color: #1DA5FF; color:#fff; }
th,
td {
white-space: nowrap;
}
div.dataTables_wrapper {
direction: rtl;
}
div.dataTables_wrapper {
width: 1000px;
margin: 0 auto;
font-family: Vazir;
font-size: 10px;
}
th {
min-width: 80px;
height: 32px;
border: 1px solid #222;
white-space: nowrap;
}
td {
min-width: 80px;
height: 32px;
border: 1px solid #222;
white-space: nowrap;
text-align: center;
}
</style>
<style type="text/css" media="screen">
td{
padding: 0;
}
</style>
<form role="form" id="print_booking_register" method="POST" enctype="multipart/form-data">
<section class="content">
<div class="row">
<div class="table-responsive">
<table id="booking_register_table" class="table table-bordered table-sm" style=" overflow: auto;"> </table>
</div>
</div>
</section>
</form>
<button id="print" name="print" onclick="printContent('print_booking_register')" class="btn btn-block btn-outline-primary fa fa-newspaper-o col-10 offset-1" style="margin-top: 35px; margin-bottom: 25px;" data-clicked="unclicked"> Print Booking Register</button>
<!-- DataTables -->
<script src="<?php echo base_url(); ?>assets/plugins/datatables/jquery.dataTables.js"></script>
<script src="<?php echo base_url(); ?>assets/plugins/datatables/dataTables.bootstrap4.js"></script>
<script href=" https://code.jquery.com/jquery-3.3.1.js"></script>
<script src=" <?php echo base_url(); ?>assets/plugins/datatables/jquery.dataTables.min.js"></script>
<script href=" https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js"></script>
<script href=" https://cdn.datatables.net/fixedcolumns/3.2.6/js/dataTables.fixedColumns.min.js"></script>
<script>
$(document).ready(function() {
$('#booking_register_table').dataTable({
order: [[ 3, 'desc' ], [ 0, 'asc' ]]
});
});
</script>
<script>
function printContent(e1) {
event.preventDefault();
var allVals = [];
$('input[name=selectedrecord]:not(:checked').each(function() {
allVals.push($(this).val());
});
allVals.forEach(function(i){
$('tr').each(function(){
$(this).find('td, th').eq(i-1).css({
display:'none'
});
});
});
$('#print').css('visibility', 'hidden'); //hiding print button on print page
$('input[name=selectedrecord]').css('visibility', 'hidden'); //hiding Check box on print page
var restorepage = document.innterHTML;
var printContent = document.getElementById(e1).innterHTML;
document.innterHTML = printContent;
window.print();
document.location.href = "<?php echo base_url(); ?>";
location.href="<?php echo base_url(); ?>booking/report/booking_register/BookingRegisterController/bookingRegister", 'refresh';
}
</script>
</body>
</html>
Controller:
$modelResult = $this->reportModel->bookingRegisterReportByLrno($data);
?>
<table id="bilty_table" class="table table-bordered table-striped table-sm" style=" overflow: auto;">
<thead>
<tr>
<th class="col2"><input type="checkbox" name="selectedrecord" value="2">LR No</th>
<th class="col3"><input type="checkbox" name="selectedrecord" value="3">Consignor Name</th>
</tr>
</thead>
<tbody>
<?php foreach($modelResult as $bilty){?>
<tr>
<td><?php echo $counter;?></td>
<td><?php echo $bilty->lr_no;?></td>
<td><?php echo $bilty->consignor;?></td>
</tr>
<?php }?>
</tbody>
</table>
Added jquery file in my code but i this it not support.
I do not know that where I am wrong in my code.
I try this code but its not working.
I have table in my controller and I am showing in view page

jQuery Mobile crash with other css

I want to use jQuery Mobile to make a persistent tab. But when I apply this to my view, it will destroy my page. I'm using CodeIgniter.
<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="https://code.jquery.com/jquery-1.11.3.min.js" type="text/javascript"></script>
<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js" type="text/javascript"></script>
It will make my search column become like this:
When I open the side bar or click the link from the persistent bar to open another page, the page that I open will look like this:
This is how i implement the jQuery Mobile in my view:
<!DOCTYPE html>
<html>
<head>
<title>home</title>
<link href="<?php echo base_url();?>css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="<?php echo base_url();?>js/jquery.min.js"></script>
<script src="<?php echo base_url();?>js/bootstrap.min.js"></script>
<!-- Custom Theme files -->
<!--theme-style-->
<link href="<?php echo base_url();?>css/style.css" rel="stylesheet" type="text/css" media="all" />
<!--//theme-style-->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Food shop Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template,
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<!--fonts-->
<link href='http://fonts.googleapis.com/css?family=Rokkitt:400,700' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Lobster+Two:400,400italic,700,700italic' rel='stylesheet' type='text/css'>
<!--//fonts-->
<script type="text/javascript" src="<?php echo base_url();?>js/move-top.js"></script>
<script type="text/javascript" src="<?php echo base_url();?>js/easing.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
$(".scroll").click(function(event){
event.preventDefault();
$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);
});
});
</script>
<link href="<?php echo base_url();?>css/index.css" rel="stylesheet" type="text/css" media="all" />
<link rel="stylesheet" href="<?php echo base_url();?>css/imgslider.css" type="text/css" media="screen" />
<script src="<?php echo base_url();?>js/slideout.min.js"></script>
<script src="<?php echo base_url();?>js/jquery.wmuSlider.js"></script>
<script src="<?php echo base_url();?>js/jquery.wmuGallery.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="https://code.jquery.com/jquery-1.11.3.min.js" type="text/javascript"></script>
<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js" type="text/javascript"></script>
</head>
<body>
<nav id="menu">
<h1 style="color:white">Menu</h1>
<hr style="color:white;">
<ul>
<?php if($tipeUser=="user"){?>
<li><h4 style="color:white">Welcome <?php echo $nama;?></h4></li>
<li><h4>Home</h4></li>
<li><h4>My Voucher</h4></li>
<li><h4>Profile</h4></li>
<li><h4>Restaurants</h4></li>
<?php
if($data_kategori->num_rows()>0)
{
foreach ($data_kategori->result() as $rows)
{ ?>
<li><h4><?php echo $rows->nama_jenis_makanan;?></h4></li>
<?php } } ?>
<li><h4>Faq</h4></li>
<li><h4>Blog</h4></li>
<li><h4>Logout</h4></li>
<?php } else if($tipeUser=="restoran"){ ?>
<li><h4 style="color:white">Welcome <?php echo $nama;?></h4></li>
<li><h4>Home</h4></li>
<li><h4>Dashboard</h4></li>
<li><h4>Voucher Management</h4></li>
<li><h4>Restaurants</h4></li>
<?php
if($data_kategori->num_rows()>0)
{
foreach ($data_kategori->result() as $rows)
{ ?>
<li><h4><?php echo $rows->nama_jenis_makanan;?></h4></li>
<?php } } ?>
<li><h4>Faq</h4></li>
<li><h4>Blog</h4></li>
<!-- <li><h4>Reedem Voucher</h4></li> -->
<li><h4>Logout</h4></li>
<?php } else if($tipeUser==""){ ?>
<li><h4>Home</h4></li>
<li><h4>Login / Register</h4></li>
<li><h4>Voucher</h4></li>
<li><h4>Restaurants</h4></li>
<?php
if($data_kategori->num_rows()>0)
{
foreach ($data_kategori->result() as $rows)
{ ?>
<li><h4><?php echo $rows->nama_jenis_makanan;?></h4></li>
<?php } } ?>
<li><h4>Faq</h4></li>
<li><h4>Blog</h4></li>
<?php } ?>
</ul>
</nav>
<main id="panel">
<header><!--header-->
<div class="header-in" >
<div class="container">
<!---->
<div class="header-bottom" >
<div class="col-xs-1">
<button class="toggle-button"></button>
</div>
<div class="col-xs-11">
<?php echo form_open('home_controller/search_bar',array('method' => 'get'));?>
<div class="search">
<form>
<input type="text" id= "input-keyword" name="input-keyword" placeholder="Search ..." value="<?php echo set_value('input-keyword')?>" >
<input type="submit" value="">
</form><?php echo form_close(); ?>
</div>
</div>
<div class="clearfix"> </div>
</div>
<!---->
</div>
</div>
<!---->
<div id="myCarousel" class="carousel slide" data-ride="carousel" data-role="content">
<?php
if($dataSliderVoucher->num_rows()>0)
{ ?>
<div class="carousel-inner" role="listbox">
<?php
$i = 1;
foreach ($dataSliderVoucher->result() as $rowsSliderVoucher)
{
if($i==1)
{
?>
<div class="item active">
<center><img src="<?php echo $url_image;?>restaurant/<?php echo $rowsSliderVoucher->id_restoran?>/deals/<?php echo $rowsSliderVoucher->gambar_voucher?>" height="200em" class="img-responsive" alt=""></center>
</br>
</br>
</br>
<div class="carousel-caption">
<h2><b><?php echo $rowsSliderVoucher->nama_voucher?></b></h2>
</div>
</div>
<?php }
else
{ ?>
<div class="item">
<center><img src="<?php echo $url_image;?>restaurant/<?php echo $rowsSliderVoucher->id_restoran?>/deals/<?php echo $rowsSliderVoucher->gambar_voucher?>" height="200em" class="img-responsive" alt=""></center>
</br>
</br>
</br>
<div class="carousel-caption">
<h2><b><?php echo $rowsSliderVoucher->nama_voucher?></b></h2>
</div>
</div>
<?php }
$i++;} ?>
</div>
<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
<?php } ?>
<!---->
<div id="loader"></div>
<div id="scroll-container" class="row">
<div class="container">
<div class="specials">
<?php if($dataLastDeals->num_rows()>0)
{
foreach ($dataLastDeals->result() as $rowsLastDeals)
{ ?>
<div class="col-xs-12" style="border:1px solid black;">
</br>
</br>
<?php if($tipeUser=="user" || $tipeUser==""){ ?>
<div class="actions">
<?php
if($rowsLastDeals->sisa_voucher > 0) {
?>
<center>
<a href="<?php echo base_url();?>home_controller/GetVoucher/<?php echo $rowsLastDeals->id_voucher;?>">
<img src="<?php echo base_url();?>.././img/restaurant/<?php echo $rowsLastDeals->id_restoran;?>/deals/<?php echo $rowsLastDeals->gambar_voucher;?>" class="img-responsive-search" alt="" style="object-fit: fill;height: 250px; ">
</a></center>
<div class="col-xs-6">
<h3 style="font-size: 3vw;text-overflow: ellipsis; overflow: hidden; white-space: nowrap;"><b><?php echo $rowsLastDeals->nama_restoran?></b></h3>
</div>
<div class="col-xs-6">
<h3 style="font-size: 3vw;text-overflow: ellipsis; overflow: hidden; white-space: nowrap;" align="center">Available <?php echo $rowsLastDeals->sisa_voucher. ' Voucher'?> </h3>
</div>
<?php
}
else{ ?>
<img src="<?php echo base_url();?>.././img/restaurant/<?php echo $rowsLastDeals->id_restoran;?>/deals/<?php echo $rowsLastDeals->gambar_voucher;?>" class="img-responsive-search" alt="" style="object-fit: fill;height: 250px; ">
<div class="col-xs-6">
<h4 align="center" style="color:red; font-size: 3vw;text-overflow: ellipsis; overflow: hidden; white-space: nowrap;"><?php echo $rowsLastDeals->nama_restoran?> <br></h4>
</div>
<div class="col-xs-6">
<h4 align="center" style="color:red; font-size: 3vw;text-overflow: ellipsis; overflow: hidden; white-space: nowrap;">NOT AVAILABLE <br></h4>
</div>
<?php }
?>
</div>
<?php } ?>
<!-- End Product -->
</div>
<?php }} ?>
</div>
</div>
</div>
</header>
</main>
<?php $j=0; ?>
<div id="pages">
<?php
for($i=0; $i< $total_data; $i++)
{
?>
<?php $j=$j+8;
} ?>
</div>
<div data-role="footer" data-position="fixed" data-tap-toggle="false">
<div data-role="navbar">
<ul>
<li>Home</li>
<li>Account</li>
<li>Voucher</li>
<li>Faq</li>
<li>Blog</li>
</ul>
</div>
</div> <!-- /footer -->
<?php if($this->session->flashdata('message')) :
echo "<script>alert('". $this->session->flashdata('message')."')</script>";
endif; ?>
<script src="<?php echo base_url();?>js/jquery-1.10.0.min.js"></script>
<script src="<?php echo base_url();?>js/script.js"></script>
</body>
<script>
var slideout = new Slideout({
'panel': document.getElementById('panel'),
'menu': document.getElementById('menu'),
'padding': 190,
'tolerance': 70
});
// Toggle button
document.querySelector('.toggle-button').addEventListener('click', function() {
slideout.toggle();
});
var userAgent = navigator.userAgent || navigator.vendor || window.opera;
if( userAgent.match( /iPad/i ) || userAgent.match( /iPhone/i ) || userAgent.match( /iPod/i ) )
{
slideout.disableTouch();
}
// auto close
slideout.on('open', function() {
$( "#panel" ).click(function() {
return false;
});
$( "#panel" ).click(function() {
slideout.close();
});
});
slideout.on('close', function() {
$( "#panel" ).unbind('click');
});
</script>
<script>
$('.gallery').wmuSlider();
</script>
<script>
$(function() {
$( "[data-role='navbar']" ).navbar();
$( "[data-role='header'], [data-role='footer']" ).toolbar();
});
// Update the contents of the toolbars
$( document ).on( "pagecontainershow", function() {
// Each of the four pages in this demo has a data-title attribute
// which value is equal to the text of the nav button
// For example, on first page: <div data-role="page" data-title="Info">
var current = $( ".ui-page-active" ).jqmData( "title" );
// Change the heading
$( "[data-role='header'] h1" ).text( current );
// Remove active class from nav buttons
$( "[data-role='navbar'] a.ui-btn-active" ).removeClass( "ui-btn-active" );
// Add active class to current nav button
$( "[data-role='navbar'] a" ).each(function() {
if ( $( this ).text() === current ) {
$( this ).addClass( "ui-btn-active" );
}
});
});
</script>
</html>
Please help me to solve this problem. I had already searched for a solution. But I couldn't find anything. I had been struggling with this problem for weeks.

Javascript Not working on form submit

I have wrote javascript in php file the thing is that i want to select input from dropdown using javascript the default value in dropdown is SELECT and when i submit the form i need the alert message like please select value in drop down lable. and apart from this i also need this for all dropdown option.wherever it found "SELECT" alert should be there with respective lable
My try is:
<?php
include("$_SERVER[DOCUMENT_ROOT]/riteshproject/config.php"); ?>
<?php if(isset($_POST['empsubmit'])) {
if(isset($_POST['areaname']) && isset($_POST['flat']) &&
isset($_POST['rentsale'])) {
$an=$_POST['areaname']; $flat=$_POST['flat'];
$rentsale=$_POST['rentsale'];
$_SESSION['an']=$an; $_SESSION['flat']=$flat; $_SESSION['rentsale']=$rentsale; }
} if(isset($_REQUEST['unsetsession'])) { session_destroy();;
header('location:home.php'); break; } ?>
<!DOCTYPE html> <html lang="en"> <head> <title>Shree Shree
Property,Kolhapur</title> <meta charset="utf-8"> <meta
name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="home.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script
src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<style>
/* Remove the navbar's default margin-bottom and rounded borders */
.navbar {
margin-bottom: 0;
border-radius: 0;
}
/* Set height of the grid so .sidenav can be 100% (adjust as needed) */
.row.content {height: 450px}
/* Set gray background color and 100% height */
.sidenav {
padding-top: 20px;
background-color: #f1f1f1;
height: 100%;
}
/* Set black background color, white text and some padding */
footer {
background-color: #555;
color: white;
padding: 1em 15px; margin-top: 50px;
border-radius: 0;
}
/* On small screens, set height to 'auto' for sidenav and grid */
#media screen and (max-width: 767px) {
.sidenav {
height: auto;
padding: 15px;
}
.row.content {height:auto;} .active { background-color: #00bfff; }
} .col-sm-2{background-color: gray;} .col-sm-8{background-color: #e0e0eb; border-radius: 25px;}
.mainBlock4{background-color: gray; overflow: scroll; height:
220px;} .mainBlock5{background-color: gray; overflow: scroll;
height: 240px;} th{text-align: center; background-color:black;
color:white;} .td1{color:black;}
.tr1:nth-child(even) {
background-color: #e0e0eb; } .trclose{} .closebutton{ border-collapse: collapse;} .button {
background-color: black;
border-radius: 10px;
color: white;
padding: 0.1px 8px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 14px;
margin: 2px 2px;
cursor: pointer; border: 2px solid red;} .button:hover {
background-color: gray; /* Green */
color: white;
</style> </head> <body>
<nav class="navbar navbar-inverse"> <div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<img src="../riteshproject/logo.png" align="center" style="width:70px;height:50px;">
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav">
<li>Home</li> <li class="current" id="dddd"><a
href="../riteshproject/aboutus.php" >About US</a></li> <li>Contact US</li>
<li>Add Property</li> <li>Luxarious Property</li> <li><a href="#">Property For
Sale</a></li> <li>Other Services</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="../riteshproject/Login/login.php"><span class="glyphicon glyphicon-log-in"></span><img
src="../riteshproject/login1.jpg" width="60" height="25"></a></li>
</ul>
</div> </div> </nav> <div class="container-fluid text-center"> <div class="row content">
<div class="col-sm-2 sidenav" align="center" id="2">
<head>
<title></title>
<script type="text/javascript">
var picPaths = ['../riteshproject/img/prop1.jpg','../riteshproject/img/prop2.jpg','../riteshproject/img/prop3.jpg','../riteshproject/img/prop4.jpg',
'../riteshproject/img/prop5.jpg'];
var curPic = -1;
//preload the images for smooth animation
var imgO = new Array();
for(i=0; i < picPaths.length; i++) {
imgO[i] = new Image();
imgO[i].src = picPaths[i];
}
function swapImage() {
curPic = (++curPic > picPaths.length-1)? 0 : curPic;
imgCont.src = imgO[curPic].src;
setTimeout(swapImage,2000);
}
window.onload=function() {
imgCont = document.getElementById('imgBanner');
swapImage();
}
</script>
</head>
<body>
<div>
<img id="imgBanner" src="" alt="" />
</div>
</body>
<div>
<p>Link</p>
<p>Link</p>
<p>Link</p>
</div>
</div>
<div class="col-sm-8 text-left"> <form action="" method="POST" onsubmit="notSELECT()">
<table><tr><td><h4><b>Welcome To Shree Shree Property,Kolhapur</b></h4></td></tr></table>
<hr>
<h5><b><i><marquee width="365px" height="10px" direction=slide BEHAVIOR=ALTERNATE left:355px>Search Property in
kolhapur... </marquee></i></b></h5>
</hr>
<table> <tr> </tr> <tr> </tr> <tr> <td width='35px'></td> <td>
<select name="rentsale" id="rentsale" value="select">
<option>RENT</option>
<option>SALE</option>
</select>
</td>
<td><input type="radio" name="radio" value="flat" checked>FLAT</td>
<td width='35px'></td> <td><input type="radio" name="radio" value="Bungalo">Bungalow</td> </tr> <tr height="60px">
<td height="20px" />Area
<td style="text-align:left">
<select name="areaname" id="areaname" value="select" class="NotEmpty">
<option value="SELECT" style="display:none">SELECT</option>
<?php
$query="select code,areaname from areamaster";
$query_run=mysql_query($query);
mysql_num_rows($query_run);
while($row=mysql_fetch_assoc($query_run))
{
?>
<option value="<?php echo $row['areaname']?>"><?php echo $row['areaname']?></option>
<?php
}
?>
</select>
</td>
<td></td>
<td>Flat</td>
<td style="text-align:left">
<select name="flat" id="flat" value="select">
<option value="SELECT" style="display:none">SELECT</option>
<?php
$query="select flat from flatmaster";
$query_run=mysql_query($query);
mysql_num_rows($query_run);
while($row=mysql_fetch_assoc($query_run))
{
?>
<option value="<?php echo $row['flat']?>"><?php echo $row['flat']?></option>
<?php
}
?>
</select>
</td>
</tr> <tr>
<td>
</td>
<td>
</td>
<td>
<input type="submit" name="empsubmit" style="width:75" id="submit" value="Search" class="button" onclick="showDiv()">
</td> </tr> </table> </form>
<?php if(isset($_SESSION['an'])) {
?>
<div class="heddendiv" width="30px">
<html><b>
Property Found for your search...</b>
<div Class="mainBlock4" style="width:100%">
<form name="leavesanction" action="" method="POST" onsubmit="notSELECT()" >
<table border=3px solid black;>
<tr>
<th width="15%" align="center">Area</th>
<th width="15%" align="center">Flat/Bungalo</th>
<th width="12%" align="center">BHK</th>
<th width="12%">Rent</th>
<th width="16%">Deposit</th>
<th width="10%">SQ Ft</th>
<th width="10%">FLoor</th>
<th width="10%">Lift</th>
</tr>
<?php
$select="select area,proptype,address,bhk,rent,diposit,sqft,floor,lift
from propertymaster where area='$an' and bhk='$flat' and rentorsale='$rentsale'";
$property=mysql_query($select);
while($row=mysql_fetch_assoc($property))
{
?>
<tr class="tr1">
<td class="td1">
<?php echo $row['area'];?>
</td>
<td align="center">
<?php echo $row['proptype'];?>
</td>
<td>
<?php echo $row['bhk'];?>
</td>
<td>
<?php echo $row['rent'];?>
</td>
<td>
<?php echo $row['diposit'];?>
</td>
<td>
<?php echo $row['sqft'];?>
</td>
<td>
<?php echo $row['floor'];?>
</td>
<td width="20px">
<?php echo $row['lift'];?>
</td>
</tr>
<?php
}
?>
</table>
<table class="closebutton">
<tr class="trclose" align="center">
<td></td>
<td width='260px'></td>
<td>
<a href="home.php?unsetsession=1">
<input type="submit" name="Close" style="width:75" id="Close" value="Close" class="button"></a>
</td>
</tr>
</table>
</form>
</div>
</html>
</div>
<?php } ?>
<?php if(!isset($_SESSION['an'])) { ?>
<div Class="mainBlock5" style="width:100%">
<p>testing div</p> </div>
<?php } ?>
</div>
<div class="col-sm-2 sidenav">
<div class="well">
<p>ADS</p> <img src="../riteshproject/login1.jpg" width="80" height="50">
</div>
<div class="well">
<p>ADS</p>
</div>
</div> </div> </div>
<footer class="container-fluid text-center">
<p><b><marquee>Designed,Developed and Maintened By Shree Shree
Property,Kolhapur Mob No 9373002173</b></marquee></p> </footer>
</body> </html>
<script> function notSELECT() {
var inputControls = document.getElementsByClassName("areaname");
if (inputControls.value== "SELECT") {
alert("Enter Proper search Values");
return false;
}
return true; }
</script>
in javascript i done following with function
i get the values using getElementByName
and using if condition i checked it with "SELECT"
and shown alert();
i wrote that function in form tag onsubmit="notSELECT()"
so plz help me out to show alert msg
please help me

In this code:
function notSELECT() {
var inputControls = document.getElementsByClassName("areaname");
if (inputControls.value== "SELECT") {
alert("Enter Proper search Values");
return false;
}
return true;
}
You try to select all elements with the className of "areaname", but I can't seem to find any class with that name. Perhaps this is what you wanted:
function notSELECT() {
var inputControls = document.getElementById("areaname");
if (inputControls.value== "SELECT") {
alert("Enter Proper search Values");
return false;
}
return true;
}
EDIT:
For your second question (you stated in the comments) here is the code:
function notSELECT() {
var inputControlsAreaName = document.getElementById("areaname");
var inputControlsFlat = document.getElementById("flat");
if (inputControlsAreaName.value== "SELECT") {
alert("Please select areaname");
return false;
}
if (inputControlsFlat.value== "SELECT") {
alert("Please select flat");
return false;
}
return true;
}

Javascript Uncaught Reference Error Anonymous Function [closed]

Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 7 years ago.
Improve this question
-I run a javascript file and jquery in a .php file. But anytime it runs I get the following error.
this is the javascript code : scroll.js
function setTableBody() {
$(".table-body").height(
$(".inner-container").height() - $(".table-header").height());
}
$(document).ready(function() {
var marginLeft = $(".outer-container").position().left; //Create var and calculate the difference from left
setTableBody();
$(window).resize(setTableBody);
$(".table-body").scroll(function() {
$(".table-header").offset({
left: marginLeft - this.scrollLeft //minus the difference while table header scroll with table body
});
});
});
This is the code from the header php file
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="layout.css">
<link rel="stylesheet" type="text/css" href="style.css">
<script language="javascript" type='text/javascript' src="jquery-1.11.3.min.js"></script>
<script language="javascript" type='text/javascript' src='scroll.js'></script>
</head>
<body>
<header>
<a href="/datacentre/admin/index.php" title="Return to the homepage" id="logo">
<img src="/datacentre/images/cagd_logo.jpg" alt="CAGD logo"
style="width:30px;height:30px;"/>
</a>
<span class="headerspan">CAGD Data Centre</span>
<a href="/datacentre/webhelp/index.htm" title="Return to the homepage" id="helpfile">
help
</a>
</header>
<div class="nav-div" id="nav-div">
<nav>
<ul id="nav-ul">
<li>Home</li>
<li>Booking</li>
<li>Activities <span class="caret"></span>
<div id=drop-down-div>
<ul>
<li>Waiting Approval</li>
<li>Approved</li>
<li>Work in process</li>
<li>Completed</li>
</ul>
</div>
</li>
<li>Manage User<span class="caret"></span>
<div id=drop-down-div>
<ul>
<li>Create User</li>
<li>Delete User</li>
</ul>
</div>
</li>
<li>Manage System<span class="caret"></span>
<div id=drop-down-div>
<ul>
<li>Request Table</li>
<li>Update Event</li>
<li>Delete Event</li>
</ul>
</div>
</li>
<li>Report<span class="caret"></span>
<div id=drop-down-div>
<ul>
<li>Main</li>
<li>Sort By<span class="caret"></span>
<div id=drop-down-div>
<ul>
<li>Name</li>
<li>Purpse</li>
</ul>
</div>
</ul>
</div>
</li>
<form id="search-form" method="post" action="search.php">
<input name="searcher" id="search-bar" type="text" placeholder="Type to Search">
<input id="search-button" type="submit" value="Find">
</form>
</ul>
</nav>
</div>
This is the main php file
<?PHP
session_start();
if (!(isset($_SESSION['login_user']) && $_SESSION['login_user'] != '')) {
header ("Location: loginForm.php");
}
?>
<?php
include('/templates/header.php');
$host = "localhost"; // Host name
$username = "root"; // Mysql username
$password = ""; // Mysql password
$db_name = "datacentre"; // Database name
$tbl_name = "data_centre_users"; // Table name
$server_name = "localhost";
// Create connection
$con = new mysqli($server_name, $username, $password, $db_name, 3306);
if($con->connect_error){
die("Connection failed: ".$con->connect_error);
}
// Check connection
if($con->connect_error){
die("Connection failed: ".$conn->connect_error);
}
$sql = "SELECT * FROM $tbl_name ";
$result = $con->query($sql);
function myDate($x){
if ( !strtotime($x)) {
return "00-00-0000 00:00:00";
}
else{
return strftime('%Y-%m-%dT%H:%M:%S',
strtotime($x));
}
return "";
}
?>
<section id="content">
<div class="outer-container">
<div class="inner-container">
<div class="table-header">
<table id="headertable">
<thead>
<tr>
<th class="center"><strong>ID</strong></th>
<th class="center"><strong>FirstName</strong></th>
<th class="center"><strong>Lastname</strong></th>
<th class="center"><strong>Department</strong></th>
<th class="center"><strong>Unit</strong></th>
<th class="center"><strong>Request</strong></th>
<th class="center"><strong>Purpose</strong></th>
<th class="center"><strong>Description</strong></th>
<th class="center"><strong>Booking Time</strong></th>
<th class="center"><strong>Access Time</strong></th>
<th class="center"><strong>Exit Time</strong></th>
<th class="center"><strong>Status</strong></th>
<th class="center"><strong>Approved / Denied By</strong></th>
</tr>
</thead>
</table>
</div>
<div class="table-body">
<table id="bodytable">
<?php
if($result->num_rows > 0){
// output data of each row
while($rows = $result->fetch_assoc()){ ?>
<tbody>
<tr>
<td class="center"><?php echo $rows['id']; ?></td>
<td class="center"><?php echo $rows['first_name']; ?></td>
<td class="center"><?php echo $rows['last_name']; ?></td>
<td class="center"><?php echo $rows['department']; ?></td>
<td class="center"><?php echo $rows['unit']; ?></td>
<td class="center"><?php echo $rows['request']; ?></td>
<td class="center"><?php echo $rows['purpose']; ?></td>
<td class="center"><?php echo $rows['description']; ?></td>
<td class="center" >
<input name="booking_time" type="datetime-local" id="booking_time" value="<?php echo myDate($rows ['booking_time']); ?>" size="15">
</td>
<td class="center">
<input name="access_time" type="datetime-local" id="access_time" value="<?php echo myDate($rows ['access_time']); ?>" size="15">
</td>
<td class="center">
<input name="exit_time" type="datetime-local" id="exit_time" value="<?php echo myDate($rows['exit_time']);
?>" size="15" </td>
<td class="center"><?php echo $rows['status']; ?></td>
<td class="center"><?php echo $rows['approved_by']; ?></td>
</tr>
</tbody>
<?php
}
}
?>
</table>
</div>
</div>
</div>
</section>
<?php
$con->close();
function concantName($first , $second){
return $first." ".$second;
}
?>
</body>
</html>
This is the CSS code
* {
padding: 0;
margin: 0;
}
body {
height: 100%;
width: 100%;
}
table {
border-collapse: collapse;
}
.outer-container {
background-color: #ccc;
position: absolute;
top: 10em;
left: 10em;
right: 200em;
bottom: 40em;
height:400px;
width:400px;
}
.inner-container {
height: 100%;
overflow: hidden;
position:relative;
}
.table-header {
position: relative;
}
.table-body {
overflow: auto;
}
.header-cell {
background-color: yellow;
text-align: left;
height: 40px;
}
.body-cell {
background-color: blue;
text-align: left;
}
.col1, .col3, .col4, .col5 {
width: 120px;
min-width: 120px;
}
.col2 {
min-width: 300px;
}
Any suggestion for a solution

The console is telling you the problem. You have an error when the browser is trying to reach http://localhost/datacentre/admin/jquery-1.11.3.min.js
The file name is wrong or maybe not here at all.

Categories