Hello, as usual I think I am way over-thinking this, so any help pointing me in the right direction is greatly appreciated. Ultimately I am trying to calculate the number of days between two dates and then multiply that number times another number (cost of a permit).
$("#date1 , #date2").on("input", function(e) { var start = $('#date1').val(); var end = $('#date2').val(); // end - start returns difference in milliseconds var diff = new Date(end - start); // get days var days = diff/1000/60/60/24; $("#days").val(diff*15); });
The jquery below does work for a basic calculation. I was hoping to expand this, work the number of days calculation into it but have so far, failed.
var $output = $("#permit_cost"); $("#number_of_permits").on("keydown", function() { var value = $(this).val(); $output.val(value*15); });
As I mentioned, any help is appreciated even if to let me know, "hey idiot, you forgot this!"
In the code below, my goal is to, when an option is selected in the drop down menu, the options class needs to check the matching class in the checkbox array in the next div. So if the first option is selected in the drop down menu (Academic accommodation request), both the first and second checkboxes (Test 1a and Test 1b) need to be checked.
I have had success grabbing the title attribute in select options but have not had much luck grabbing selected option classes.
Any chance I am on the right track? If not, if anyone can point me in the right directions, I would be super grateful! Thanks!
jQuery(document).ready(function() { // pass the title of the selected topic option to a hidden 'topic' form field jQuery('select#recipient_email_user').change(function() {//used to be recipients_multiple_emails | short_field_001 var topic = jQuery('select#recipient_email_user option:selected').attr('title'); // set the hidden input's value jQuery('#short_field_002').val(topic); var topic_email = jQuery('select#recipient_email_user option:selected').attr('class'); $(topic_email).prop( "checked", true ); }); });
I have the following accordions, below, on my page, however, I am looking for code that will work regardless how many accordions there are on the page.
My goal is to have links on the same page that open either of the accordions. I have yet to find javascript or jquery that will account for dynamically generated accordion id's.
Any help in pointing me in the right direction would be greatly appreciated. Thank you!
I have five text fields on a page. Numbers are entered into the first four and the fifth displays the total.
Is there any way using jquery to format the number in this fifth textfield with commas?
The first four fields are formatted fine using the code below. Of course this is not work on my jsfiddle. I hate it when that happens but am not worries about that.
My main question is, is there a way to use jquery to format a textfield with numbers using commas, where the number is dynamically generated (i.e. isn't typed in)?
In my jsfiddle, when Radio Option 1 is clicked , the two drop down menu fields are required.
When Radio Option 2 is clicked, the two drop down menus are hidden and their values, if any were selected, are removed.
This works fine.
My problem occurs when I edit a record. If I had clicked Radio Option 1 and then two options from the select menus; if I go back and edit the record and choose Radio Option 2, while the select options are removed in the form, they are not deleted in the database.
Any ideas what I am missing?
I thought the code below removed the value from a select menu but it only saves the removed value from textfields.
$('#21').val("");//state_2
I also tried the code blow but it did not work either.
$('#country_2').prop( "selected", false );
Any help is appreciated, even if to let me know I'm missing something super obvious!
We are using Collegenet's online calendar service and in order to get their "spud code" which is actually an iframe, to appear in IE and Firefox, we needed the following code in our template:
$(document).ready(function() {
$(".navbar li a").click(function() {
$(".dropdown-open").hide();
$('iframe').css('height','4000px');
});
});
The code appears fine in Chrome. I am attempting to use similar code on another template but am not have any success.
Below is the jquery code I am using along with the html.
My original question was here (thanks for the huge help jakecigar), however instead of having the divs hidden initially, I have decided to change it up and have the checkboxes disabled in the beginning.
Once the person selects a major from the drop down menu, the checkboxes (A,B,C,D,E) become intactive. This is working fine. However, once a gender radio button is clicked and then a citizen radio button is clicked, any or all of the checkboxes are supposed to become active/enabled. Unfortunately this isn't working.
When using a .filter is it not possible to switch from .prop("disabled", true) to .prop("disabled", false) or am I just missing some code? I know it's probably the latter so if you can point me in the right direction I would be super appreciative! Thanks and thank you to all who have helped me in the past.
I'm not a newbie but let's just say I am advancing slowly. Thank you to all who have helped me up until this point.
Here's my issue.
While the code in my jsfiddle below works, I still get the following error:
Uncaught ReferenceError: startFilter is not defined
Of course, because of this error, I can't get any additional jquery to work.
The purpose of the drop down menu is so that depending on what is selected, then the proper div or divs appear. the correct divs are appearing but until I figure out how to define startFilter, I'm up the creek.
Any help pointing me in the right direction is greatly appreciated! Even if it's "get you head out of your ..."
I have a feeling I am missing something super obvious. I hate that!
Hello and thank you to everyone who has previously helped me.
This time I don't have a problem as my code is working. I am
only asking if there is a more efficient way (i.e. less code) to
accomplish my goal of utilizing a show hide based on a radio button clicked.
In the jsfiddle above, if you click the Other button, a required
textfield appears. If you click any other radio button, the textfield
disappears and is no longer required.
It's the hide part of the code, below, that I figure there is a
more efficient way to write.
Hello and thank you to those who have helped me in the past. I'm
having a brain issue in reversing logic that I have successfully used in
the past.
What I need to do:
I have a checkbox array. If any of the checkboxes (freeform_ch_cla_course_preferences_courses_001_1 - freeform_ch_cla_course_preferences_courses_001_5)
are checked, I would like to addClass to a textarea (id="101").
Unfortunately, the code I have below, only works to toggle the validation.
Hello, the code below has worked for me but unfortunately I am
not an advanced enough coder to enhance the code the way I need it
to be.
What I need is the value of each options, to add |~|value_name.
For example, if the first option is selected Cohort A, I need the
value to be Cohort A|~|Cohort A.
Any tips to
point me in the right direction would be greatly appreciated. I
know I need to improve my coding skills!
Oh I forgot
to mention, the purpose of the drop down menu is that I have 5
of them. When one is selected, that item disappears from the
remaining drop down menus. So by the time selections are made
in the first 4 select menus, the 5th select menu has only one
item remaining.
Peter T
//dependent
drop down list
$(document).ready(function() {
var txtCoh = 'Select Cohort';
var cohorts = ['Cohort A','Cohort
B','Cohort C','Cohort D','Cohort
E'];
Hello and thank you to all who have helped me previously.
Here's my predicament.
I am using ExpressionEngine and
Solspace's Freeform Pro. I have my form set up so that the
user fills in the information and then clicks the submit button,
which is labelled "Continue" which then takes them to a
page where they can review and edit the date they just filled in.
Basically this is the same form but the user has the ability
to edit their information and then click the submit button.
Here's where I'm failing. On
this edit form, I have added one checkbox field that needs to be
required, therefore checked, before the form gets submitted.
If this checkbox is not checked, then the form should not submit.
The problem is that for this type of
field, a single checkbox, Freeform Pro automatically gives this
field a value (n). So what I would like to do is, after the
initial form is submitted and while this edit form loads, use jquery
to remove this value and make the field required. The code I
have used below has not worked.
$(function(){
var
valChk = $('input:checkbox[name=yes_1]').val()
if(valChk == 'n') {
$("#iAgree").prop( "checked", false );
$("#iAgree").addClass("required error");
}
});
If anyone could let me know if I'm on
the right track, I would greatly appreciate it.
Hello and thank you to all who have previously helped me.
I thought I had this working but not any more.
I have a form with a checkbox array. If the "Other" checkbox is checked, then a textfield appears (in div #fieldOther). If "Other" is unchecked, then the textfield as well as the value in it disappears. That is all working fine.
However, the action on this form takes the user to a page where they can review/edit their form data. The code below, used to work, so that on this review page, if "Other" was checked, both the textfield (#72) and value in it would appear. However, now, the value is in their, as I can see by inspecting the element. But the value unfortunately is not visible. Weird, I know!
Any help would be appreciated. I think I'm just missing something simple, as in yes, I know I am the error.
What I'm wondering, is the code below, causing the value
html code is below: As I mentioned, the value is in the code, but the textfield appears blank on the page. Thus of course, when I click submit, the value is removed and the field becomes required again.
I have a weird situation. I'm using a text field for the date in a form but not using datepicker because I have not been able to get it to work with a screen reader. This script I'm using below, works in jsfiddle but on my page allows 5 digits for the year instead of only 4.
Any ideas pointing me in the right direction are appreciated.
Thank you to everyone that has helped me in the past.
In my form is a checkbox group, that when one value is checked, a set of required radio buttons appears.
The jquery show hide is working.
When this particular value is unchecked, the set of radio buttons becomes not required and if a radio button was clicked, the value is removed.
This is working great too
When the form is submitted, the person is taken to another page to review their form.
While the value is still in the database, the jquery code I am using has removed the radio button value. If a radio button has been clicked on the initial form, I need that clicked on this review page. Unfortunately the jquery code I'm using removes the value.
Any help would be appreciated. Below is my jquery code:
What I am hoping for is that there is a way for jquery to determine on my review page, that if freeform_ch_ethnic_7 is checked, the value (freeform_ch_ethnic_radio_1 or whichever radio value) has been clicked, remains.
I know this question has been asked and probably answered before but I can't remember how to ask it. Weird I know.
I have a form with two textfields (short_field_002 and xshort_field_002) and two checkboxes (part of an array ch_r1 and ch_s1).
When ch_r1 and ch_s1 are checked, then short_field_002 and xshort_field_002 become required.
I have this working fine using toggleClass.
My problem is, if both ch_r1 and ch_s1 are checked, and then the person unchecks ch_s1, then short_field_002 and xshort_field_002 are no longer required, because of the toggleClass.
How can I avoid this, so that regardless how many times ch_r1 or ch_s1 is unchecked, as long as one of them remains checked, then short_field_002 and xshort_field_002 remain required?
Hello and thank you to everyone who has helped me on previous posts. I am wondering if it is possible to nest click functions in regards to radio buttons.
I am trying to do the following.
I have a radio button field with three selections: home, away and none.
If yes or maybe are chosen, then other fields become visible (name, email, title, newPerson), allowing the person to add up to four more people.
So initially the tree looks like:
fieldHome (home(_0)/away(_1)/none(_2) radio buttons)
if home
name (textfield)
email (textfield)
title (textfield)
fieldSurface (grass/turf radio buttons)
newPerson2 (yes/no radio buttons)
if yes
name2 (textfield)
email2 (textfield)
title2 (textfield)
fieldSurface2 (grass(_0)/turf(_1) radio buttons)
newPerson3 (yes(_0)/no(_1) radio buttons)
if away
name (textfield)
email (textfield)
title (textfield)
position (outfield(_0)/infield(_1) radio buttons)
newPerson2 (yes(_0)/no(_1) radio buttons)
if yes
name2 (textfield)
email2 (textfield)
title2 (textfield)
position2 (outfield(_0)/infield(_1) radio buttons)
newPerson3 (yes(_0)/no(_1) radio buttons)
Here's my dilemma.
What I want to happen is, when fieldHome is 'away' and newPerson2 is clicked yes, then addClass to fieldSurface2 and removeClass from position2.
I can't addClass based on newPerson2 because depending on which fieldHome radio button is clicked, will change which field (position2 or fieldSurface2) is required.
Thank you everyone who has helped me along the way.
I have two radio button elements (xshort_field_001_0 and xshort_field_001_1) in a form. When either is clicked, a different div appears. One div has a text field and the other has a textarea.
This is working fine. However, what I would like to do, is when xshort_field_001_0 is clicked, remove the value of the textarea which is inside the xshort_field_001_1 div.
I have three separate blocks of code, one for show/hide, one for add/removeClass and one for clearing the content from the textarea. Adding the third block to clear the content has always disabled the show/hide.
I figure I need to combine the .click and .bind functions. But I have not figured out how.
I'm guessing that I should probably combine all the code. I'll take any ideas or pointers.
I have a show/hide radio button field (yes_no_001_0 = Yes, yes_no_001_1 = No), where if Yes is clicked, two textfields and a radio button field appear in a div.
When No is clicked, those fields disappear. That is working fine.
If I type values in the two textfields, but then realize I meant to click No, when I click No, I have the jQuery working so that the values in those textfields are removed, making them blank.
Unfortunately I have not been able to switch the radio button field value in the show/hide field to either No (yes_no_002_1 = No) or blank.
The reason I want this radio button in the show hide div to be either No or blank is because if it is set to Yes or checked, I have the jQuery working so that the textfields become required.
Any chance I'm close and just missing something simple?
I have a drop down menu with four items (1, 2, 3, Other).
When Other is selected, a textarea appears. When any other item in the list is selected, the textarea disappears. This is working without a problem.
Where I am failing, is that when "Other" is selected, I am trying to add class="required error" (in red below.) Unfortunately, the way I am trying to do this, not only is it not working, but the show / hide feature will not work. I am trying to toggle the classes and hope that I am close.
Thank you again to all who have helped me previously!