jQuery, Accelerated Mobile Pages and Bootstrap
Any ideas on supporting a responsive web site using Bootstrap and jQuery, while also supporting the new format for accelerated mobile pages? We run a travel business with 10,000+ pages and I would like to prevent having to create a separate AMP enabled page for every page - and ensuring we have the canonical reference to the non-AMP page. This would be a lot of work for us. From my research of AMP, we would be stripping out a lot of the whiz-bang cool UI features on our site that make it appealing
How to check an external website for a link to my website
Hi all, I'm very new to jQuery but want to use it to perform a specific task. I'm looking for some code that will enable me to enter a url and check that url for a link back to my website. If it exists then if gives a true message and if doesn't it gives a false message. I have been looking on the internet for some guidance but struggling to find anything that will work for links. Can anyone here help? Thanks Chris
Disable toggle when click on input
I have have a toogle function that is triggered when clicking a row, but when clicking on the input field inside the row I don't want the toggle function to react on that. Is there a way I could make an exception for the toggle when clicking the input, or as an alternative on the cell holding the input?
Save a toogle state to Local Storage
How do I save the toogle state of a row to Local Storage? https://jsfiddle.net/oh2pswk1/3/ So when opening the page again it will have the same rows higlighted.
Find next <p>" element above "<iframe>" element?
Assume I want to find and hide the next "<p>" element above each "<iframe>" element. Example: <p> sometext ...<p> somesubtext <iframe width="400" ....> ...</iframe> </p> other text .... <p> When the target search filter is not an element but a text I could write: $("p:contains('somesubtext')").eq(($("p:contains('somesubtext')").length) - 1).css("display", "none"); This is working fine. However what if I want to search for an element <iframe> (possibly with an attribute filter). then the following
What does issue 11290 mean to the security of my website
Hello, I know ticket 11290 is very old and fixed a long time ago. Thanks for that. I plan to upgrade my jQuery as fast as I can. Using the Retire.js Chrome plugin I get a warning that the jQuery 1.8.3 I included is vulnerable to 'Selector interpreted as HTML' 1) Do I need to be using a special selector feature of jQuery like using a < in my selector for this bug to be a security issue ? 2) Should I be worried about the overall security of my website ? (I have a website that is only accessible via
How to stop Jquery .show from stopping mid slide animation?
I created a DIV that contains an image that is roughly 3100x5400 (4.5MB). The structure looks like this: <div class="sideContent" value="right"> <span class="closeIcon" onclick="closeSlide()" aria-hidden="true">×</span> <div class="container"> <div id="aboutRow" class="row"> <div class="col-md-6" style="height:100%"> <img id="aboutMeImage" src="Images/JPG/_P7J4523.jpg"> </div> <div class="col-md-6" style="height:100%"> <div id="aboutContent"> <h1> Biography </h1> <p></p> <h1> Stats </h1> <p></p>
How to add a span inside a label using jQuery
How can I add a span inside a label using jQuery? Before: <label for="edit-pass" class="abel-floated">Password</label> After: <label for="edit-pass" class="abel-floated"><span>Some Hint</span>Password</label> Thanks
on focusout for radio/checkboxes
I'm trying to fire a focusout after clicking away from radio & checkbox input. Here's typ. html: <form class="cd-form"> <div> <ul class="cd-form-list"> <li> <input type="radio" ...> </input> </li> <li> ... </ul> </div> ... other input elements </form> Here's the jquery I'm trying to use, as input is a child of the ul : $('form.cd-form ul.cd-form-list').on('focusout', function() { console.log('Focusout occured'); }); I'm not getting console log
JQuery Autocomplete:Issue with getting HTML Element Id.
Hi All, I am using Jquery Autocomplete in .net project.I do have three dropdownlist and they are using same piece of code .I want to call a function in Change() event only for a particular drop down list.So how to know which element is in running state, means i want to know the id of "this" element, so that i can differentiate between the dropdownlist. The highlighted is the code which I am trying.I need to call SelectJournalName("0"); if ddlJournalList has null value.so i know half code just need
Dynamic Form creation not working
Hi, I've been trying to create a form by appending to <div id='what'> with no success. The form displays fine including data values but the submit does not display the alert() message. My goal is to view the data returned, change the data if desired, and send the changed data thru AJAX to update my MySql database. function showReturn(data) { // <========= data is returned from AJAX. $("#results").hide(); // hide previous $("#what").show(); // show current $("#what").append("<form method='post'
How do I get my unordered list items counter to work in jquery?
Hello there!! I created a to do list with a delete button on the right side of each list item. When you type an entry it goes into the ul tag listing everything. How do I get the " counter " of my unordered list items to dynamically reflect both added and deleted items from my " to do list "? I basically need a numeric value displayed in my id called " counter ". I have been working on this for a few days and I just do not know what to do. Maybe there is something I am over looking that is so
find text position in an element
The following is for a complicated application I'm writing. I don't expect the first question can be answered, but why not try: 1) Suppose I have an element such as ARTICLE with an id such as "myArticle". If the user clicks his mouse inside that element, I can find the position of the mouse (using .offset or something like that), but is there a way to find the text offset? I don't see how there could be, unless the text letters were all the same width, (as in Courier font) and only if I knew there
New Modeless Window based on contents
Hi, I have a requirement to open a new mode-less window based on its contents. That means window should be resizable. We can not give the definite size to window. So how to provide size to the window dynamically using Jquery/Javascript/AJAX? Please provide solution ASAP. Thanks, Smita
jQuery not working with WordPress
I’m moving a site over to wordpress and cannot get the dot navigation on the right hand side to work (see: http://s593006646.websitehome.co.uk ). The .js file is below. I believe there is an issue with lines 2-4 but beyond that I've no idea where to turn. Any help is much appreciated! jQuery(document).ready(function(){ jQuery('.awesome-tooltip').tooltip({ placement: 'left' }); jQuery(window).bind('scroll',function(e){ dotnavigation(); }); function dotnavigation(){
Too easy but failed - get the top position of each td after AJAX response
Just give me a little hint how can I get alert('top=='+evto); [index.php]--------------------------------------------------- <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Loop through an array using jQuery</title> <script src="https://code.jquery.com/jquery-2.2.3.js"></script> <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <script type="text/javascript"> $(document).ready(function () { var dataj ={'ss':'ss',
jQuery responsive menu options (example included)
I want to have a menu similar to the one this site has http://eng.getlost-getnatural.ru/, is there anything that jQuery has to get a menu that is first 3 dashed lines and then when clicked turns into an "x" and is showed as an overlay above the page?
Does jQuery have something that can achieve full page scrolling effect (example included)
Is there anything (a plugin would be ideal but am open to anything if jQuery offers something that will help to get that effect) that jQuery provides that would help to achieve an effect similar to that of this website (how the page seems to scroll/jump to a new page when the user scrolls down) http://eng.getlost-getnatural.ru/.
not getting full string of attribute using IE and SharePoint
I am having trouble getting the full string of an attribute when using IE to use jQuery in a 2010 sharePoint site. fiddle: https://jsfiddle.net/vhabhsrosed/cox10emu/ attribute = "action" in the following. In jsfiddle it's ok but on my works website it only brings back the following: docsethomepage.aspx?ID=71485&List=b0068804-01a5-41a6-953f-b3d3e75b3619&FolderCTID=0x0120D5200022E7569C62963E469B62F73D4190A3B0080400D01D5D9D296D7B459DAB318E3E054F9C&RootFolder=%2Fsites%2Flocalresearch%2FPhoenix%2FProjectManagement%2FInitial%20Others%20PHX%20adfas
How to create a function for this code?
Hi, My code looks like this: var firstInput = $('#user-login-form :input:enabled:visible:first'); firstInput.focus(); firstInput.addClass('dirty'); firstInput.prev('label').addClass('dirty'); $('.js-signInButton').click(function(e){ e.preventDefault(); $('#edit-email').focus(); var firstInput = $('#user-login-form :input:enabled:visible:first'); firstInput.focus(); firstInput.addClass('dirty'); firstInput.prev('label').addClass('dirty');
Need help extracting values from several lists
Given the following html, how would I get the numbers in parenthesis into an array? So I'd like my array to be {404493,404504} <div class="current-config popup-panel featherlight-inner" > <div class="dyn-conf-content"> <h3 class="left-align production-color">Current Configuration</h3> <p class="dimensions cc-highlight"> <span class="config-label">W × D × H</span> <span class="dim-inches">32.9" × 34.6" × 48.4"</span><br> <span class="dim-metric">836mm
Using jQuery, Please provide code that will remove placeholders:
<divclass="class-replace"> <p> <a href="http://[SITE].com">[NAME]</a>©[START]-[CURRENT].All rights reserved </p> </div> And replace it with content on page load: <divclass="copyright"> <p> <a href="http://foobar.com">FOObar</a>©2011-2013. All rights reserved </p> </div>
Same code run for document ready and multiple event
I have a code which will run when document ready and some event occurs. In this case I use same code multiple time. But I want to know that, is there any other way to use my code one time and code will run when document ready and event occur. I have also another question that is it possible to run code when any changes come into document. Here is my code. $( document ).ready(function() { var main_content = $(".main_content").outerHeight(); var sidebar = $(".sidebar").outerHeight();
Not Able to Access Data in a Complex JSON Format
Can you please take a look at This Demo and let me know why I am not able to access to data in detail option of the JSON? what I would like to do is loading the firstName , lastName, and ageinto the list for each object. var data = { "events": [{ "date": "one", "event": "", "info": "Copenhagen", "detail": [{ "firstName": "Sally", "lastName": "Green", "age": 27 }] }, { "date": "two", "event": "", "info": "Copenhagen", "detail": [{ "firstName": "Sally", "lastName": "Green", "age": 27 }] }, { "date":
Append a jQuery variable to a event click function
I have a script that processes some Json data to produce a graph using HighCharts. The Json data has three elements: [{"name":"Room","data":[343,405,406,407]}, {"name":"Temp C","data":[50,50,50,50]}, {"name":"UniqueID","data": ["GLAZH03431464336298","GLAZH04051465483111","GLAZH04061464783558","GLAZH04071465484869"]}]In my script I have the following: $(document).ready(function() { $.getJSON("temp_chart.php", function(json) { $.each(json,function(i,el) { if (el.name=="Room") categories = el.data;
How to remove one image file from input file multiple JavaScript
i have five input type file to choice image for upload,but when i click remove one image all image was delete,i just want to delete one image that i click <body> <table> <tr> <td> <img id="uploadPreview1" src="no_image.jpg" /><br /> <input id="uploadImage1" type="file" name="p1" onchange="PreviewImage(1);" /> <a href="" onClick="delete(1)">Remove</a> </td> <td> <img id="uploadPreview2" src="no_image.jpg" /><br /> <input id="uploadImage2" type="file"
How to make AJAX calls - Elgg
I'm trying to make an AJAX call in elgg, but I've been unsuccessful so far. What could I be doing wrong, or what am I missing? Thank you all in advance. Elgg version 2.1.1 start.php // in myplugin_init()
elgg_register_ajax_view('forms/myplugin/add'); default/forms/myplugin/add.php <div>Successful AJAX call</div> default/object/my_ajax_plugin.php <div class="myplugin-form-container">JQ Here</div>
<script type = "text/javascript" language = "javascript"> var Ajax = require('elgg/Ajax'); var ajax =
Jquery zoom on cycle?
Hi guys, I have a web page, on this web page I have couple of images. When user clicks on the image, image disappears and the UL tag displays. (I am using this plugin http://jquery.malsup.com/cycle/) Here is the HTML: <div id="right4" class="pics"> <img class="img-center" src="images/smart-agriculture1.png" width="168" height="168" alt="Akıllı Tarım"/> <ul class="solutions-ul"> <li lang="tr"> <i class="fa fa-caret-right"></i> Gübreleme </li> <li lang="tr">
Trouble selecting element's children in class .click() handler.
I'm running into some trouble trying to toggle the items in a list that are children of the div which was clicked. When clicked, some of the divs show/hide just their children, while others show/hide a strange combination of all divs in the 'collapse-trigger' class. https://dpaste.de/62tF
How do I detect where in the webpage a user clicks?
There is a website I found (see: http://genius.com/web-annotator) that can tell where in a webpage the user has clicked. For instance, if you have a poem in your webpage: Now listen to what the good book says And it made good sense to me Talking about reaping what you're sowing And people trying to be free And you don't know what "good book" means, then you can click on it. and 'genius.com' knows that you've clicked on it (or highlighted it). How would you do this with Jquery? I could see using
Sortable not working in IE11
Hi there, i have a problem with a draggable table of mine. I want to be able to drag the <tr>s. Everything works fine on Chrome but IE11 gives me the error Object does not support the property or method "sortable" Basically the html looks like this <table class="standardTable" id="agendaPreviewTable"> <thead id="agendaPreviewHead">....</thead> <tbody id="agendaPreviewBody" class="ui-sortable"> <tr class="ui-sortable-handle" style="display: table-row;"></tr> <tr class="ui-sortable-handle"><td
Bootstrap modal open onClick or onLoad and it takes the user at the top of iFrame because due to .scrollTop() issue with Safari and IE
You can see, the problem is in line 34. from Plunker - http://plnkr.co/edit/xjnCWE?p=preview, The .scrollTop(), When not given any value, should return current scroll position. When the parameter is passed into the function, it will scroll to given pixel on the element. And it does, in any other browser. In safari, it passes 0 for some reason… Therefore it’s scrolling up to the top… I am not entirely sure how to solve this issue… Other than hack of course. Works perfectly on Chrome & Firefox BUT
Div click doesn' work?
https://jsfiddle.net/jsfiddle135/sn06tuur/16/ ============ Explanation ============ //##### Question1 - HIDE $(".forgetc").css({'z-index', -5}); $(".forgetc").hide(); // This doesn't hide. function display(mode){ if(mode=='forget'){ //SHOW $(" .forgetc").css('z-index', 5).show(); //hide $(" .fmenu").css('z-index', -5).hide(); }//if return false; }//END<<<<<<,funciton display $("#forget").click(function(){ display('forget');
iframe not appearing in div in IE and Firefox. Works fine in Chrome
I am almost positive the issue is me! We are using Collegenet's online calendar service and in order to get their "spud code" which is actually an iframe, to appear in IE and Firefox, we needed the following code in our template: $(document).ready(function() { $(".navbar li a").click(function() { $(".dropdown-open").hide(); $('iframe').css('height','4000px'); }); }); The code appears fine in Chrome. I am attempting to use similar code on another template but am not have any success. Below is the
Returning bool in ajax request
Hello All, I have a common ajax method like the one below, function callService(url, data, success, failure) { $.ajax({ url: requestUrl, method: "POST", contentType: "application/json; charset=utf-8", dataType: 'JSON', data: { model: JSON.stringify(model) }, success: successCall, error: failureCall }); Now somewhere else, I am using the above method function getTheData() { callService(url, data, newFunction, function (error)
Help needed in retrieving a table value
I have a sequence (specifically in YYYY-MM-DD h:mm A format) occuring in every row of a table but in different columns. I want to retrieve the value of each sequence occurring in each row. Please help how can I retrieve them. My closest guess is $.each but how can I get all the row values in an array??? Any alternate way is also highly appreciated.
Scrolling down in a text area
I have a textarea on my asp.net page, and I'm trying to scroll down with it. I found code on stack overflow as follows: function scrollTextareaToEnd(jqueryid) { bottom = $(jqueryid)[0].scrollHeight - $(jqueryid).height(); $(jqueryid).scrollTop(bottom); } You call this as scrollTextareaToEnd("#myTextID"); It does not work. What is wrong with it? Thanks
Adding a class to an object is not applying the CSS for some reason
In the code below I am trying to add a class to an object. When I click on the element, the alert shows the name of the class, but the color from the CSS is not changing. What am I doing wrong this time??? // Get ID of the agenda item from the event object var agendaId = eventObj.data.agendaId; // pull agenda item from calendar var agendaItem = jfcalplugin.getAgendaItemById("#mycal",agendaId); clickAgendaItem = agendaItem; $(clickAgendaItem).attr("class","fullFlagLate");
Upload Files with Ajax
I have form : <form id="product" fole="form" action="..." method="post" encrypt="multipart/form-data"> <input type="text" name="productname" id="prod"/> <input type="file" name="file" id="uploadfile" /> <input type="button" id="Ok" Value="Ok"/> </form> I use FormData() upload files to server, my javacript : <script> $(function () { $("#Ok").click(function () { var file_data = $('#prod')[0].files; if (file_data == null) return;
Why dose the JSON DATA was replaced?
Hi I use "jQuery.ajax", like this var df = jQuery.Deferred(); var vCallBack = "jsonNpCB" + (+new Date()); jQuery.ajax({ type: "post", url: "http://hoge.hoge/action.php", data: JSON.stringify(vArrPrm), scriptCharaset: "utf-8", dataType: "jsonp", jsonpCallback: vCallBack, ... }); this script is using very cool, with the exception of certain cases. if there was the strings "??" in the JSON, it can't send data. The data is like this var vArrPrm = { "DATA1":
Next Page