Create a function which enables and disables the submit button depending on a checkbox input
Okay, so I am having a hard time trying to understand how a "toggle" effect like this should be written. So I have a form, with a main checkbox-input field, some dynamically added checkbox-input fields, and a submit button. What I am trying to achieve is, when the main checkbox (labelled as "Select All") is checked, to enable the submit button, and when it is unchecked, to disable the submit button. I also want the button to be disabled if NO checkboxes are selected, and I found a nice piece of code
Match A JSON Value to A Key Or Keys
Suppose I have a json object as seen below: { "testTypeA":"A", "testTypeB":"B", "testTypeC":"C", "assortedTest":["X","D","C"] } I have seen many jQuery tutorials on getting json values by using the key but I have not seen any tutorials on getting the key if the value is known. In the above json object, if I would like to get all the keys that have a value of C, what method could I use?
owl carousel does not show images
Hello Jake, I have a product_page.php, that displays an owl-carousel product image gallery on the left and product info section on the right: <div class="row mb-5"> <div class="col-lg-5 mb-5 mb-lg-0"> <div class="owl-carousel owl-theme manual dots-style-2 nav-style-2 nav-color-dark mb-3" id="thumbGalleryDetail"> <div> <img src="img/products/pr-gdesktop-1.jpg" class="img-fluid" alt=""> </div> <div> <img src="img/products/pr-gdesktop-2.jpg" class="img-fluid" alt=""> </div> <div> <img src="img/products/pr-gdesktop-3.jpg"
ajax/getJSON call fails with no error... help!
Hi I am trying to amend some legacy jquery code written by someone else - I'm not a jquery expert... :-( I have a call to getJSON that for some reason started to fail and I couldn't see why. I rewrote it to use $.ajax so I could see what was going on. I have added an error and complete function and also .done, always & .fail to try and see what is happening but neither these nor the original success function are being called. I have spent 3 days now trying to figurre out what is going wrong and
Slider with another slider isnide
Hi there Can anyone help me with this? How can I add slider inside slider. I whant normal big slider and in the bottom of this slider I whant creat brand carousel. Is there any library for it? Or simply I creat two separate sliders and using css I add position to this first one?
Best way to disallow functions on table cells with class="xyz"?
I have a table where I want to allow inline editing for all td elements except those having class="noedit". The following appears to work and only adds the background color to those cells which should be editable. I wonder if there is a better way to do this? I'm pretty new to the :not and :has selectors. <table> <caption>Edit-y Table </caption> <tr> <td class="noedit">Can't edit me<td> <td>But you can edit me</td> </tr> <tr> <td class="noedit">Can't edit me<td> <td>But
Changing on a specific day of the week a custom field
Hey I am trying to use ".show() - .hide()" on a specific field when I selecting a specific day of the week. I have tried a lot of codes lying on the net and without any success. Day 6 is working and disabling but whats inside "IF" is not working jQuery( "#pickup_date" ).datepicker({ beforeShowDay: function(d) { var day = d.getDay(); if( day != 5 ) { jQuery("p#pickup_time_field").hide(); jQuery("p#pickup_time_friday_field").show();
Detect if elements enter viewport from top or bottom
Hey guys, Is there a way to detect (onscroll) wether a div-container enters the viewport from below or from above, and then do something as long as the div remains in the viewport (in relation to scrolling-direction). Thank you very much Tobi
Making an IMG unselectable, IE9 compatible
I've discovered that the non-standard CSS to make something unselectable doesn't work in IE9: .unselectable, [data-em] { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: -moz-none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: rgba(0,0,0,0); } When a user inserts an emoji to my contenteditable, I don't want them to be able to click on it and drag to change the size... backspacing
How to call ajax links out of ajax content
The following scripts are encapsulate within "$(document).ready(function()" Script No. 1: $("#incoming_entry").on("click", function(){ $(this).incoming_entry(); }); $.fn.incoming_entry = function() { $.ajax({url: "./query/incoming_incoming.php", success: function(result){ $("#incoming_content").html(result); }}); }; Via click on an a-element with the ID incoming_entry this script
Cant seem to download jquery
I tried to download the jquery latest version. However, instead it gives me this (see below a substract). I'm taking a course and wanted to install the programme on my disk and what I'm getting is not in dowloaded format. Am I doing something wrong? Thanks for help! /*! jQuery v3.3.1 | (c) JS Foundation and other contributors | jquery.org/license */
!function(e,t){"use strict";"object"==typeof module&&"object"==typeof module.exports?module.exports=e.document?t(e,!0):function(e){if(!e.document)throw
How to customize jquery to minimize the size
Hi, I am trying to use jquery in an embedded software project. We are using Micrium RTOS operating system and their HTTP Web Server implementation. As it is embedded software they offer so called static file system (*.html, *.css etc compiled and converted to string literal using #define – see below) and dynamic file system (mounting SD or USB card as a system drive from which files are red). I was told (our local architectural decision) I have to use static files – which basically means that every
Weirdness displaying radio button after form submissions
After submitting a form, we're displaying all the form field data, but for some reason, everything after the radio button will not display on the page. var display = "<h4>Client room</h4>" + $("#firstName").val() + " " + $("#lastName").val() + " " + "<br>" + $("#emailAddress").val() + " " + "<br>" + "Sample 1: " + $("#q1").val() + "<br>" + "Sample 2 " + $("#q2").val() + "<br>" + "Existing: " + document.getElementById("q3").value;
Display form submission data with same-page thank you message
How can we display form submission data in a "thank you" div using only jQuery? There's no URL refresh.
jQuery Validate Plugin
Hi there, In my form named EditWeight a user can click on a button and add one or more textboxes. I want to validate these one or more textboxes to make sure they contain either integer or decimal number. I added this code and i have two problems. * reg expression that I'm using looks correct but the code always says does not validate * I don't know how to display the error message to use when the textboxes doesn't validate given that I have one or more textboxes. $('#EditWeight').on('submit',
Building custom jquery-ui
Hi, Is there an instruction on how to build jquery-ui in a similar way to building custon jquery (https://github.com/jquery/jquery). When I am trying to run npm run build I am getting an error : pm ERR! missing script: build? There is build.js in subfolder: jquery-ui\build\tasks. Is there also a list of modules that can be excluded from a build to create smallerjquery-ui? Kind Regards, Janusz
group horizontally a textinput and a checkbox
Dear all, I am trying to design a web site in jquery, but I am struggling with a display problem. I would want to display a search screen with an optional date (optional is selected with a checkbox placed at the right of the date entry field. I tried with an horizontal controlgroup (from http://demos.jquerymobile.com/1.4.5/forms-field-contain/), but each time, the date entry and the checkbox are displayed vertically instead of horizontally. I copy-paste the full html code of a simplified example
Can't find mistake, but surely some of you...
Dear all, I am using Chronoforms on Joomla and would like to add a JQuery custom code. Since Joomla moved from Mootools to JQuery, I have difficulties migrating the following code. Here's what it does: In short, to register for a debate tournament, field values #debaters, #judges, #observers are multiplied (by a fee) and added together. The tricky part: there is a discount option for every judge you bring more than the number of teams. Now, the number value of teams itself (capped at three) is irrelevant
Unable to select just one checkbox
<input type="checkbox" name="q_4[]" value="scales" /> <input type="checkbox" name="q_4[]" value="horns" /> <input type="checkbox" name="q_4[]" value="claws" /> key = "q_4[]"; value="horns"; $('[name="' + key + '"]' + '[value="' + value + '"]').prop("checked", true); Thank you
How to reach this element using jquery?
Hi, I am able to get the attached return using: console.log(data.e); but I want to know how can I reach the response element to read the document_id? I tried: console.log(data.e.response.document_id); but it's not working.. Thanks, Jassim
jQuery event variable scopes and ES6 classes (JSFiddle)
I'm having some issues getting a class method to fire when events are triggered. JSFiddle Basically, for buttons #1 and #2, you get the alert, but the _selector property is undefined, so obviously the event triggers fine, but it cant see the _selector property.. But for button #3, all thats really changed, is the btnThree.eventHandler(); gets executed from within an anonymous function... But it works just fine. Any ideas? I'm sure it's something simple.
I can't get the h1 in the jumbotron to execute the jquery function. Is something wrong with my code?
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Twilight Talk - Twilight Zone Blog</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <link href="web-fonts-with-css/css/fontawesome-all.min.css" rel="stylesheet"> <link href="css/twilightzone.css"
How can i pass multiple values of fropdowns in url?
Hey guys, I'm currently creating a project with Codeigniter and i have some dropdowns which will filter my db results using "GET" method in url. What i want is to pass or replace (if its already in the url) the value of the selected dropdowns ONLY, like an array. A guy helped me on some point but on selecting another dropdown box the value in url is replaced with the last chosen. Could you please help me on that?! P.S.: If you faced the same (filtering results) and you have a different proposal
Having Issue on Mouse Hover Between Two Element
Can you please take a look at This Demo and let me know how I can keep the #panel slide down/open when mouse traveling/hovering between #flip and #panel? and only slide up when mouse is out of theses two? $(document).ready(function() { $("#flip").hover(function() { $("#panel").slideDown("slow"); }, function() {}); $("#panel").hover(function() { }, function() { $(this).slideUp("slow"); }); }); body { padding-top: 20px; } #panel, #flip { padding: 5px; text-align: center; background-color: #e5eecc;
Unable to get input type
<select name="q_1[]" multiple size="6"> <option value="1">Volvo</option> <option value="2">Saab</option> <option value="3">Mercedes</option> <option value="4">Audi</option> </select> <select name="q_2"> <option value="1">Volvo</option> <option value="2">Saab</option> <option value="3">Mercedes</option> <option value="4">Audi</option> </select> <input type="checkbox" name="q_4[]" value="scales" />Scales <br /> //DOES NOT WORK ---ALWAYS GET undefined el = $('[name="q_1[]"]');
zabbix jQuery working on localhost but not remotely
Hi, I am using zabbix3.0.20 with apache server. When I access the webpage from localhost it loads fine but when I access the webpage remotely from another machine over the internet the page loads very slowly and incompletely. I get the following errors Uncaught ReferenceError: jQuery is not defined errors. How can I troubleshoot and fix this? Thanks Reagards, Usman
Hide div based on minimum number checkboxes selected
I wan to show hide divs based on total number of checkboxes selected in the html below. I want to .. 1. Hide div.cart if total no. of checkboxes selected is less than 3 and show div.notice 2. If total no. of boxes selected is greater than 3 hide div.notice and show div.cart. To sum if up div.cart show only be visible if user has checked 3 or more boxes, if not than user can only see div.notice telling them to select more. <input type="checkbox"> <input type="checkbox"> <input type="checkbox"> <input
Dynamic json listview trouble
Hi here is my code. ---------------------------------- <!DOCTYPE html> <html lang="en"> <head> <title>Page Title</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="jquery.mobile-1.3.2/jquery.mobile-1.3.2.min.css" /> <link rel="stylesheet" href="css/app-3.css"> <script src="js/jquery-1.9.1.min.js"></script> <script src="jquery.mobile-1.3.2/jquery.mobile-1.3.2.js"></script> <title>test 4</title> </head> <body>
$.on('keydown mousedown',...), force caret to the end of the node
Inside of a contenteditable, say that the caret is inside of a specific node (in my case, <q data-em="1"></q> ). How can I immediately kick the caret outside of the node, past the ending tag? I'm using the same loop that Jake helped me build in another thread to find when they're within the Q element: $('[data-ce]').on('click keydown', function(e) { var node = getSelection().anchorNode.parentNode; while (node && node.hasAttribute && !node.hasAttribute('contenteditable')) { console.log(node.nodeName);
get a value(text) from a span element to a input element ?
how to get an span element text to a input element and then grab the input element value and display it as a list below? From the code below, when I click the btnGET I would like to put the 8:00 pm into the <input id="txtTime" type="time" /> and then again get the new value of txtTime and display it as a list below when btnSET is clicked ..I am doing this to check how the type time will change the type of user input...Same is the case with EMAIL span as well.. Thank you in advance.. Ex: <div>
How to prevent form submit for href within a form?
Hi, I have this form: <form id="FormSignin" name="FormSignin" class="login" autocomplete="off"> <h1 class="login-title">مركز الإمام الصادق عليه السلام</h1> <input id="email" name="email" type="email" class="login-input" placeholder="البريد الإلكتروني" autofocus autocomplete="off" required="true"> <input id="password" name="password" type="password" class="login-input" placeholder="كلمة السر" autocomplete="off" required="true"> <img id="ImageSigninLoading" src="images/loading.gif"
How to append data to bootstrap data table?
I am getting the data to display but the table says "No data available in table" then it displays the database data and it does not allow me to do any of the built in features that come with the bootstrap data table like sort columns of pagination. Here is my code: <div class="table-responsive"> <table id="datable_1" class="table table-hover display pb-30" > <thead> <tr> <th>Product</th> <th>Variation</th> <th>Department</th> <th>Category</th> <th>Air/Boat</th> </tr> </thead> <tbody> </tbody> <script
Jquery selector on Django loop
So I have this It looks like this: https://gyazo.com/0b329d87af9372250a53ae25347b59b0 I need to select the items name when the user clicks on the anadir_button. Something like $('.producto_precio').last()clone().appendTo('#list_pedidos'); But this one just selects almendras, bananas and bolson frutal {% for producto in reparto_martes %} <div class="col-md-3"> <div class="card mb-4 box-shadow product-box"> <img class="card-img-top product-photo" data-src="holder.js/100px225?theme=thumb&bg=55595c&fg=eceeef&text=Thumbnail"
CHelp to create JSON
Dear Sir/Madam I came as across https://codepen.io/prajaktasoftware/pen/yqqgrV My difficulty is to stored the changed data in database so that changes can be stored and retrieved pl help how can i do it
$.ajax('s done not called
Hi, I have below simple ajax call to post a form. the form is being successfully posted and data were saved to the database but the problem here is my done is never been invoked and i am not getting the console.log("done") nor the rest of the done code. where is the issue here please? $.ajax({ method: "POST", url: "save_student.php", data: $("#frmNewStudent").serialize(), dataType: "JSON", beforeSend: function() { $("#ButtonSaveNewStudent").hide(); $("#ImageLoading").show(); } }).done(function(data)
Upload File & Data Problem
I'm using FilePond & it passes the file to you in a function. I'm trying to do a simple file upload w/ additional upload data. Here's my js: function fpUpload(fieldName, file, metadata, load, error, progress, abort) { console.log('InsideFP-Upload: ' , upload); // set further up console.log('InsideFP-File: ' , file); var obj_data = {}; obj_data['upload'] = upload; obj_data['myfile'] = file; var imgData = new FormData(); $.each(obj_data,
Jquery Pagination for list of items which is collapsible
Hi everyone, I have a question related to Jquery Pagination for list of items which is of tree structure. Items are collapsible and expandable. I have to do search in these items which has to high the items. Kindly suggest me is there any plugin available or do I need to implement from scratch. Thanks in advance.
Why don't work button???
$(document).ready(function() { $("#createStudentForm").unbind('submit').bind('submit', function() { var form = $(this); var formData = new FormData($(this)[0]); var url = form.attr('action'); var type = form.attr('method'); $.ajax({ url : url, type : type, data: formData, dataType: 'json', cache: false, contentType: false, processData:
Test if class exists on the site
Is there a way to check if a class that's assigned to something is actually defined on the site? I'm specifically working with content posted into a contenteditable. If they copied from my site then I want to keep the classes, but if they copied from another site and are bringing over classes from that site, then I want to remove them.
Multiple Date Picker, getting dates
I am using this example to select multiple dates http://jsfiddle.net/7613s2hu/2/?utm_source=website&utm_medium=embed&utm_campaign=7613s2hu So far so good but i need to get the values selected on the calendar. I added a label with the below code <script language="javascript" type="text/javascript"> document.getElementById('DatesLabel').value = $('#mdp-demo').multiDatesPicker('getDates'); </script> but each time i click a date on control the label shows as empty. My guess is to target
Next Page