Regular expression for valid string timezone check - javascript

I have requirement to validate timezone format. I am getting timezone in string format like the following way.
It should be like this way. I need to throw an error if anything else comes like +05:30
Valid timezone formats
0, 1, 2, 3.5, 5.75 .. 12
-1, -2, -4.5, -11 ... -12
Example timezone format
<option value="-12">(GMT -12:00)</option>
<option value="-11">(GMT -11:00) </option>
<option value="-10">(GMT -10:00)</option>
<option value="-9">(GMT -9:00) Alaska</option>
<option value="-8">(GMT -8:00)</option>
<option value="-7">(GMT -7:00)</option>
<option value="-6">(GMT -6:00)</option>
<option value="-5">(GMT -5:00)</option>
<option value="-4.5">(GMT -4:30)</option>
<option value="-4">(GMT -4:00)</option>
<option value="-3.5">(GMT -3:30) </option>
<option value="-3">(GMT -3:00)</option>
<option value="-2">(GMT -2:00)</option>
<option value="-1">(GMT -1:00 hour)</option>
<option value="0">(GMT)</option>
<option value="1">(GMT +1:00 hour)</option>
<option value="2">(GMT +2:00)</option>
<option value="3">(GMT +3:00)</option>
<option value="3.5">(GMT +3:30)</option>
<option value="4">(GMT +4:00)</option>
<option value="4.5">(GMT +4:30)</option>
<option value="5">(GMT +5:00) </option>
<option value="5.5">(GMT +5:30) </option>
<option value="5.75">(GMT +5:45)</option>
<option value="6">(GMT +6:00)</option>
<option value="6.5">(GMT +6:30)</option>
<option value="7">(GMT +7:00) </option>
<option value="8">(GMT +8:00) </option>
<option value="9">(GMT +9:00) </option>
<option value="9.5">(GMT +9:30) </option>
<option value="10">(GMT +10:00) </option>
<option value="11">(GMT +11:00) </option>
<option value="12">(GMT +12:00)</option>
Could you help me to solve this, i dont have much expertise in using regular expression to show what i had tried. Thanks

^-?\d{1,2}(?:\.\d{1,2})?$
This should do it for you.See demo.
https://regex101.com/r/rU8yP6/8
or
^(?:-?(?:1[01]|[0-9])(?:\.\d{1,2})?|12)$
https://regex101.com/r/rU8yP6/10

Here's one way. Note that it test against .5 and .75 but can't tell the difference between 6.5 and 7.5. Both those numbers would pass, but only one is a valid timezone. This will however test against the right format at least.
/^-?\d{1,2}(\.5|\.75)?$/
Here are some tests:
/^-?\d{1,2}(\.5|\.75)?$/.test("5.5"); // returns true
/^-?\d{1,2}(\.5|\.75)?$/.test("5.7"); // returns false
/^-?\d{1,2}(\.5|\.75)?$/.test("-3.75"); // returns true
/^-?\d{1,2}(\.5|\.75)?$/.test("+05:30"); // returns false
Edit: oops! forgot to make sure it tested for 1 or 2 numbers for the integer value.

valid_timezones = [0, 1, 2, 3.5, 5.75] # Use your array here
regexp = Regexp.new "\\A(#{valid_timezones.join('|')})\\z"
# => /\A(0|1|2|3.5|5.75)\z/
I'm assuming that the numeric values are submitted (e.g. "5.75") rather than the timezone strings (e.g. "(GMT +5:45)") so that is what you want to match with the regexp.

This regex accepts all formats: +12, -12 and 12
/^[-\+]?(?:(?:1[012]|[0-9])(?:\.\d{1,2})?)$/
https://regex101.com/r/tM8sW0/3

Related

SequelizeValidationError : askType cannot be an array or an object

I am working on React Project where I am targeting API for creating a records but in meantime I got this error SequelizeValidationError : askType cannot be an array or an object . I will share my code could someone please help me how to convert object value to single string . Thanks
Code
let taskChange = function (value) {
slotInfo.taskType = value;
};
<select name="taskType" onChange={taskChange}>
<option value="no">Task Type</option>
<option value="meeting">Meeting</option>
<option value="followUp">Follow Up</option>
<option value="viewing">Viewing</option>
<option value="reminder">Reminder</option>
<option value="other">Other</option>
</select>

javascript set dropdown value to month not working in IE11

I am using the following code to set a drop-down value to the current month, it is working in Chrome and Edge but in IE 11 the value is empty.
month = currentDate.toLocaleString(locale, {month:"short"})
document.getElementById("month").value = month
month contains the value "Jul" and is of type string, and I can set it as the value of a text box.
If I manually assign month = "Jul", it does set the value on the drop-down.
IEs toLocalString() adds some invisible Unicode characters to the string so the value of the dropdown-option and the value of month are not actually the same.
If it won't cause cross-locale compatibility issues then you can trim these characters with replace.
Alternatively, if you know the order of your dropdown list then get the month as a number and use selectedIndex
currentDate = new Date()
locale = 'en-US'
month = currentDate.toLocaleString(locale, {month:"short"})
document.getElementById("month").value = month.replace(/[^A-z]/g,'')
// Alternatively
//document.getElementById("month").selectedIndex = currentDate.getMonth();
<select name="dates" id="month">
<option value="Jan">Jan</option>
<option value="Feb">Feb</option>
<option value="Mar">Mar</option>
<option value="Apr">Apr</option>
<option value="May">May</option>
<option value="Jun">Jun</option>
<option value="Jul">Jul</option>
<option value="Aug">Aug</option>
<option value="Sep">Sep</option>
<option value="Oct">Oct</option>
<option value="Nov">Nov</option>
<option value="Dec">Dec</option>
</select>

If value in select option is lower than in second select option, then change option

I want to achieve:
If I select "16" in first select box and bigger value in second, for example "17", then in second select automatically changing to "16".
Just if value in first select box is lower than second, always change to same values, for example 16 to 16, 18 to 18.
<select id="from_age_js" name="from_age" class="select-advertise-style">
<option value="f13">13</option>
<option value="f14">14</option>
<option value="f15">15</option>
<option value="f16">16</option>
<option value="f17">17</option>
<option value="f18" selected>18</option>
<option value="f19">19</option>
<option value="f20">20</option>
</select>
—
<select id="to_age_js" name="to_age" class="select-advertise-style">
<option value="t13">13</option>
<option value="t14">14</option>
<option value="t15">15</option>
<option value="t16">16</option>
<option value="t17">17</option>
<option value="t18">18</option>
<option value="t20" selected>20+</option>
</select>
That's an easy one, in your case, with pure javascript, I would do something like this:
function checkit()
{
//Store the two dropdowns for easy reference
var fromAge = document.getElementById('from_age_js');
var toAge = document.getElementById('to_age_js');
//Verify if the toAge value is minor, to see if the conditional code will be executed
if( fromAge.options[fromAge.selectedIndex].value >
toAge.options[toAge.selectedIndex].value)
{
//In that case, match the values to be the same...
document.getElementById('to_age_js').value =
fromAge.options[fromAge.selectedIndex].value;
}
}
And you just have to add that function to where you want it to be called. I would choose to add the onchange event from Javascript within the select dropdowns. Like this:
<select id="from_age_js" name="from_age" class="select-advertise-style" onchange="checkit();">
You can see a working example here:
https://jsfiddle.net/8cmad3tz/19/

How would I round minutes to the nearest 5 minute mark in momentjs?

Currently working on a site where I use moment.js. I want to use jquery only.
I get the current minute using:
var minute = moment().minute();
but I want to set an alarm starting at the nearest next 5 minute mark.
So say it's 8:38pm now, var minute would be 38. I'd want to set the input to a value of 40 (that is, 40 minutes)
So where my options are:
<select id="minuteID">
<option value="0">00</option>
<option value="5">05</option>
<option value="10">10</option>
<option value="15">15</option>
<option value="20">20</option>
<option value="25">25</option>
<option value="30">30</option>
<option value="35">35</option>
<option value="40">40</option>
<option value="45">45</option>
<option value="50">50</option>
<option value=55>55</option>
</select>
And I can input the item like so:
var minute = moment().minute();
$("#minuteID option[value=" + minute + "]").prop("selected", "selected");
How do I make it so that instead of finding the exact option minute, it finds it at intervals of 5 (to the nearest 5 marker).
minute = 5 * Math.round( minute / 5 );
will do as you want.
var minute = roundToFive(moment().minute());
$("#minuteID option[value=" + minute + "]").prop("selected", "selected");
function roundToFive(num) {
var temp = num%5;
if (temp<3)
return num-temp;
else
return num+5-temp;
}

TypeError: Cannot call method 'each' of null - Javascript Type error in Joomla ChronoForms

I'm trying to make a "double" drop down with Joomla ChronoForms but I'm having a Javascript error on the page when I select something from the first dropdown, here is my code:
<select id="recipe" name="recipe">
<optgroup label="test" id="ch_1">
<option value="blabla">something here</option>
<option value="blabla">something here</option>
</optgroup>
<optgroup label="test244" id="ch_2">
<option value="blabla">something here</option>
<option value="blabla">something here</option>
</optgroup>
<optgroup label="testtt" id="ch_3">
<option value="blabla">something here</option>
<option value="blabla">something here</option>
</optgroup>
<optgroup label="testt23521" id="ch_4">
<option value="blabla">something here</option>
<option value="blabla">something here</option>
</optgroup>
<optgroup label="teeesstt" id="ch_5">
<option value="blabla">something here</option>
<option value="blabla">something here</option>
</optgroup>
</select>
and the JS code is:
window.addEvent('load', function() {
var num_groups = 5;
var groups = new Array;
for ( var i = 1; i <= num_groups; i++ ) {
groups[i] = $('ch_'+i);
$('ch_'+i).remove();
}
$('chapter').value = '';
$('chapter').addEvent('change', function() {
var group_no = $('chapter').value;
if ( !group_no ) {
return;
}
$('#recipe optgroup').each(function(el) {el.remove()});
$('recipe').appendChild(groups[group_no]);
});
});
And the JS error that I receive is: TypeError: Cannot call method 'each' of null
Could you PLEASE help me with this?
Thank you
Here is the thread in the forum related to this link or link2 , maybe it can help someone find the issue, I've tried everything I can .. :( please someone
okay, if it is joomla most likely it is MooTools, not sure what version though, try to change selector
$('#recipe optgroup').each(function(el) {el.remove()});
to
$$('#recipe optgroup').each(function(el) {el.remove()});
$('chapter')
If it's not an element it is supposed to be
$('#chapter') ID OR $('.chapter') Class
$('recipe') supposed to be $('#recipe')
Also if you think this line is jQuery
$('chapter').addEvent('change', function() {
it is supposed to be
$('#chapter').on('change', function() {
I never heard of .addEvent in javascript
Supposed to be either attachEvent or eventListener in vanilla javascript
Try this: $('#recipe').find('optgroup').each
Аre you sure that at the time of each method calling the combobox already created in dom? Try to using setTimeout function
setTimeout(function(){
$('#recipe').find('optgroup').each.....
}, 1000);

Categories