Dynamic looping div
Hi, apologies for asking for help on my first post I'd like to automate the code below so that I don't have to manually add a new function each time. I have a div with a class team, within the team div there is an hours class that increments by 1 every time. individual_sum1 = 0; $(".team .hours1").each(function(){ value1 = $(this).data("distance"); individual_sum1 = individual_sum1 + value1; $(".team .individual_hours1").text(individual_sum1);
jqFloat.js - keep floating objects within container
I'm currently using this jqFloat.js that makes elements float in space around the page. Unfortunately, they float in relation to the size of the screen, and not of their parent container, which is what I wish to achieve. Here's the HTML of my structure <div class="wrapper"> <div id="projects"> <div> <a href="projects/first/index.html" class="project-item"> <img src="images/body/brain.png" id="image" class="brain" /> <span class="title">Sintesi addittiva</span> </a> </div> <div>
Form Tag As Base Selector
Say I've created a jQuery reference to a form tag ($formRef), and within the form I am dynamically adding and removing DOM elements. Will these selectors, a & b, reference the same element? var a = $formRef.find('#elementAddedPostFormReferenceCreation'); var b = $('#elementAddedPostFormReferenceCreation'); I've always believed that with dynamic HTML, the DIV containing the dynamic content should not be cached because it will only 'find' the elements that existed when the reference was created. But
Running as re-usable code.
Can you tell me how I can get this piece of code to run when the link is pressed on both pages: http://jsfiddle.net/a4poster/g642zemv/ I know I could do it with the following: $("#"+a0+" .btnCode").click(function(){ alert("I've been pressed From: "+a0+" - "+$(this).attr("href")); }); $(".btnCode").click(function(){ alert("I've been pressed From: "+a0+" - "+$(this).attr("href")); }); But as this is used many times I thought it might be easier using something like the former. Many thanks.
Any of the jQuery Line plugins not working
Any one can please help me, I am trying to use jquery line plugins, I tried all the plugins but unable to draw line using those plugins, Not throwing any error too, but line is not visible on the screen. While debugging it got stucked at the line of code used to draw the line. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="~/Scripts/jqSimpleConnect.min.js"></script> <div style="position:relative; height: 110px;"> <div id="div_e" class="node1"
Looped Countdown base on timezone with Moment JS.
Hi, That's the code I use for the Countdown, so it will repeat (loop) after 24 hours. <script type='text/javascript'> jQuery(document).ready(function($){ $(function(){ var nextDay = new Date(). setHours(0, 0, 0, 0) + (1 * 24 * 60 * 60 * 1000); $('#clock').countdown(nextDay, function(event) { $(this).html(event.strftime('' + '<div><span class="number">%D</span> <span class="timertext">days</span></div>' + '<div><span class="number">%H</span> <span class="timertext">hours</span></div>' + '<div><span
jQuery move focus to next input
I have a form that contains multiple inputs on different levels. Is there a jquery function that can simulate the pressing of 'TAB' key? I tried using next or nextUntil but none simulate the 'TAB' key because they only go on the same level and not go to the upper levels.
Prevent Copying
Up until recently I used this in CSS to prevent copying in my app, but it no longer seems to work and I am not sure why. body { -webkit-touch-callout: none; -webkit-user-select: none; -webkit-tap-highlight-color: transparent; }Anyone still successful with this or any ideas why it has suddenly stopped working for me?
JQuery version (3.3) officially not supported. Instrumentation active nonetheless, because major version is supported and minor is newer than supported versions
Team, We are using Jquery version 3.3.1 for our website. We also load external libraries like analytics.js & SAP_IDs.js(from sap cloud identity). When these libraries are loaded in the page load increases and our monitoring tools show "JQuery version (3.3) officially not supported. Instrumentation active nonetheless, because major version is supported and minor is newer than supported versions" as warning against each external api requests. Could you please tell me what is the issue when external
Reverse Infinite Scrolling Inside Div (Like in a Chat Window)
I'm looking to create reverse infinite scroll inside a div; for a chat application that I'm building. The newly created chat messages are appended below the current stack of loaded messages. However, if the user has to view the old chat messages, they'll have to scroll up. I'm wondering how to do this inside of a `<div>`; and trigger an event when the scrollbar is say 300 pixels away from the top border of the div. After searching a bit, I found out that this is the recommended approach - $('.yourDiv').scroll(function(){
Jquery Megamenu plugin with horizontal submenu items
I am looking to find a header menu jquery plugin that supports multilevel items but sub menu items are placed horizontally. e.g Category 1 has 80 subcategories. When the Category 1 is hovered and a submenu opens up and the 80 subcategories should be placed horizontal instead of vertical which is impossible to read as they create a long scroll page. I have been searching for hours but cant find anything similar to my requirement. Anyone can help please? Thanks in advance
remove one of the comma separated values in a cell while placing row data into variable
Hi all I am working through the tutorials here: https://www.tutorialrepublic.com/faq/how-to-add-remove-table-rows-dynamically-using-jquery.php I have modified the table so it has 3 columns. Here : http://jsfiddle.net/14ngdcuk/ I am now able to collect the row data into a variable Eagle 2018-09-25 12:00,1537876800 predator But I would like only the UnixTimeStamp (eg 1537876800) value of t comma separated datetime value cell in my final variable like so : Eagle 1537876800 predator How and when should
jQuery UI Slider and WordPress
Hello, How does one integrate the jQuery UI range slider into a non-WooCommerce WordPress page so the rendered output can be filtered by custom post type meta_key? The meta_values associated to the meta_keys under consideration will always be real numbers (0-2 decimal places). Thank you very much for your replies, Don
Help with fancybox?
I am still learning jquery, and I am trying to get fancybox to work on my website. I have been fighting with it for a few days and finally followed https://www.granneman.com/webdev/coding/css/fancybox-a-better-lightbox to get it to work. It did, but only in the test folder. As soon as I moved all the files out of there and into my regular website folders, it stopped working. It opens the image URL in the tab rather than in a lightbox, and that's the problem I've been having from the start. This is
Where to begin with for creating a jquery php data live filter.
Hello guys, i'm kinda newbie in jquery - ajax and what i want is to build a "live filtering" function with get parameters using jquery (and ajax i guess). I'm aware of some basics as for the ajax functionality but what i really want is to end up building a function with get parameters in url based on dropdowns, inputs, checkboxes etc.. , sth like "www.example.com/products?category=tshirt&color=red etc.. etc..".. Can anyone tell me where shall i start in order to learn to build something like that?
How to match #id patterns with wildcard?
Assume I want to addres all ids which match the following pattern: #advert-* e.g.: #advert-43256 #advert-54 #advert-888 How can I achieve this with jQuery? The following does not work: $("#advert-*")......
Issue with tabs not displaying
I am using the following code (copied directly) and using my htm pages. The tabs do not display. <!DOCTYPE html> <html lang="en"> <head> <title id='Description'>TRANSPORTATION</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <link rel="stylesheet" href="/resources/demos/style.css"> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
If X = Y then Y else Q in an ajax query
Hi all! I'm completely new to all of this but am trying to add some logic into an ajax query from a JSON file to write this to HTML. I'm reading two variable from a nested JSON file, "departure time" and "expected departure time". I want to write the "expected departure time" into the HTML if the two times differ. But if they are equal instead of the time I want to write "On Time". For this I need to have some logic inside my query. But I don't know how to do this. Below is the code where I have
autocomplete doesnt work in dynamic input field
i have an ajax request to take source autocomplete in dynamic field with add button but not working, pls correct my code, i dont understand.. var counter = 1; $("#addrow").on("click", function () { var newRow = $("<tr>"); var cols = ""; cols += '<td><input type="text" style="width: 200px;" id="item[' + counter + ']" name="item[' + counter + ']" placeholder="Item"></td>'; cols += '<td><input type="text" style="width: 100px;" id="harga[' + counter + ']" name="harga['
How do I blackout part of the page after a certain time
After a person visits the page and starts watching the video When thirty seconds are passed, the entire page about the video is blurred I would be very thankful if I got a small part of the idea
Icon trigger not displaying
I have the following code $( "#Date" ).datepicker({ numberOfMonths: 3,showButtonPanel: true, dateFormat: "yy-mm-dd", changeMonth:true, changeYear: true, showOn: "both", buttonimage:"calendar.gif", buttonImageOnly: true}); However, the trigger ICON does not display. The GIF is in the same folder as the HTML page.
Using replaceWith
Hello all, please consider this code snippet, which works fine: ld: function ($t, $h) { //load HTML of target selection into DOM var $c = $h.clone(); $c.find("script").remove(); //prevent double firing of scripts $t.html($c.html()); //inject div into primary DOM } I would like to tranpose the last line to use replaceWith() instead of html()
Detecting when a combo box field in a table's column change
Hi I have a table where one of its colums whose name is 'color' is a combo box ,the combo box displays two values 'black', 'white'; what I need is to update a counter each time the user changes de value of any combo box on any row of the table from 'black' to 'white', if the initial value of a combo is 'white' and it changes to 'black', counter must be incresed other way decresed. How can I do it ?, I would like to use the id attribute of the field to do that. I have done that in a simple combo
Append values in dropbox list with apostrophes
Hi guys, I am populating a dropdown box with values received from a query (using ajax json mysqli). All works fine until data is found with an apostrophe in it. Then the dropbox is completely empty, although some data have no apostrophes. Can someone help me out here? I suppose the code in red needs to be altered so that data with apostrophes will show in the dropdown box. Many thanks in advance! Here is my code: function getThuisploeg() { seizoen = $("#Seizoen-text").val(); competitie =
jequery-te get the source and send it using ajax to server side
I implemented the jquery text editor in my web page. I want to get the source and send it to the server side. that is what I tried, but it doesn't work. it alerts the encoded answer. but it doesnt want to send it to the server. if I dont use any editing tool, just simple text. it sends it and I get "ok" but if I try to colorize the text or any other editing. the ajax doesnt send it to the server. is there a reason? $("#postEditor").jqte(); $('#btnSend').click(function () {
Syntax error in IE 11
Hi there, My code works just fine in Chrome and Edge but in IE 11, I get syntax error at line var GDN. Any idea why? $('#Edit').on('submit', function () { var GDN = $('#FirstName').val().split('|').filter((i) => i.length).length; }); Joe
parameter values not passing in jquery ajax method
Hi All, My application has a draggable table following is the code $("table#pages tbody").sortable({
items: "tr:not(.home)",
placeholder: "ui-state-highlight",
update: function () {
var ids = $("table#pages tbody").sortable("serialize");
var url = "/Admin/Shop/ReorderCategories";
console.log(ids);
$.post(url, ids, function (data) {
});
Jquery autocomplete using a remote data source
Hi All, I'm trying to implement Jquery autocomplete using the remote data source (https://raw.githubusercontent.com/FortAwesome/Font-Awesome/master/advanced-options/metadata/icons.json). I'd like to search in the terms array as shown below and return all the objects containing the search term in the arrays. I tried this code but it's not working. Do we need to implement the data soruce on the server side or will it work with this URL data source (https://raw.githubusercontent.com/FortAwesome/Font-Awesome/master/advanced-options/metadata/icons.json).
How do I iterate an array in an array?
Some on the objects in my array have a nested array. I'm having trouble getting the values these arrays. This is an example from the array: { "item": [ { "title": "Sat, 01 Dec", "pubDate": "Sat, 01 Dec 2018 00:00:00 GMT", "episodes": { "episode": { "show": "The Gadget Show", "name": "Episode 9", "format": "s28e09", "summary": "" } } }, { "title": "Wed, 28 Nov", "description": "" "pubDate": "Wed, 28 Nov 2018 00:00:00 GMT",
Checkbox in readonly - jQuery mobile
I want to set jQuery mobile checkbox in readonly or in disabled but without trasparency. How can I do it? thanks
Image upload and delete preview image
<input type="file" id="FileUpload1" accept=".jpg,.png,.gif" /> <br /> <br /> <table border="0" cellpadding="0" cellspacing="5"> <tr> <td> <img id="Image1" src="" alt="" style="display: none" /> </td> <td> <canvas id="canvas" height="5" width="5"></canvas> </td> </tr> </table> <br /> <input type="button" id="btnCrop" value="Crop" /> <input type="button" id="btnUpload" value="Upload" /> <input type="hidden" name="imgX1" id="imgX1" /> <input type="hidden" name="imgY1" id="imgY1" /> <input type="hidden"
increase/decrease image size
Can anyone recommend a plugin that toggles increase/decrease image size? cheers...
Returning the index and changing the background of item clicked.
Hi I want to be able to change the background of the .full_wifth class if it also has the class .bbc from red to black. I have included a fiddle: http://jsfiddle.net/a4poster/YmG8A/58/ I also want to return the index of the full_width class that has been clicked. Many thanks, Paul.
How to remove this element? contains() not working
Lets start with a sample page: https://www.ghacks.net/2018/11/26/can-you-use-the-tor-browser-without-tor-connection/ As you can see pretty much at the end there is a line starting "Now you" in bold face. I want to remove the wrapping <p> element (on this and all similar ghacks webpages) after loading of webpage. I tried so far: $("strong:contains('Now Vou')").parent().remove(); $("p:contains('Now Vou')").remove(); $("strong:contains('Now Vou')").parent().css("display", "none"); $("p:contains('Now
Jquery get lowest value in loop object
Hi I am looking a way to get the lowest value in my varients object. so my object looks like this: console.log(this.variants); I can then create one object from the above: var result = {}; $.each(this.variants, function (i, val) { result += val.breaks.split('\n') ; }); console.log(result); which gives me: 25:0.20,249:0.20,250:0.16,499:0.16,500:0.12,1000:0.12,25:0.21,249:0.21,250:0.17,499:0.17,500:0.14,1000:0.14,25:0.29,249:0.29,250:0.24,499:0.24,500:0.18,1000:0.18,25:0.31,249:0.31,250:0.25,499:0.25,500:0.20,1000:0.20,25:0.34,249:0.34,250:0.28,499:0.28,500:0.21,1000:0.21,25:0.51,249:0.51,250:0.41,499:0.41,500:0.31,1000:0.31,20:0.92,259:0.92,260:0.74,519:0.74,520:0.56,1000:0.56,25:0.39,249:0.39,250:0.32,499:0.32,500:0.25,1000:0.25,25:0.52,249:0.52,250:0.42,499:0.42,500:0.32,1000:0.32,25:0.72,249:0.72,250:0.58,499:0.58,500:0.47,1000:0.47,
Add reset / clear canvas link to imahe upload preview
I want to add a reset link to tis script that shows a thubnail preview of image upload, can ayone help please?: function previewImage(el,widths,limit){ var files = el.files; var wrap = el.parentNode; var output = wrap.getElementsByClassName('imagePreview')[0]; var allowedTypes = ['JPG','JPEG','GIF','PNG','SVG','WEBP']; output.innerHTML='Loading...'; var file = files[0]; var imageType = /image.*/; // detect device var device = detectDevice(); if (!device.android){
Dialog not closing until AJAX success/error function completes
I am using a modal dialog to display a "please wait" spinner while I call an AJAX function to fetch some data. When the AJAX call completes I close the dialog. However if I throw an alert in the AJAX success or error handler after closing the spinner dialog, the alert displays while the spinner is still visible. I tried using the dialog close event handler, but the behavior is the same. It's looking like the spinner dialog isn't actually hidden until the AJAX success or error function completes.
JqueryMobile breaks style while refreshing
HI, I am doing a mobile APP that feeds itself with a JSON API from a Drupal site, so I have this page <div id="PaginaEventos" data-role="page" > <div class="miHeader" id="cabezalPaginaEventos"></div> <div role="main" class="ui-content" data-role="content"> <ul id="listaNoticiaEventos" data-role="listview" data-inset="true" > </ul> </div><!-- /content --> <div class="miFooter" id="piePaginaEventos"></div> </div><!--
The dreaded "undefined"
Hello, I have built another to-do list using jQuery. It works exactly the way I want it to. However, there is a pesky little "undefined" word showing up in my output that is wrecking the app just by it's mere appearance. I have tried everything I know but can't seem to remove it. Will someone out there take a look and tell me what they think the culprit is and how to fix it? This didn't start happening until I added the remove code and fadeOut feature near the end of the JS and jQuery code.
Jquery Datepicker with online template
I'm using a template found at https://html5up.net/future-imperfect I'm trying to add in a a jquery DatePicker ( https://jqueryui.com/datepicker/ ) to this template. The template contains the following scripts declared <script src="../scripts/js/jquery.min.js"></script> <script src="../scripts/js/browser.min.js"></script> <script src="../scripts/js/breakpoints.min.js"></script> <script src="../scripts/js/util.js"></script> <script src="../scripts/js/main.js"></script>If i copy and paste the code for
Next Page