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
here document.write function is not working can anybody help me to fix this plz......
<!doctype html> <html lang="en"> <head> <script src="https://code.jquery.com/jquery-1.10.2.js"></script> </head> <body> <table> <tbody> </tbody> <script> $(document).ready(function(){ var arr = [ [2,3,4,5,6], [3,2,3,4,5] ]; $.each( arr, function(index,value) { document.write("<tr>"); $.each(value, function(key,value){ $( "tbody").append("<td>" + value + "</td>"); }); document.write("</tr>"); }); }); </script> </table> </body> </html>
jQuery Validation Plugin doesn't work with pretty URLs
Hi there clever people I seem to have encountered what I think is a bug with the JQuery Validation Plugin (from jqueryvalidation.org), though it could also be due to my own ineptitude in this area, so any help would be appreciated. When you type an invalid email address in the email field of a form using the jQuery Validation Plugin, and then move focus to another field, it is supposed to show an error under the email field. It works as expected when the URL looks like this in the browser: thanom.com/contact.php
Uncaught TypeError: $(...).modal is not a function
Hello Everyone, I am using jquery in react and i am facing this issue. My code is showFileUploadModal(roleType){ console.log(roleType); $('#fileUploadModal').modal('show'); } showFileUploadModal get triggers by a button. I put $ in watcher and i did not find any modal function there, what should i do? I am using jquery v3.2.1 how can i overcome this error?
setInterval with a function PARAMETER of global variable not working
https://jsfiddle.net/jsfiddle135/xpvt214o/956977/ Symptom: setInterval works fine with a global variable WITHOUT ANY parameter. But with a function parameter, the global variable is not passed as a function parameter. ------------------------- $(document).ready(function(){ var str; str=""; var num; function display(num){ // NOT WORKING function display(){ // Fine num++; str=str+num $("#textid").text(str); } setInterval(display, 1000, num); //
How to delete all text following an element?
Assume the following simplified code: <div class="aaa" ....> .... </div> sometext .... How can I delete all text following the element(s) with the class "aaa"? When I write $(".aaa"):nextAll().remove(); then the text is NOT referenced/removed since nextAll() resp remove() address only elements but not simple text. How else does this work? Peter
JQuery mask erases the last character of an input element masked to ip address
I am using the jquery.mask to format an input with ip address. See the code below: window.jQuery('.ip-component').mask('099.099.099.099'); The problem is that when I enter a ip address like this "010.230.230.6" (it's a valid ip address) and change focus to another element, the value of input element changes to "010.230.230", it erases the last character. I have the mask keep the value and check it as a valid value.
listen to Click event on dynamically added elements
I dynamically add some elements to an existing element, but I can't get the Click event to work on the dynamically added elements. I've worked with similarly scenarios before and using ON has always worked, but not now. Function: function SetStars(count) { console.log("SetStars (" + count + ")"); var $stars = $createWrap.find(".score-wrap > .stars"); $stars.empty(); for (let i = 1; i <= 5; i++) { let $elm = document.createElement("i"); $($elm).addClass("fa-star").addClass("star").addClass("clickable");
During an $.ajax call some data is lost
Hello, I have a form with a multiple select box. When I select more than one option and send the form via an ajax cal to a php file, only the last option will be saved. Why is that so? This is the AJAX call: var daten = $('#formulargesamt').serialize(); console.log(daten); $.ajax({ url: "/ajax/neukundenanlage/get_formular.php", data: daten, method: "POST", }); n the console.log prompt all data is there (as a string). However in the PHP file it is an array with only the last selected option. Does
jQuery Ajax Abort On Timeout - Strange Behaviour
Hi, I have been battling with a strange problem with the latest version of jQuery. When I run a $.ajax, and give a timeout, I can see the timeout value works in that chrome / firefox shows the xhr request as being cancelled after the timeout period. The problem I have is, subsequent ajax calls to the same domain, from that browser all get stuck in Pending state after the first one timed out. Running them in a seperate browser is fine. They only stick in pending in the original browser until I either
Differences in similar remove() calls
What's the difference in the following two lines? $c.find("script").remove(); and $c.remove("script"); ...where $c is a jQuery object representing a large div (there is a difference in behaviour)
Help/Review how to write modular Jquery code
I tried to write a modular Jquery code as this https://learn.jquery.com/code-organization/concepts/ said. Can anyone review my code and give me advises to improve it? Is there a better way to do the fetch operations than I am doing? Can I expose only the `init` methods as a public API? class SearchVenues { constructor() { this.categoriesSelector = $('#catgories'); this.distanceSelector = $('#venue-distance'); this.state = { category_ids: [], distance: null
Allow parent scrolling when using jquery ui .draggable()
Hi there! I have an annoying problem. I'm using jquery draggable on a set of divs and i'm restricting movement to the y-axis. My problem is that my parent div (using overflow-x:auto) cannot side scroll anymore. Do you have any ideas? Thanks. $(".openApp").draggable({axis:"y", drag: function(e, ui) { console.log(ui.position.top+" dd") if (ui.position.top > 0) { ui.position.top = 0
How to select/assign values to element in modal from calling page
In the index page, I have a div that serves as the modal container: <div class="modal" id="edit-document"> <div id="edit-document-container"></div> </div> On this page, I have a drop area that will accept files: <div id="fileUploadDropZone"> <input type="file" name="formlessUpload" id="formlessUpload" class="inputfile" multiple /> <p id="fds">Click/Drop Files Here</p> </div> And some CSS to make the area a drop area: #fileUploadDropZone { width: 100%; height:
Jquery sortable not giving current sorted positions
I am using jquery sortable lib. The problem I am having is that $(this).sortable('serialize') not giving the current item position after sorting it in UI. Can anyone look into this jsbin example and help me to figure out what is wrong? HTML <div class="wrapper"> <p id="foo_1"><div><span>foo</span>1000</div></p> <p id="foo_2"><div><span>foo</span>2000</div></p> <p id="foo_3"><div><span>foo</span>3000</div></p> <p id="foo_4"><div><span>foo</span>5000</div></p> </div JS $(function()
How do I implement jkeyboard?
I have an application that needs an on-screen keyboard. I found one here: http://javidan.github.io/jkeyboard/examples/index.htm I have a three implementation questions. 1. How do I implement a <Tab> key? I want to have more than one input field, and I want the <Tab> key on the keyboard to jump the focus between input fields. 2. Once the <Tab> key is in place, how do I get the plug-in to type into a given input field? For example, I have the following: <form action="/action_page.php"> SSID: <input
I cannot get my questionaire to execute a function when the wrong answer is chose.
When you click on the wrong answer and then hit next, the function does nothing, as it is supposed to either go to the next question or generate a wrong answer modal. Can someone please help and tell me where my code is wrong. $(document).ready(function() { $(".begin").click(function() { $("#main").hide(); return quiz(); }); function startOver() { location.reload(true); } function quiz() { var score = []; var questions = [{ q: "How many years did the original Twilight
grab selected table row data (skip first td element) before deleting
Hi all I am following some tutorials and working on this one right now : https://www.tutorialrepublic.com/codelab.php?topic=faq&file=jquery-append-and-remove-table-row-dynamically I would like to grab selected table row data (skip first td element) before deleting the selected row. $(".delete-row").click(function(){ $("table tbody").find('input[name="record"]').each(function(){ if($(this).is(":checked")){ $(this).parents("tr").remove();
Jquery UI Drag and Drop Issue
Hello, I have issue with jquery drag and drop. While dragging one element, two dropable area selected that I need to prevent it. How can I prevent it?
Next Page