AJAX .get() method - success and error functions
My understanding of calling the AJAX .get() method and declaring both a "success" method and an "error" method tells jquery to call the "success" method on a successful call and "error" if the method fails. Yet, when I call .get() in my source javascript file, BOTH methods are called every time. Am I reading the documentation wrong. For documentation I was looking at: https://www.w3schools.com/jquery/ajax_ajax.asp Jim A.
jQuery for loop doesn't iterate
In my script: $(function() { var j; for (j = 1; j <= 3; j++) { $('#' + 'clickMe' + j).click(function() { $('#' + 'showMe' + j).toggle(); }); } }); In my HTML: <table><tr> <td><div id="clickMe1">100 cal tiles</div></td> <td><div id="clickMe2">200 cal tiles</div></td> <td><div id="clickMe3">300 cal tiles</div></td> <td><div id="clickMe4">400 cal tiles</div></td> </tr> </table> <div id="showMe1" style="display: none;">lorem ipsum</div> <div id="showMe2" style="display: none;">lorem ipsum</div>
Smooth scroll working AND not working
I have a page with two identical on-page links... one at the top of the page and one at the bottom of the page. Smooth scrolling works with the top link, but not the bottom link. Any ideas what I'm missing? Here's the fiddle link: http://jsfiddle.net/Codewalker/6or8pwjx/62/ And the code: <section class="section" id="head"> <div class="container"> <h2>CTA</h2> <div> Leverage agile frameworks to provide a robust synopsis for high level overviews. Iterative approaches to corporate strategy
sweetalert2
I have Swal({ toast: true, title: 'Added to shopping bag', icon: 'success', animation: false, position: 'center', showConfirmButton: false, timer: 3000, timerProgressBar: true, didOpen: (toast) => { toast.addEventListener('mouseenter', Swal.stopTimer) toast.addEventListener('mouseleave', Swal.resumeTimer) } }) But it isn't showing the Icon or the moving bar at the bottom. Any idea what is wrong please or missing? The message shows ok and vanishes
should we declare var in side $.each or loops or immedialy above them
hi, I heard that variables must be declared above the loop to avoid the declaration cost specially in sql server. so here in jquery i noticed people declaring variables in side the loop lik e$.each or foreach loops . q1) is it good practice? yours sincerely
Ajax post does not work on mobile
Hello, I am creating a filter for my website with ajax and it works correctly from the computer. But when I enter from any mobile (android, ios, etc) it does not show the results. The code I use is as follows: jQuery version: v3.3.1 <script> $(document).ready(function(){ filter_data(); function filter_data() { $('.filter_data').html('<div class="spinner-border" role="status"></div>'); var action = 'fetch_data'; var categoria = get_filter('categoria');
How to wrap a simple "https://......" string with <a href="https://.....">....</a>?
Assume a webpage contains Internet URLs as usual similar to "http://www.foobar.cm/sample.html" But some of them are NOT included in a wrapping <a href="https://.....>.....</a>" How can I (with jQuery) add this <a ...>....</a> tag? for all such https://...... strings? Of cause if the https://.... string is already wrapped no second <a> tag should be added.
Select first option
<select id="size" name="size" <?php if(empty($edit_item[0]->size)){ echo "disabled readonly"; } ?>> <option value="">--Select--</option> </select How do I select the first option using jquery $("#size").val($("#size option:first").val()); Isn't working $('[name="size"]').val(''); Doesn't either Nothing I have tried works Thanks
images upload/download speed
I have html page that enable the user to upload images to server and show them right after the upload. The upload goes pretty fast but when I set images src (right after the upload ends) to the uploaded images it takes some time. Is there a better/quicker way to upload images (more than one) and view them on the page right after the upload ? I thought about something like accumulate imagee to browser cache while uploading..., not sure if its possible.
Hiding text input placeholder that has two styles when input field is entered
I have a form with a placeholder that contains two styles. On keyup, the placeholder text will disappear, but how can I make it disappear when the user enters the text input field, either by tabbing into the field or by clicking into the field? Here's what I have. I included a Fiddle as well: <div class="container test"> <div class="row"> <div class="col-sm-12"> <div class="placeholder-above"></div> <div class="guitar-service-address"> <span class="placeholder-location"><span
Does jQuery Migrate eliminate jQuery XSS vulnerabilities?
I read the website below saying that jQuery Migrate restores the deprecated methods which older jQuery has. https://github.com/jquery/jquery-migrate Does jQuery Migrate eliminate jQuery XSS vulnerabilities while restoring them? For the countermeasure of XSS vulnerabilities, I need to upgrade the version from 1.11.3 to 3.5.1. If jQuery Migrate eliminates the XSS vulnerabilities, I do not need to fix deprecated methods and what I need to do is just set CDNs of jQuery and jQuery Migrate. It would be
How to prevent popup when moving mouse to north over the Firefox bookmark toolbar?
Lets start with a sample webpage (from a german newsmagazine): https://www.fool.de/2020/12/26/trotz-covid-19-impfstoff-warum-auch-2021-noch-ganz-im-zeichen-von-corona-stehen-koennte/ Immediately before and during loading of the web page leave the mouse INSIDE the (Firefox) browser window. Then after successful loading move the mouse to north over bookmark toolbar. As you can see a popup (inside the webpage and not as separate Windows window) appears. How can I prevent this popup? I tried $('.sandiego-c-canvas.Campaign__canvas').hide();
Close dialog box and maintain scroll position
When I close my dialog box it scrolls to the top. How can I close it and maintain the scroll position? $("#dialog-container").dialog({ title: "MyTitle", width: 'auto', height: 'auto', modal: true, open: function () { jQuery('.ui-widget-overlay').bind('click', function () { jQuery('#dialog-container').dialog('close'); }); }
How to find and replace "style=" and width="...." values in HTML code (NOT CSS stylesheet)?
Assume I have a code like <div ..... style=".... width: 780px;">...</div> <rect ...... width="780px" ....">...</rect> So the width values are NOT retrieved from separate CSS stylesheet (file) but are part of a HTML code. How can I identify these elements by jQuery and change/overwrite the values to e.g. a width of lets say 400px?
drag and resize-problem with embedded dialog
hi i intend to establish a window-like layout using jquey dialog. A dialog can by appended to a another dialog, with the option appenTo. here my code: $(function(){ $('<div id=desktop >desktop<br>desktop<br>desktop<br>desktop<br>desktop<br>desktop<br>desktop<br>desktop<br>desktop<br></div>').dialog() $('<div id=child>child<br>child<br>child<br>child<br></div>').dialog({appendTo:"#desktop"}) }); Example It works almoust as expected, but i encouter a problem: the childdialog is not draggable nor
Select2 - make color for combobox
Hi After selection element in Select2 i send data to server and check if its ok! After check if result ok i want to make green border for combobox. How its possible to do? Thanks a lot https://jsfiddle.net/urtdr/epjsf3vx/11/
How to get end date from start date and leave days based on condition using jQuery datapicker
I am using JQuery-ui datepicker in Leave Management Project. This is what I have: Controller public function findNationalHoliday(Request $request) { $nationalholidays = HrNationalHoliday::select('holiday_date')->whereYear('created_at', '=', date('Y'))->get(); return response()->json([ 'nationalholidays' => $nationalholidays, ]); } holiday_days comes like this in the console: 0:
holiday_date: "2020-08-25 00:00:00"
__proto__:
How do you log on to Jquery
I can't just log on to Jquery. I don't know how I am getting on now but I don't log in and have to go through a lot of mysterious crap with Zen or whoever. R
append() outside or prependTo().next() ?
Assume the following html code: <table class="foobar">...</table> <script>....</script> <script>....</script> <script>....</script> <p>.....</p> Now I want to insert some stuff AFTER table which can be identified by its class. The two methods I considered do not work: 1. $(".foobar").append("......"); appends something INSIDE the <table>...</table> element but I want it outside 2. $("......").prependTo($(".foobar").next()); does not work either. a pre-grouping of $(".foobar").next() in an enclosing
How to simplify <figure><picture><source><img> combination?
In recent months I experienced more and more webpages which embed pictures not as simple images any more but as a nested element combination with a code like: <div> <figure> <picture> <source>...</source> <source>....</source> </picture> </figure> </div> Have a look at the sample web page https://www.makeuseof.com/tag/3-ways-to-reset-the-forgotten-windows-administrator-password/ Right click in chapter 1 on the big picture and select "Inspect element" The nested code above results in further problems
Why dataType: "text" doesn't bypass cors like "jsonp"
Situation: With the script below to get text string from a small hardware device over wifi. The device is configured as a wifi AP & does not respond to browser request, it just updates its web data every second. I can see the data string with ip address in web page(refresh = new data) & a script tag will receive as valid data. <script type="text/javascript" src="http://192.168.4.1"> </script> The text string is structured as multi line JS variables & is valid json. Problem is I need to use type:
Can't get on-the-fly select box to work
If you look at source code produced in web developer tools you see the following, however, it is all in one long string. It never shows up on the screen. Don't know how to fix. Help. <h2>Pick A Database to Restore.</h2>
<form id='frm1' action='' method='post'> <select id='mySelect' name='DBase'> <option value=''>Select...</option> <option value='1'>2020Oct14-14:40:24_accounts.sql</option> <option value='2'>2020Oct16-09:36:26_accounts.sql</option> <option value='3'>2020Sep18-13:31:43_accounts.sql</option>
How to remove whitespace after/inside <div>?
Assume the following code: <div class="foobar"> "whitespace" <p>....</p> </div> "whitespace" is not the text but a whitespace as indicated in Firefox WebDeveloper. How can I get rid of every whitespace inside after a <div class=foobar"> and the first <p> with jQuery?
Shorter command for search innermost element which contains certain string?
<div class="one">.... .... <div class="two">.... ... <div class="three">..... <p> <strong> blah foobar other text </strong> .... </p> </div> ....</div> ....</div> I am searching for a shorter (!) way to delete (resp.refer to) the innermost, nested <div> element which contains directly or indirectly in (sub)child elements the string "foobar". It the sample above only <div> element with class="three" should be removed. Currently I am using the following command: $("div:contains('foobar')").eq(($("div:contains('foobar')").length)
How to assign an inline style attribute to an element?
Assume the following code: <div class="foobar">.....</div> with CSS: .foobar { background: blue !important; } Now when I assign a new color with a jQuery statement like $(".foobar").css({'background-color' : 'red'}); then the previous color is NOT overwritten since it has an "!important" flag. In order to overwrite it anyway I have to assign the new value as inline style just as if would have written <div class="foobar" style="background:red">.....</div> This coding has higher priority as "!important".
The jQuery UI site crashed.
The jQuery UI site crashed. When I open the download page, I click the Download button at the bottom. I don't know how to tell the site developers. https://download.jqueryui.com/download
Upgrade jQuery UI from 1.8.8 to 1.12.1
Hi, I'm currently working on a project with a huge amount of legacy code and I need to upgrade the jQuery UI library to the latest version due to some security issues. I've already read some of the upgrade guides ( https://jqueryui.com/upgrade-guide/ ) but it's still not clear to me the strategy to follow. Should I update versions sequentially and fix any possible issues that I might find for each individual upgrade? If so, how can I be sure about what should be changed? Each upgrade guide contains
How to populate an input text field attribute
We have a form that includes the following checkbox: <input type="checkbox" name="status" id="fee" data-subscription=""> I'm trying to write a script that inserts a value into data-subscription. Here's what I have so far, but it's not populating the data-subscription value. if (globally == true) { $('input[name="status"]').attr("data-subscription","false") } else { $('input[name="status"]').attr("data-subscription","true") }
Auto Complete not working
Dear Sir Pls refer http://webvikas.net.in/familytree/indexadmin.php I am unable to search and i checked debugg console no error is displayed my coding <script type="text/javascript"> $(document).ready(function() { $('#searchid').change(function(){ //fire your ajax call var id = $('#searchid').val(); window.open('https://adventchembio.com/msds.php?id=&&product='+id); }); $(function() { $("#searchname").autocomplete({ source: "marathesearchfill.php", minLength: 2, select: function(event,
How to remove all following elements even on higher levels? nextAll() up to root?
Assume I identified a certain element. Now I want to remove ALL following elements. I can do this with $(".foobar"):nextAll().remove(); The problem is, that this removes only elements on the same hierarchy level (=brothers). Ok, I could go one step upwards: $(".foobar"):parent().nextAll().remove(); But maybe there a many (unknown) parents() of parents(). I want to get rid of all the stuff which follows the referred element regardless of the hierarchy level. How can I achieve this? Peter
replace <video> elements by <img> element?
This is the original source <video .....> .... </video> How can I replace all such <video> elements by a picture from remote server <img href="https://www.foobar.com/pics/mypic.png" ........</img> Peter
parseXML adding line break
Im' trying to do a similar thing like this: https://jsfiddle.net/xt420oj1/ The result ends up like this: <?xml version="1.0" encoding="utf-8"?><root><obj someAttr="100500">some text</obj></root> But what I really want is having line breaks like this: <?xml version="1.0" encoding="utf-8"?> <root> <obj someAttr="100500">some text</obj> </root> Is that achievable? If so, how can it be done?
How can I prevent "enter" after on change
Hi people, I have a input with a "on change" and a delete button with "on click" in one row. When the user try to enter in the input the delete button will activate. How can I prevent this?
Assign jQuery Element to Javascript variable?
Normally I would write a pure Javascript statement like: var pane = document.getElementsByClassName("myclassname222")[0]; But what if jQuery offers a shorter way of identification? How can I assign an element from jQuery to Javascript variable? The following does NOT work: var pane = $("td:contains('sometext inside element')"); How else? Peter
remove previous element only if it is of type <hr>?
Starting with <hr> <div class="aaa">...</div> ... <p> <div class="aaa">...</div> I want to remove the previous element of <div class="aaa"> elements but ONLY if it is a <hr> element $("div.aaa").prev().remove(); removes them all. How can specify only <hr>-removals?
Remove whole table when inside a class is matched?
At first the code: <table> <tbody> <tr> <td > <div class="foobar">....</div> ...</td> </tr> </tbody> </table> When a table contains a certain class the whole table should be removed. The following does NOT work: $("table .foobar").remove(); How else?
How to remove following simple text without enclosing element?
Assume the following code <p class="firstclass">.....</p> foobar some text <p class="secondclass">.....</p> some other text Now when I apply $(".firstclass").nextAll().remove(); then the text following the <p>firstclass element is NOT removed since it is not enclosed in an element. As I learned nextAll() fetches only elements. How can I otherwise remove ALL following stuff after <p> firstclass? Peter
Getting the text value of all child elements
I have this html: <div id="codes"> <div><a href="#"></a><span>bla</span></div> <div><a href="#"></a><span>bla2</span></div> <div><a href="#"></a><span>bla3</span></div> </div>How can i get the value of all those child spans? Thank you in advance.
How to delete whole "@media print { ...}" CSS instructions?
Oftentimes web pages include a separate *.css file and put separate special CSS instructions inside for printing the article. How can I delete with jQuery this @media print { ............. } rule / instruction? Peter
Does order by is preserved by $.each()
q1) I have sorted the "var dd" first then I have iterated using "each", does the order in dd is followed by "each" or it can change the order in any case? q2) do all the loops honour the sort order? q3) if I declare the "var dd" as global var and sort it, then will it preserver the order inside the "var dd" all the time or is there any case where it can change? q4) when we get data ordered from database using ajax function of jquery, is the data remains ordered or it can change in any case? <script>
Next Page