a href link click does not open in new window
I modified an online example ( found here : http://jayblanchard.net/basics_of_jquery_ajax.html ) The idea is counting the number times people click on a link (the example is about a button click) I modified it and the count clicking works but no new page is opened. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Click Counter</title> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script type="text/javascript">
form validation
Hi regarding my problem, I post my code on jsfiddle, sorry for late answer. also I have another problem, can I post it? thank you, frankhttps://jsfiddle.net/cfrank65/wx963ytp/2/
jQuery with ajax and JSON not returning fields
I have a PHP program that has a jQuery on a page to run a function and return fields if record is found. I cheecked to make sure it has the: java script for: <script type="text/javascript" src="/websmart/v8.9/javascript/jquery.min.js"></script> and the javascript to run the funtion: <script> $(document).ready(function() { var select = $("#CCARDNO"); select.blur(valccmsn); }); function valccmsn() { $.ajax({ type: "POST", url:
How to define and use ajax URL
I am trying to create conditional URL for Ajax data pull, but it does not work. Any ideas why that is happening? My code looks like below. $("#valink").click(function () { $("#valink").removeClass("active"); var key = $(this).text(); $(this).addClass("active"); var currRoute = "../content-url/url.php"; if(key === "Books") { currRoute = "../content-url/url1.php"; } else { currRoute = "../content-url/url2.php"; } $.ajax({ type:
toggle
Hi, I have a hidden search form that I want to display when my search button is clicked, and closed when the close button is clicked. Here's a link to my site - REMOVED And my script - <script> $("#searchbutton").click(function(){ $(this).parents('#search-container').slideToggle('slow'); }); $(".close").click(function(){ $(this).parent('#search-container').slideToggle('slow'); }); </script> Hope someone can help..
How to change style values with a specific value
Start with a sample: <body> <div style="max-width: 900px; .....">....</div> <div style="max-width: 1020px; margin-left: auto; margin-right: auto; ....."> ... </div> .... </body>How can I change the value of max-width: 1020px to max-width: "95%" for all <div> elements? div panes with other (or no) max-width values should remain untouched. Furthermore only those div panes should be considered which are immediately below (=child) of <body> (=no deeper childs elements) How can I code this in jQuery?
Pre-selecting radio button based on database
I'm trying to find the code to pre-select a radio button based on the contact record. For example, we have a list of Major League Baseball playoff contenders and want to display a radio button list of National League playoff contenders: Los Angeles Dodgers St. Louis Cardinals Atlanta Braves I've mapped a variable to the database, called natLeagueFave. How can I set it up so that it selects the radio button? var natLeagueFave = <span class=dbrecord >Favorite Team</span> Form <input type="radio" class="custom-control-input"
Failed to upload file using jQuery ajax to targeted API
Hi, I am failed to send a POST request using jQuery Ajax via targeted API. Please find below code, When do a console, it straight go to failed condition. Please help. var fd = new FormData(); var files = $('#oltnpefile')[0].files[0]; fd.append('upload_file',files); console.log(files); $.ajax({ url: '/api/v1/olt/uploadfile/', type: 'POST', dataType : "json", data: fd, contentType: false, processData: false, success: function(response){ setTimeout(function(){ console.log(response);
Modal
<script> $(function(){ var appendthis = ("<div class='modal-overlay js-modal-close'></div>"); $('a[data-modal-id]').click(function(e) { e.preventDefault(); $("body").append(appendthis); $(".modal-overlay").fadeTo(500, 0.7); //$(".js-modalbox").fadeIn(500); var modalBox = $(this).attr('data-modal-id'); $('#'+modalBox).fadeIn($(this).data());
Consume php ajax POST call for registration
How to get all error responses like password dismatch or password not more than 6 chars. or email is invalid. My ajax: // process the form $('#employer').click(function(e) { // get the form data // there are many ways to get this data using jQuery (you can use the class or id also) //Personal account var image = $("#avatar").val(); var first_name = $('#first_name').val(); var last_name = $('#last_name').val(); var email = $('#email').val(); var password = $('#password').val();
delay keyup using ajax call
hi i need some help with delaying keyup on an ajax call. i have 4 input boxes within the html which generates a price - it's all working as it should be i cannot enter 10 for example as ajax is triggered to update the price as soon as i enter 1. this is my code. $("#ajaxform").bind('rightnow change keyup', function(e) { $.ajax({ type: "POST", url: "<?php echo ROOT; ?>ajax.php", data: $('#ajaxform').serialize(), success: function(html) { $("#ajaxresults").html(html).show();
Fixed nav-bar dissapearing after scroll up
Hi!I am having a problem which I don't know how to fix anymore.I have a nav-bar which i would like to make it fixed on scroll.I have the following code: <div class="nav-placeholder"></div> <nav class="nav-bar" role="navigation" > <div class="wrapper"> <div class="medium-down--hide"> {% comment %} List out your main-menu linklist (default) More info on linklists: - http://docs.shopify.com/themes/liquid-variables/linklists
Stop YouTube video playing when overlay is closed
I have a simple overlay which works fine but I've just added a YouTube embed to it and when you close the overlay, the video continues to play in the background. I'm hoping someone has an idea to stop this happen! The video pausing would be ideal but jumping back to the start is ok if that's too complicated. The (inherited) code looks like this: $('#size-guide a').click(function(e){ e.stopPropagation(); e.preventDefault(); $('.sizeguide-popup-container').addClass('reveal'); $('html,body').addClass('noscroll');
JQUERY didn't load the file
hi, everybody i'm new in jquery. <div id="show"></div> <script type="text/javascript" src="<?= base_url('assets/'); ?>js/jquery.js"></script> <script type="text/javascript"> // $(document).ready(function() { // setInterval(function() { // $('#show').load('data.php') // }, 1000); // }); </script> i've been working on my final project and i'm trying to get data from database in real time using jquery but it didn't work. here is the code: i'v tried open the data.php
Uncaught ReferenceError: $ is not defined when I export my subscribers list
Hi there, I have upgraded jQuery from 1.12 to version 3.3.1 and I`m getting the following error when I export my subscribers list. Uncaught ReferenceError: $ is not defined at ?page=export&tk=80aa620528864c2037ffc50ba119b2c2:516 The line where redirects the error is the following: echo '<script type="text/javascript">$("#exportdates").hide();</script>'; Could you please help me on that? Any light wold be very appreciated. Thanks!
Select elements inside of a form
I'm trying to select a div inside of a form. Quickly I can select the form using this first console line, left out wrapping elements for simplicity: console.log($(mythis).find('input.img1').next('form')); <input class="img1"> <form method="POST" id="custom_12_img1"> <div class="drop-field"> <img class="preview" src="#" alt="Preview Image"> </div> </form> ... other forms And when I try to select inside of the form, it says 0: $(mythis).find('.ffproedit').find('input.img1').next('form').find('drop-field'));
Run each function multiple times (until condition is meet)
I'm trying to do this: while (getStakeAmount() <= maxAmount){ $('#tabs-' + active + ' .connectedSortable').each(function () { // For each UL $(this).children().each(function () { // For each LI // Do stuff });//End li });//End UL } I'm trying to repeat the each function for all the UL's, as long as condition is not meet, but nothing happens and the browser gets locked. What can be wrong? On the other hand this works, but is only repeated once for each UL. That
code.jquery.com unavailable via IPv6
Hello jQuery users, developers, admins, it is 2019 and IPv6-enabled networks are common these days. Even networks without IPv4 (that is, only on IPv6) are starting to emerge. Still, code.jquery.com is IPv4-only, although the StackPath CDN should be able to enable the site with IPv6. For end-users on IPv6-only networks, code.jquery.com is unavailable, which results in broken user experience. What would it take to enable code.jquery.com (and possibly even other *.jquery.com domains) with IPv6? Will
Returning ajax results in the same order they are called
I have some elements I am looping through to get variables for ajax requests, but when I append the data to the page the results are in the order returned by the server not in the order I've requested them. This is my code: $('.playlist').each(function(videoPlaylistUrl) { var playListArtist = ($(videoPlaylistUrl).find('.rageArtist').html()); var playListTrack = ($(videoPlaylistUrl).find('.rageTrack').text()); var lastFmUrl = ( 'https://www.last.fm/music/' + playListArtist + '/_/'
Copy to Clipboard
HI, I've came across a topic where @jakecigar have responded with an answer (https://jsfiddle.net/jakecigar/dbzm58tn/11/). I'm currently using the code he gave but I can't seem to figure out having it to my liking. Here's the code that I've changed so far. <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> </head> <script> $(document).on('click', '.copy', function(e) { var serialized = $(this.form).serializeArray() var text = serialized.map(function(field)
jquery - load latest entry from database without page refresh
Hi, I have a shopping site which has orders table in the db. Orders are shown in admin. May I know how we can load any latest order from the database without refreshing the page? Thanks, Prem
mouse x position over canvas element toggles event
I can't figure out how to get the x coordinates of mouse position over a canvas element to fire en event example $("#div").fadeIn(); a simple example of how I'd like to use this function is if the mouse position is on the left of the canvas it fades a separate div in and then if the mouse is moved to the right side of the canvas element the div fades out. The canvas element is responsive and will resize with the browser I need the event to occur without any click event but rather on mouseOver
how to do a despedency dropdown with add rows
the data taken from the automatic condition dropdown appears based on the selected activity, such as in the activity selecting the hose then a condition that appears based on activity hose, well the problem is if I want to add the form to fill in the data above. help me: my code: $(document).ready(function() { $('select[name="activity[]"]').on('change', function() { var kode_detail_activity = $(this).val(); if(kode_detail_activity) { $.ajax({ url: '{{ url("penjualan_apar/get_kondisi") }}/'+kode_detail_activity,
Is there a way to expand a content inside a div but at the same time the div to move upwards?
Hello everyone, I only have basic html and css knowledge. I am wondering if you can help me with a code? I think it requires jquery and javascript? I saw on this website https://www.autodesk.com/ three black color divs that are expanding but in the same time they are doing a translation movement? What I could get from inspecting the code source is function() { if (parseInt($($(this).find(".wp-expanded-content")).css("height")) > 1) {closeCollection(this); } else { expandCollection(this); }} And there
using Jquery to download a forum page
I notice that when I access a forum full of posts from several years, the forum page downloads in an intelligent way. I can view the most recent posts, but if I keep hitting the PAGE-DOWN key, then the browser sends a message to the server to download more. This is probably done somehow with Ajax. It appears seamless to the user, there is just a small delay and a group of older posts are added to the bottom of the existing page visible in the browser. The main clue that something is happening
Cannot get input val() when inside element with css display:none
I am submitting a form with ajax and have a one input field inside div with css display:none for catching spambots but for some reason I can't get the value of the input inside an container with display:none ??? $("#submit_btn").click(function(e) { e.preventDefault(); //get input field values var dummy_field = $('input[name=dummy]').val(); var user_name = $('input[name=name]').val(); var user_email = $('input[name=email]').val(); var user_phone = $('input[name=phone]').val();
Changing hidden field based on select box selection
We have the following: Select field called "favePet" Hidden field called "petRefCode" Because we have no control over the server, we have to do this on the front end. We need to send a certain "petRefCode" based on the favorite pet selection: favePet is Dog, then petRefCode is 'domestic01' favePet is Cat, then petRefCode is 'domestic01' favePet is Hamster, then petRefCode is 'domestic02' favePet is Parrot, then petRefCode is 'domestic02' favePet is Spider, then petRefCode is 'domestic03' favePet
$ Variable in this code
http://jsfiddle.net/TLdp9/6/ In this code, line 4. What's the $ about? When I run the code I get this error "Uncaught ReferenceError: $ is not defined"
Help with a simple lookup page
I am new to this type of coding after nearly 10 years of Autohotkey, and have tasked myself with an online Karaoke book lookup, that will work on a phone, I have the basics working fine, but have a question or two, 1. Can a csv file be searched, without being loaded into a table first, just display any search hits in a table? (the file i am searching is book.txt) and my delimiter is ^ 2. I am using a load Songlist button to force DB refresh whenever i load the page, Does this make sense? Working
Image not open at bigger size on mouse hover
Hi, I placed one small image on right bottom of my website. Once user mouse hover the image it opens or expand the image as original size in same place.It should hide the small image and shows the bigger image(original image) on that place. My code worked for placing small code initially. after hover the image, the bigger image not opened properly. have some issues. Kindly help this for solving this issue using javascript or jquery or CSS. <div class="bcFloat" style="display: block; left: 933.12px;
Problem in selecting li
<ul> <li><a href="#">Books</a> <ul> <li><a href="#">New Books</a></li> <li><a href="#">Old Books (2017)</a></li> </ul> </li> </ul> When I am trying to access 'Books' . Jquery is also giving me 'New Books' and 'Old Books (2017)' js code is.. var li = $("ul :last-child").find('a').text(); alert(li); Please help...
jquery writes a double-click to a variable
I have such a problem, I have a code, and in this whole program the idea is for him to perform some action under the condition of what will happen in the result variable and he performs this action but I will double on this button. Code js function edit_drugs (url, idDrugs, i, url2, url3) { $ ("# EditDrugs" + i) .load (url + "? IdDrugs =" + idDrugs); $ ("# updateDrugs" + i) .html ("<input type = 'button' class = 'btn btn-success' onclick = update_drugs ('" + url2 + "'," + idDrugs
Counting the selectedCell class
I'm trying to count the number of selected cells with class="selectedCell" for each row in the following code. $(function(){ var output = $('table').find('td.selectedCell').length + ' selected cells'; $(".tdoutput").html(output); }); I have a working example here, but the count shows the same for each row, and instead it shows the total count for the table. http://jsfiddle.net/tbeup691/
Changing db data with representative values with jquery
I have a simple table. <table class="tb"> <tr><th>ColA</th><th>ColB</th><th>ColC</th></tr> <tr><td>10</td><td>12,3</td><td>24,5</td></tr> <tr><td>40,4</td><td> </td><td>5,5</td></tr> </table> I would like to change the original mysql data with representative values that I assign to them. So if there is a value in the first column, then they are all replaced with 1, if there is a value in column 2, then it is replaced with 2, if not, it is left blank, and it goes on like this. Would it be possible
Highlighting between two data points on a scale
I have a php generated scale table from 1 to 14. I highlight the min and max values given by the checkbox form on the table with the following jquery code. This is the jquery code I'm using to highlight two points on the scale table. $("#checkAll").click(function() { $('input:checkbox').not(this).prop('checked', this.checked) .trigger("change"); }); $(".selector").on("change", function() { var parent = $(this).closest("form"); $("#" + parent.data("checktable")) .find('[dbval="' + this.name
question on using textarea events
hello - i want to use an event when a textarea has changed, but only actually respond AFTER the user appears to be completed. the best i have come up with is something like this: flag = null; // define input response flag jQuery('input[name=textAreaField]').on('change input', () => { flag = true; // set input response flag }) jQuery('input[name=textAreaField]').on('mouseleave', () => { if ( flag ) { flag = false; // reset input response flag
Setting a cookie with JavaScript which expires after 24 hours
How do I run this function, so that the cookie expires in 24 hours? function createCookie(name,value,days) { if (days) { var date = new Date(); date.setTime(date.getTime()+(days*24*60*60*1000)); var expires = "; expires="+date.toGMTString(); } else var expires = ""; document.cookie = name+"="+value+expires+"; path=/"; } Thanks
Jquery UI autocomplete on dynamic fields
Kindly have a look at this screen capture. http://www.screencast.com/t/GMGBy6QF9bP as i have shown i am trying to use jquery ui autocomplete on a dynamically generated fields, autocomplete works fine with the main field i'm using to copy & generate dynamic fields. but when adds a new field the autocomplete not working with the newly generated field. this is my autocomplete code $(function(){ $(".get-tasks").autocomplete({ source: baseurl+"job/job/get_tasks_autocomp", }); }); I would like to
Is there no shorter/smarter way to add/overwrite CSS statements than with "css(....,....)" command?
Occasionally I want to add/modify CSS statements of the currently loaded webpage. Lets say I want to add/overwrite the current CSS values with the following new CSS values: #container article > p { font-size: 16px !important; line-height: 16px !important; font-family: Verdana !important; width: 98% !important; } As far as I know users have to write therefore in jQuery a difficult, non-intuitive, multiple tags command similar to $('#container article > p').css({ "font-size" : "16px", "line-height"
ajax by multiple row
hi , sorry for english , i use thi example https://bootsnipp.com/snippets/402bQ and i create my own code https://jsfiddle.net/xpwh1oc5/ I have two answer : 1 if i change code with [value] the ajax dont work : <label class='col-lg-3 control-label'>Inserisci nome dropbox</label> <input type="text" id="ricerca_codice_lavorazione[0]" style="color: black"> <button type="button" id="button_ricerca_lavorazione[0]" class="btn btn-info">Ricerca Codice</button>and ajax too
Next Page