How to disabled picked date in daterangepicker connected to database - javascript

How to disable date already picked before in PHP 5 and database using MYSQL, and I tried several time but nothing to work, and I tried to make a booking system
<div class="row">
<div class="col-xs-3">
<label class="form-control" style="border:none;">Publish Date</label>
</div>
<div class="col-xs-3">
<input type="text" name="txtPublishDate" id="txtPublishDate" class="form-control" value="<?php echo $PublishDate; ?>" placeholder="Publish Date" />
</div>
</div>
<script>
$(function() {
$('input[name="txtPublishDate"]').daterangepicker({
opens: 'right'
}, function(start, end, label) {
console.log("A new date selection was made: " + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD'));
});
});

<input .... <?php echo is_string($PublishDate) ? ' disabled="disabled" readonly' : ''; ?> />
Or, don't even put the input based on if you've already picked it. Show the chosen value in a tag like a span instead. Then the JS won't bind to the disabled input.
eg:
<?php if !is_string($PublishDate) { ?>
<input .... />
<?php } else { ?>
<span><?php echo $PublishDate ?></span>
<?php } ?>

Related

Jquery autocomplete combo box/selectbox using codeigniter

I want to ask, has someone ever created autocomplete using combo box / select box with code igniter?
I've tried but only managed to use autocomplete for 2 input text but I have another idea to create autocomplete with text combined with combo box. I've do created that but I have trouble my autocomplete in the text is successful but in the combo box does not work only show empty option. can someone help me? this is my source code
My Table : i probably using 2 table for autocomplete : 1. tb_produk and 2. tb_kategori_produk
https://imgur.com/a/xpysI | 2. https://imgur.com/a/DVgUl
My Controller : user.php
public function request_produk(){ //used for calling view
$data["kateprod"] = $this->db->where("f_status_kategori_produk","1")
->get("tb_kategori_produk")->result_array();
$this->theme->panel('user/v_request',$data);
}
public function mesin() //user for jquery called data
{
$keyword = $this->uri->segment(3);
$data = $this->db->from('tb_produk')->join('tb_kategori_produk','tb_kategori_produk.f_id_kategori_produk=tb_produk.f_kategori_produk')->like('f_nama_produk',$keyword)->get();
foreach($data->result() as $row)
{
$arr['query'] = $keyword;
$arr['suggestions'][] = array(
'value' =>$row->f_nama_produk,
'idpro' =>$row->f_id_produk,
'idkate' =>$row->f_id_kategori_produk,
'kategori'=>$row->f_nama_kategori_produk
);
}
echo json_encode($arr);
}
My Controller : v_request.php
<div id="content">
<script type="text/javascript">
var site = "<?php echo site_url();?>";
$(function() {
$(".autocomplete").autocomplete({
serviceUrl: site+"/user/mesin",
onSelect: function (suggestion) {
$("#v_idproduk").val(""+suggestion.idpro);
$("#v_kategori").val(""+suggestion.kategori);
$("#v_idkategori").val(""+suggestion.idkate);
}
});
});
</script>
<?php $id = $this->session->userdata('f_id_user');
<input type="hidden" name="dt[f_id_user]" value="<?php echo $this->session->userdata('f_id_user'); ?>">
<input type="hidden" id="v_idproduk" name="dt[f_id_produk]">
<input type="hidden" id="v_idkategori" name="dt[f_kategori_produk]">
<div class="form-group br-form"> <!-- This form group i used to autocomplete text -->
<div class="col-md-2">
<label class="control-label">Nama Mesin</label>
</div>
<div class="col-md-10">
<input type="search" class="autocomplete form-control" id="autocomplete1" name="nama_mesin" required/>
</div>
</div><br><br>
<div class="form-group br-form"> <!-- This form group i used to autocomplete combo box-->
<div class="col-md-2">
<label class="control-label">Kategori Mesin</label>
</div>
<div class="col-md-10">
<select id="v_kategori" name="dt[f_kategori_produk]" class="form-control" required>
<option value="">---Harap Pilih---</option>
<?php foreach ($kateprod as $key) { ?>
<option value="<?=$key['f_id_kategori_produk']?>" id="v_kategori"><?php echo $key["f_nama_kategori_produk"];?></option>
<?php } ?>
</select>
</div>
</div><br>
This is my demo
https://streamable.com/wvn25

AJAX call PHP same page and reload option values

i have an html form with a date input and a multiselect.
When loading page I load the options of the multiselect through a php function.
What i want to do is to capture onChange event of the date input with a js script and launch the php script to reload the option values of the select using the new date.
This is the php code
<?php
//DEFINE
$dateMinimumInput = "";
// Handle AJAX request for changing DateMinimumInput(start)
if(isset($_POST['ajax']) && isset($_POST["dateMinimumChanged"]) ){
echo "Inside function dateMinimumChanged: " .$_POST['dateMinimumChanged'];
$dateMinimumInput = verify_input($_POST['dateMinimumChanged']);
}
$stationList = selectStations($dateMinimumInput); ?>
This is the javascript
<script>
$(document).ready(function(){
$("#dateMinimumInput").change(function(){
//Selected value
inputValue = $(this).val();
console.log(inputValue);
$.ajax({
type: 'POST',
url: '',
data: {ajax: 1, dateMinimumChanged: inputValue},
success: function(data){
console.log('works');
console.log(data);
$('body').append(response);
},
error: function(){
alert('something went wrong');
}
});
});
});
</script>
and this is the html form
<form class="" role="form" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>" method="post">
<div class="row">
<div class="col-md-6">
<div class="form-group form-row">
<label for="dateMinimumInput" class="col-form-label col-sm-4">Date Minimum:</label>
<div class="col-sm-8">
<div class="form-group">
<input type="date" class="form-control <?php if ( $dateMinimumInputErr !== "") { echo 'is-invalid'; }?>" id="dateMinimumInput" name="dateMinimumInput" placeholder="Enter date minimum" value="<?php echo $dateMinimumInput;?>">
<div class="invalid-feedback"> <?php if ( $dateMinimumInputErr !== "") { echo 'Please, ' .$dateMinimumInputErr; } ?> </div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="form-group form-row">
<label for="stationInput" class="col-form-label col-sm-4">Station:</label>
<div class="col-sm-8">
<select id="stationInput" name="stationInput[]" class="form-control" multiple>
<?php
foreach($stationList as $station){
if($station['numberofmeasurements'] == 0){
echo '<option disabled="true" value="'.$station['id'] .'">'.$station['location'] .' (' .$station['numberofmeasurements'] .') </option>';
}else{
echo '<option value="'.$station['id'] .'">'.$station['location'] .' (' .$station['numberofmeasurements'] .') </option>';
}
}
?>
</select>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12 text-right">
<button id="submit" name="submit" type="submit" class="btn btn-primary">Search</button>
</div>
</div>
</form>
The fragments of code are all from the same page.
The problem is that when I change the date, the javascript captures the event but the PHP script is not executed and the options are not reload.
Any help about what I'm doing wrong?
Thank you

How to use javascript if statement correct?

So I have this program that whenever the expiration date is exactly the same date as today the background of the <div> will change it color. But right now, the background color change only when my condition is == and when I try to use>= or <= the background color does not change. Also the background color change even the expiration date is not the same as the date today
Here is my javascript:
<script type="text/javascript">
var $today = date("m/d/Y");
var $expired = $passport_expiration;
function myDIV() {
if ($today == $expired) {
document.getElementById("myDiv").style.backgroundColor="#ff4d4d";
}
}
</script>
Here's my HTML:
<div class="col-md-6" id="myDiv">
<div class="alert" role="alert"><span class="glyphicon glyphicon-book" aria-hidden="true"></span> Passport <?php echo "<strong> $passport / Passport Expiration Date:</strong> $passport_expiration"; ?></div>
</div>
How I get the $today and passport_expiration, it is in my query
Thank you in advance
<div class="col-md-6" id="myDiv">
<div class="alert" role="alert">
<span class="glyphicon glyphicon-book" aria-hidden="true"></span>
Passport <?php echo "<strong> $passport /
Passport Expiration Date:</strong> $passport_expiration"; ?></div>
<input type="hidden" id="passport_expire_date" name="passport_expire_date" value="<?php echo $passport_expiration; ?>">
<?php $date = date("m/d/Y "); ?>
<input type="hidden" id="today_date" name="today_date" value="<?php echo $date; ?>">
</div>
u need to assign that values in input field then only, it will be validated in javascript
<script type="text/javascript">
var today = document.getElementById("today_date");
var expired = document.getElementById("passport_expire_date");
function myDIV() {
if ($today == $expired) {
document.getElementById("myDiv").style.backgroundColor="#ff4d4d";
}
}
</script>

Using a name selector instead of an id

How can I change the following code to work off of a name selector instead of the id?
<div id="light" class="change_group_popup">
<a class="close" href="javascript:void(0)">Close</a>
JavaScript
$('.change_group').on('click',function(){
$("#light,.white_overlay").fadeIn("slow");
});
$('.close').on('click',function(){
$("#light,.white_overlay").fadeOut("slow");
});
UPDATE:
I added more of my code to show the loop to help explain what I am doing in more detail.
$runUsers2 = mysqli_query($con,"SELECT * FROM users ORDER BY id DESC");
$numrows2 = mysqli_num_rows($run2);
if( $numrows2 ) {
while($row2 = mysqli_fetch_assoc($run2)){
if($row2['status'] == "Approved"){
//var_dump ($row2);
$approved_id = $row2['user_id'];
$approved_firstname = $row2['firstname'];
$approved_lastname = $row2['lastname'];
$approved_username = $row2['username'];
$approved_email = $row2['email'];
if ($approved_firstname == true) {
echo "Name - ". $approved_firstname . " " . $approved_lastname . "</br>" .
"Username - ". $approved_username . "</br></br>"
?>
<div class="change_group_button">
<a class="change_group" href="javascript:void(0)">Change User Permission</a>
</div><br>
<div class="change_group_popup light">
<a class="close" href="javascript:void(0)">Close</a>
<div class="group_success" style="color: red;"></div><br>
<form class="update_group" action="" method="POST">
<div class="field">
<label for="group">Group</label>
<input type="hidden" value="<?php echo $approved_id; ?>" name="approved_id" />
<input type="hidden" value="<?php echo $approved_firstname; ?>" name="approved_firstname" />
<input type="hidden" value="<?php echo $approved_lastname; ?>" name="approved_lastname" />
<input type="hidden" value="<?php echo $approved_username; ?>" name="approved_username" />
<input type="hidden" value="<?php echo $approved_email; ?>" name="approved_email" />
<select name='group_id' required>
You can get any element by name attribute by:
$('[name="someName"]')
Use DOM traversal functions to find the related element.
$(".change_group").click(function() {
var light = $(this).closest(".change_group_button").nextAll(".light").first(); // Find the next .light DIV after the button
light.add($(".white_overlay")).fadeIn("slow");
}):

how to split checked check box, text input value

![enter image description here][1]
Here I have attached the screen shot and my question is, if I select a check box free form , I couldn't take free form inet commission and bo commission value alone.If I checked the check box, value is one means I should take value 1's inet and bo commissions. Please any one help me to solve the problem. Each check box have separate value like 1,2,etc.
Here is my code : I am working under codeigniter frame work. Here is the html code and I am fetching data from table.
Is there any possible solution to split values in jquery,
<?php
if(isset($service_list) && !empty($service_list))
{ ?>
<div class="form-group">
<label class="col-sm-3 control-label">Product Name</label>
<div class="col-sm-3" id="list_staff">
<input type="checkbox" name="check_all" class="chkSelectAll">(Click to Check all)
</div>
<div class="col-sm-2">
<label>I-net Commission</label>
</div>
<div class="col-sm-2">
<label>Bo Commission</label>
</div>
</div>
<?php
foreach($service_list as $val)
{
$ds=0;
if(isset($view_list) && !empty($view_list))
{
foreach($view_list as $val1)
{
if($val['id']==$val1['mas_pro_id'])
{
$ds=1;
}
}
}
?>
<div class="form-group">
<label class="col-sm-3 control-label"><?=$val['pro_name']?></label>
<div class="col-sm-3">
<input type="checkbox" class="check_all serve"
name="permission[<?=$val['id']?>]" value="<?=$val['id']?>" <?=($ds>0)?'checked':''?>>
</div>
<div class="col-sm-2">
<input type="text" class="int_com<?=$val['id']?>" id="inet" style="width:30px;"/>%
</div>
<div class="col-sm-2">
<input type="text" class="bo_com<?=$val['id']?>" id="bo" style="width:30px;" />%
</div>
</div>
<?php }
}
else
{
echo "<div align='center' style='margin-right:100px; color:red;'>Sorry No Data Found..!</div>";
}
?>
my script:
$('#submit').live('click',function()
{
for_loading('Loading Data Please Wait...');
var cat_id=$('.cat_id').val();
var s_cid=$('.u_sub_cat_id').val();
var chkId = '';
$('.serve:checked').each(function () {
chkId += $(this).val() + ",";
});
chkId = chkId.slice(0, -1);
$.ajax({
url:BASE_URL+"product/edit_ser",
type:'get',
data:{ cat_id:cat_id,s_cid:s_cid,chkId:chkId},
success:function(result){
$("#list_view").html(result);
//THIS IS FOR ALERT
<?php /*?>jQuery.gritter.add({
title: 'Success!',
text: 'Category Added Successfully.',
class_name: 'growl-success',
image: '<?=$theme_path?>/images/screen.png',
sticky: false,
time: ''
});<?php */?>
for_response('Data Updated Successfully...');
}
});
});
My Screen shot could be like this,
Product name A Commission B Commission
free form ck box 10 % 05%
bulk booking ck box 00 % 00%
I didn't clearly understood your question, But i suppose this you are trying to get the values of the text field when its corresponding checkbox is clicked, this too on submitting. So i have created a Fiddle.
Check here!
you have to give different id's to your html elements.
<input type="checkbox" class="check_all serve" name="permission" value="1" id="check_<?php echo $val['id']?>" />
and also
<input type="text" class="int_com_<?php echo $val['id']?> style inline" id="inet_<?php echo $val['id']?>" />
<input type="text" class="bo_com_<?php echo $val['id']?> style inline" id="bo_<?php echo $val['id']?>"/>

Categories

Resources