I have this code to show tabs.
$start = strtotime($_GET['date']);
$dates = array();
for ($i = 0; $i <= 7; $i++) {
$date = date('Y-m-d', strtotime("+$i day", $start));
$date1 = $date;
$day = date('D', strtotime($date1));
$date = explode('-', $date);
$dateinput = date('Y-m-d', strtotime("+$i day", $start));
$date = $date[2];
echo '<li class="lia" id="'.$dateinput.'"><input type="hidden" class="getdate" value="'.$dateinput.'">' . $date . ' ' . $day . '</li>';
}
I have a date-picker and i want to get the id of li by on change function of datepicker. I am using this code at moment.
$("#calendar-<?php echo $post->ID?>").on("change",function(){
var date = $(this).val();
console.log(date);
var libtn= $("li.lia").find("li").attr("id");
console.log(libtn);
alert(libtn);
});
It is showing undefined in alert box. Where i am doing wrong?
Replace
var libtn= $("li.lia").find("li").attr("id");
With
var libtn = $("li.lia").attr("id");
And check.
You can not find element itself inside same element.
EDIT
I am expecting you will have lia class everywhere means on every li.
Then,
Here is the code,
$("li.lia").each(function(i,j){
console.log($(this).attr("id")); // use as per your requirement
});
Related
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 5 years ago.
Improve this question
If I chose select option value 3, then show 3 textbox.
1.this picture is result of what i want.
but now wrong result like this.
(use style_display_on(), visible / hidden, none)
But it dosen't work. Am I missing something?
(php array converts to javascript array ,
and then count array from php is being used by getElementById value from javascript....)
<?php
$arr[0] = "10.1.35.31";
$arr[1] = "10.1.35.122";
$arr[2] = "10.1.35.133";
?>
<html>
<head>
<link rel="stylesheet" type="text/css" href="../css/main.css">
<script type="text/javascript">
function getR() {
document.getElementById("ipcnt").value = "<?php echo count($arr); ?>";
<?php
for($i = 0; $i < count($arr); $i++) {
echo "document.getElementById(\"" . "mmeremoteip" . $i . "\").value = \"" . $arr[$i]. "\";\n";
}
?>
}
function mmeswitch(){
<?php
for($i = 0; $i < 8; $i++){
echo "document.getElementById(\"mmeremoteip". $i . "\").style.visibility = \"hidden\";\n";
echo "document.getElementById(\"mmeremoteip". $i . "\").style.display = \"none\";\n";
}
for($i = 0; $i < 8; $i++){
echo "if( document.getElementById(\"ipcnt\").value == " . ($i+1) . " ) { \n";
for($j = 0; $j < $i+1; $j++) {
echo "document.getElementById(\"mmeremoteip". $j . "\").style.visibility = \"visible\";\n";
echo "document.getElementById(\"mmeremoteip". $j . "\").style.display = style_display_on();\n";
}
echo "}\n";
}
?>
</script>
</head>
<body onLoad="getR();">
<form name="save" method="post">
<h1>TEST</h1>
<table>
<tr id="ipcnt"><td colspan="2">No. of IP</td>
<td><select name="ipcnt" size="1" onChange="mmeswitch();">
<?php
for($i = 1; $i <= 8; $i++) {
echo "<option value='". $i ."'>". $i ."</option>\n";
}
?>
</select></td>
</tr>
<?php
for($i = 0; $i < 8; $i++) {
echo "<tr id=\"mmeremoteip".$i."\"><td class=\"param\" colspan=\"2\">MME Remote IP" . ($i+1) . "</td>\n";
echo "<td><input type=\"text\" name=\"mmeremoteip" . $i . "\" class=\"inputParam\" size=\"20\" maxlength=\"15\" value=\"".$arr[$i] ."\"></td></tr>\n";
}
?>
</table>
</body>
</html>
In this fiddle I posted a working example of your code in vanilla js. The js code for this is:
document.body.onload = init;
let arr = [1,2,3,4,5]; // Array is from php like
/*
let arr = JSON.parse('<?php echo json_encode($arr); ?>'); // In case you don't know what is does read more about json
*/
// function called when page is loaded
function init () {
// this creates textfields for each 'ip'
for(let i=0;i<arr.length;i++){
let el = document.createElement('input'); // create textfield
el.setAttribute('type','text'); // set it to text field
el.className = 'textField'; // set class for later use
el.id = 'textField'+i; // set id
el.value = arr[i]; // set value(IP)
document.getElementById('container').appendChild(el); // add to the page
}
document.getElementById('textFieldSelect').addEventListener('change',onSelectChange); // add action to select
onSelectChange(); // "trigger" select when page is loaded
}
function onSelectChange(){
var val = document.getElementById('textFieldSelect').value; // how many textfields shall there be
// hide all textfields
document.querySelectorAll('.textField').forEach(function(elem,idx){
elem.style = 'display: none';
});
//show exactly 'val' textfields
for(let i = 0;i<val;i++){
document.getElementById('textField'+i).style='display:block;';
}
}
https://jsfiddle.net/tnrrhx0d/1/
I am working on something, in which I am required to subtract 2 dates from one another, the difference would then be multiplied by the price per night of the event.
The issue I am having is that, while this works perfectly when using Chrome or Firefox, I am getting "NAN if I am using safari.
Date to and from are obtained using the php code below:
<?php
// displays days with leading 0s
$options = array();
for ($i=1; $i<32; $i++) {
$theday = date('d', mktime(0,0,0,0,$i,2000));
$sel = ($i == date('d') ? 'selected="selected"' : '');
$options[] = "<option value= \"{$theday}\" {$sel}>{$theday}
</option>";
}
$options_list = join("\r\n", $options);
echo "<div class='select' id='date'><select class=\"short-input day-to\" name=\"day_to\">{$options_list}</select></div>";
?>
<?php
$options = array();
for ($i = 1; $i<13; $i++) {
$themonth = date('F', mktime(0,0,0,$i,2, 2000));
$month = date('m', mktime(0,0,0,$i,2,2000));
$sel =($i == date('n') ? ' selected="selected"' : '');
$options[] = "<option value=\"{$month}\" {$sel}>{$themonth}
</option>";
}
$options_list = join("\r\n", $options);
echo "<div class='select' id='month'><select class=\"short-input month-to\" name=\"month_to\" size=\"1\">{$options_list}</select></div>";
?>
<?php
/* build selection list for the year */
$today = time(); // stores today's date
$startYr = date("Y", $today); // get the year from $today
echo "<div class='select' id='year'>
<select class=\"short-input year-to\" name='year_to'>\n";
for ($year=$startYr;$year<=$startYr+10;$year++)
{
echo " <option value= $year";
if ($startYr == $year)
{
echo "";
}
echo " > $year</option>\n";
}
echo "</select>\n</div>\n";
?>
http://jsfiddle.net/ju097j4z/#
Are there any solutions to this.
instead of Date.parse(monthFrom + ' ' + dayFrom + ' ' + yearFrom); in your fiddle use new Date(yearFrom, monthFrom, dayFrom); *note that in js month starts with 0
I would like to find find a way to calculate the difference between 2 dates, and display the result before I submit the form. This will be similar to the check in - check out drop downs in the yellow/ orange box in http://www.booking.com/ where on selecting the dates the number of nights is immediately displayed.
HTML version of code as displayed in JS Fiddle: http://jsfiddle.net/chri_chri/xy2gpa02/2/
Code used to generate the drop down date selectors
<?php
// displays days with leading 0s
$options = array();
for ($i=1; $i<32; $i++) {
$theday = date('d', mktime(0,0,0,0,$i,2000));
$sel = ($i == date('d') ? 'selected="selected"' : '');
$options[] = "<option value= \"{$theday}\" {$sel}>{$theday}
</option>";
}
$options_list = join("\r\n", $options);
echo "<div class='select' id='date'><select class=\"short-input\" name=\"day_from\">{$options_list}</select></div>";
?>
<?php
$options = array();
for ($i = 1; $i<13; $i++) {
$themonth = date('F', mktime(0,0,0,$i,2, 2000));
$month = date('m', mktime(0,0,0,$i,2,2000));
$sel =($i == date('n') ? ' selected="selected"' : '');
$options[] = "<option value=\"{$month}\" {$sel}>{$themonth}
</option>";
}
$options_list = join("\r\n", $options);
echo "<div class='select' id='month'><select class=\"short-input\" name=\"month_from\" size=\"1\">{$options_list}</select></div>";
?>
<?php
/* build selection list for the year */
$today = time(); // stores today's date
$startYr = date("Y", $today); // get the year from $today
echo "<div class='select' id='year'>
<select class='short-input' name='year_from'>\n";
for ($year=$startYr;$year<=$startYr+10;$year++)
{
echo " <option value= $year";
if ($startYr == $year)
{
echo "";
}
echo " > $year</option>\n";
}
echo "</select>\n</div>\n";
?>
you have two options, use java-script or submit form to php file and process the form.
jsfiddle working example http://jsfiddle.net/mdamia/3b5fyzjL/32/
// the script
function stayCost() {
var dayFrom = $('.day-from').val();
var monthFrom = $('.month-from').val();
var yearFrom = $('.year-from').val();
var dateFrom = Date.parse(monthFrom + ' ' + dayFrom + ' ' + yearFrom);
var dayTo = $('.day-to').val();
var monthTo = $('.month-to').val();
var yearTo = $('.year-to').val();
var dateTo = Date.parse(monthTo + ' ' + dayTo + ' ' + yearTo);
var dateDifference = dateTo - dateFrom;
var diffInDays = Math.ceil(dateDifference / (1000 * 3600 * 24));
$('.days').text(diffInDays);
$('.cost').text(diffInDays * 40);
}
stayCost();
$('.day-to').change(function () {
stayCost();
});
I have three drop down menus:
<?php
if(isset($som)) {
=======first drop down=======
echo "<select id="."som-patch1"." class="."form-control".">";
echo "<option value="."select".">Please Select SOM patch...</option>";
for ($i=0; $i < count($som) ; $i++) {
echo '<option value="'.$som[$i]['som'].'">'.$som[$i]['som'].' </option>';
}
echo "</select>";
=======second drop down=======
echo "<select id="."som-patch1-month"." class="."form-control".">";
echo "<option value="."select".">Please Select Month ...</option>";
for ($i=0; $i < 12 ; $i++) {
$month = date('F', strtotime('-'.$i.' month', strtotime(date('Y-m-01'))));
echo '<option value="'.$month.'">'.$month.'</option>';
}
echo "</select>";
=======third drop down=======
echo "<select id="."som-patch1-year"." class="."form-control".">";
echo "<option value="."select".">Please Select Year ...</option>";
for ($i=0; $i < 12 ; $i++) {
$year = date('Y', strtotime('-'.$i.' year', strtotime(date('Y-m-01'))));
echo '<option value="'.$year.'">'.$year.'</option>';
}
echo "</select>";
}
?>
I can successfully send the selected values to the following JavaScript function:
$('[id^=som-patch1]').on('change', function() {
alert( this.value );
});
The problem I have is:
I am unable to set the relevant values in the variables so that I could call the add_som_donut_chart_org_data() method.
Also I need to make sure all THREE values have been selected before the function call.
I have tried the following:
$('[id^=som-patch1]').on('change', function() {
var som = null;
var month = null;
var year = null;
if (id=='som-patch1'){
som = this.value;
}
alert( som );
});
But this doesn't set the som value.
The desired outcome should be:
if (som !== null && month !== null && year !== null) {add_som_donut_chart_org_data(som,month,year)}
Thanks in advance.
UPDATE: The following code resolved the issue
$('[id^=som-patch1]').on('change', function() {
var id = $(this).attr("id");
if (id == 'som-patch1') {
som = this.value;
}
if (id == 'som-patch1-month') {
month = this.value;
}
if (id == 'som-patch1-year') {
year = this.value;
}
if (som !== null && month !== null && year !== null) {
add_som_donut_chart_org_data(som,month,year);
}
});
As per your current code condition if (id=='som-patch1') would never be true, because id is not defined yet. Hence it will not set som variable. The reason is very basic that you have not defined id variable in your code. Before your condition use following code:
var id = $(this).attr("id");
I've got an array which gets all the testimonials from the database table and displays them via a foreach array. I want some kind of a slider which fades-in and fades-out the results.
This is my query:
$showTestimonials = array();
$getTestimonials = mysqli_query($mysqli,"SELECT * FROM testimonials ORDER BY testimonial_id DESC") OR die (mysqli_error($mysqli));
while($row = mysqli_fetch_array($getTestimonials)){
$row = array(
'testimonialName' => $row['name'],
'testimonialMessage' => $row['message']);
$showTestimonials[] = $row;
}
My PHP foreach code:
$count = 0;
foreach ($showTestimonials as $stt):
echo '<div class="content welcome features container">';
echo '<div class="content welcome features testimonial">';
echo '<div id="goSlide">';
if($count == 0) {
echo '<div class="slide show">';
echo '<div>'.$stt['testimonialMessage'].' '.$stt['dModel'].'</div>';
echo '<div>'.$stt['testimonialName'].'</div>';
echo '</div>';
}
echo '</div>';
echo '</div>';
echo '</div>';
$count++;
endforeach;
My piece of Javascript code
$(document).ready(function(){
var slides = $('#goSlide > .slide').length;
var current = 0;
setInterval(function() {
var next = ( ( current + 1 ) == slides ? 0 : current + 1 );
$( $( "#goSlide > .slide" )[ current ] ).fadeOut(1000).removeClass(".show");
$( $( "#goSlide > .slide" )[ next ] ).fadeIn(1000);
current = next;
}, 4000);
});
It's currently only showing ONE (the latest in the database) and only fades-in and out that one. It does not show the other testimonials.
The problem is you are updating $row inside the loop
while($row = mysqli_fetch_array($getTestimonials)){
$row = array( <---- here $row is getting updated
'testimonialName' => $row['name'],
'testimonialMessage' => $row['message']);
$showTestimonials[] = $row;
}
change it to
while($row = mysqli_fetch_array($getTestimonials)){
$row_1 = array(
'testimonialName' => $row['name'],
'testimonialMessage' => $row['message']);
$showTestimonials[] = $row_1;
}