Invoke jQuery after UI is loaded
Hi, Is it possible to invoke jQuery after the UI has loaded ? I want the html of the page to load first , then followed by the functions to load the data. Is this possible? If yes, how to achieve this. Thanks
How to check if a post already exist on the page before refreshing and appending new posts
kindly guide me on this. I'm building a forum page on my website with functionalities for posts/comments. In my jquery file, i have a variable which holds the html wrapping the posts as below: var postHtml = '<div class="col-md-1"><img src="images/user.png" alt="image" width="50px" height="50px" background="#FC6806"></div><div class="col-md-11"><h5 style="color:#FC6806"><strong>'+user.name+'</strong></h5><h6 style="color:#FC6806">'+user.time+'</h6><h5 style="color:#0269C2"><strong>'+user.topic+'</strong></h5><p
Widget function not being overridden by options
My widget function isn't getting overridden by the options I pass in. What am I doing wrong? And PS: Do you think my Base Framework should be a widget at all? Or am I just trying to force my design to meet the JQuery UI design? Any recommendations of how I should change it? (function ($) { /* Design Widget */ $.widget( "MY_NAMESPACE.design", { _create: function () { if (!this.options.framework) this.options.framework = $('<div></div>')
Instantiating Widgets: do the elements have to exist/be in body?
When instantiating a widget do I have to 'apply' it to an element already attached to the body element? Ie, like the following... var myWidget = $('#foo').MyWidget({option1: 'foo'}) // Must add the element to the body to get it to function correctly (am I correct?) myWidget.appendTo($('body')); Or can I just instantiate one like so... var myWidget = new MyWidget({option1: 'foo'});
tablesorter.pager not showing
I have installed the tablesorter.pager.js and it loads, but the pager is not visible at the bottom. What am I missing? this is the code I am adding : $('#myTable') .tablesorter({widthFixed: true, widgets: ['zebra']}) .tablesorterPager({container: $("#pager")});
jQuery Conflicting with Other Plugins
First off, thank you in advance for any assistance in this matter. I've inherited a website from another web developer and they're currently using the Top Up Lightbox for all clickable images and videos. My dilemma is this, I'm also trying to use a jQuery Pop Up Overlay on this same site. However it appears that the script CDN's for jQuery that I'm adding seem to be cancelling out the functionality of the Top Up scripts. How can I prevent this from happening and still use both the Lightbox and Pop
jQuery versions differences
Hello, can anyone tell me the differences between jQuery version 3.1.1 and the last one, 3.2.1? Thanks a lot in advance. Luigi
Jquery Dom Refresh
Hello there. I use drag and drop to add html elements to the page, and I give each element an id. And I write the knowledge of that element once about which element I come to with the mouse. I noticed one thing but I created a blank page and added elements successfully added successfully. When I put the mouse on it, it does not get the id knowledge. But if you save the page and keep repeating it, it writes the id information about the element you're typing with the mouse. When I add something new,
How do I avoid this problem
I use this code to load datatable with this method show,add,edit,delete <div class="panel-body" id="content"> </div> function ajaxLoad(filename, content) { content = typeof content !== 'undefined' ? content : 'content'; $.ajax({ type: "GET", url: filename, contentType: false, success: function (data) { $("#" + content).html(data);
What is obj in the QUnit code example?
QUnit I read this web-page. It contains code example: QUnit.test( "step test", function( assert ) { obj.start = function() { assert.step('start'); }; obj.middle = function() { assert.step('middle'); }; obj.end = function() { assert.step('end'); }; return obj.process().then(function() { assert.verifySteps(['start', 'middle', 'end']); }); }); What is obj in this code example? I don't understand how to use `assert.verifySteps` method. This is my attempt: QUnit.test(
jQueryMobile - First Code not working
Hi All, I have just started working on jQueryMobile and tried to run below code in EditPlus and Sublime Text both editors but it is not showing the result like it is described in the below video URL on YouTube: https://www.youtube.com/watch?v=OSrhbswjQww&index=3&list=PLGGfIkWckSmlf8bogwP-bMMEmo2bt27gD Here is the code which I have used: These CSS and JS files are placed in the same folder. I am getting the output as shown in Example.png in the attachment. <!DOCTYPE html> <html> <head> <meta charset="UTF-8">
Multiple jquery ajax calls to be made from the same page --
Hi All. I need a little help with just a jquery implementation on a particular scenario. Actually I’m a little unsure/mixed up with the concept/what to do in the case I’m about to describe, that’s why asking. Basically, I have a page, where I have a dropdown list. Also a span tag. Now, on the document ready event I’m executing some jquery, filling up the dropdown with items fetched from database; also setting the text of the span tag to the first item from the dropdown. The flow of my application
Passing Soap Action for Post Method using the Ajax/jquery
From the wsdl file by passing the Soap Action with the Post Method in Ajax/jquery need to get the required response . Tried out but getting as XMLHttpRequest cannot load (wsdl url ) Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. Please let me what is the issue. below is the code I had tried out $.fn.getProducts = function(CustID) { var products
Error as XMLHttpRequest cannot load
Error as XMLHttpRequest cannot load url. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. how to resolve this . error
How to stop blinking menu items when clicking menu icons for responsive web design?
Here is the code i tried, JS: $('#menuIcons').click(function(e) { $( "#headerListIcons").slideToggle() ; e.preventDefault(); }); $(document).on('click',function(e) { if(e.target.id != 'menuIcons') { $( "#headerListIcons" ).hide(); } }); HTML: <ul id="menulist"> </ul> <div id="menuIcons">☰</div>
Validate skip_or_fill_minimum data attribute
Using jQuery version 1.9.1 jQuery validate version 1.16.0 jQuery validate-additional-methods version 1.16.0 I've googled and also searched here for the correct usage to get this to work. I'm not sure how you pass the element you're wanting to "track". I've tried: <input type="text" name="billing_po" id="billing_PO" class="PO" data-rule-skip_or_fill_minimum="2" data-msg-skip_or_fill_minimum="Need to fill in both or neither" > <input type="text" name="billing_poexp" id="billing_POexp" class="PO" data-rule-skip_or_fill_minimum="2"
Memory Leak In QUnit.equiv
During our analysis on our qunit test suite, we found an issue originated from QUnit.equiv(). We use Chrome dev tool memory tab to take snapshot of the memory, and we found that the global queue "pairs" still holds references to the objects (and their sub-objects) we passed into QUnit.equiv(). When the objects to be compared are big, the leak is big as well. We currently workaround this issue by invoking QUnit.equiv() again with two empty strings, that will replace the global queue with the two empty
Datatable order by number
Hi , i have a datatable with one field as this : 1 of 01-10-2017 2 of 01-10-2017 3 of 01-10-2017 4 of 01-10-2017 5 of 01-10-2017 6 of 01-10-2017 7 of 01-10-2017 8 of 01-10-2017 9 of 01-10-2017 10 of 01-10-2017 11 of 01-10-2017 if i click to sort , the 10 and 11 are after 1 ther's a way to ordinate numerically ?
html element creation problem
While creating html elements with jQuery, attributes specified in html prevent attributes specified with parameter. http://jsbin.com/tesaviribi/1/edit?js,console function test(html, attribs) { var $a; if (attribs) $a = $(html, attribs); else $a = $(html); console.log($a[0].outerHTML); } test("<div />", { html: "TEST10"}); test("<div />", { text: "TEST11"}); console.log("---------------"); test("<div data-a='x'>TEST20</div>"); test("<div class='x'>TEST21</div>"); console.log("---------------");
Display additional column\field in SP2013 Calendar mouseover tooltip
I'm a fairly new SP Admin, still learning along the way, so please go easy on me.
Have inherited a SP2013 site that has a calendar with various items populated from the associated list. As it is a calendar, I am able to click on the items in the calendar and view the properties (i.e. Start\End Time, Category, Description, etc.). I modified the list to add an additional column (field) to include the name of the person owning the particular event (the Project Manager).
What I am trying to accomplish
Create an AJAX Powered Data Driven App
When I type in an artist and I click the button, I should get a nice list of their songs in a format that is aesthetically pleasing. My error is: Nothing is returns whenever I press the button, I don't know why that is. **HTML File** <!DOCTYPE html> <html> <head> <title>Songs</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
Expand Table Rows and also change image in TD with click
Hi, I am using the code found in this page - http://talkerscode.com/webtricks/expand-table-rows-using-jquery-html-and-css.php - which works great (click on the row toggles the hidden row beneath it) but I am hoping for some help on how to add one more bit of functionality. I would like an image in the td to change/toggle from (down.png to up.png) when the row is clicked. Not sure if I need to add a class or id for the image in the html and then add to the function? Obviously very much a newbie on
Error using latest jquery-ui and jquery
Only include this and after a couple secounds, scroll page down and all mouse move fire this errors: jquery-ui.min.js:13 Uncaught TypeError: (e.attr(...) || "").split is not a function at t.(anonymous function).(anonymous function)._addDescribedBy (https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js:13:21693) at t.(anonymous function).(anonymous function)._addDescribedBy (https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js:6:4499) at t.(anonymous function).(anonymous
Error with Stripe in Woocommerce
Hello we just strart to configure payments, we are in test mode : https://wear.edenweb.ch when i try to send the payment and put the test number i have this message ;: PLEASE ENTER YOUR CARD DETAILS TO MAKE A PAYMENT. DEVELOPERS: PLEASE MAKE SURE THAT YOU ARE INCLUDING JQUERY AND THERE ARE NO JAVASCRIPT ERRORS ON THE PAGE. I asked to Stripe and they told me to see with you Who can help us because all is ok about the configuration, thanks
Help With Collapsible Content
Good Morning!! First off, thank you for your help!! I am a volunteer for a Minor Hockey Association, trying to set up a webpage for our volunteers, and overall I really have absolutely no idea what I am doing... I was able to piece together the below by reading through forums and tutorials, but I have hit a wall and really need some help. Here is what I have so far: <!DOCTYPE HTML> <HTML> <HEAD> <TITLE>**** Volunteers</TITLE> <link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
How to select name attributes of dynamically generated elements in jquery
I have a forum page with dynamically generated reply buttons to reply to comments. Since i cannot use an id for multiple elements, i gave each button a name attribute with the value being the id of the particular comment been replied . How do i select these buttons using jquery? This is what i've been trying but has been throwing up syntax uncaught errors: $(document).on('click', 'button[name='+postId+']', function(e){ e.preventDefault(); alert("it worked!"); });
AJAX Parser Error on GoDaddy Shared Server
Hello, I am having an issue trying to get AJAX to run on our hosting server. It works great on my development workstation but when I upload the ASP page it fails with a Parser Error. Here is the error. Description: An error occurred during the parsing of a resource required to service this request. Please review the following specific parse error details and modify your source file appropriately. Parser Error Message: Could not load file or assembly 'AjaxControlToolkit' or one of its dependencies.
Read the value from Web.config file
I am using .js file. I want to read the value from Web.Config by Key. I am using this code, but it's not working. var appSetting = '@(System.Configuration.ConfigurationManager.AppSettings["systemAdministrator"].ToString())'; It should take the whole value as string. Can anyone pls help how to get the value ?
ecosystem:jquery wrongly mentioned in NPM guide?
In instructions for publishing your plugin to npm along with "jquery-plugin" keyword for package.json the "ecosystem:jquery" keyword is mentioned as a second one. But seems there is no such plugins with this keyword so far (except of mine). Have I misunderstood the instructions and is there a need for such keyword at all? Thanks, Sasha (xml4jQuery plugin)
// how do I hide only the one I click on and not all of them
<h4>Booleans</h4> <p>Booleans are either <kbd>true</kbd> or <kbd>false</kbd></p> <div id="boolean" class="solution"> <ul> <li> <pre> <code> function testBoolean(val) { if(val == 7) { return "true"; } } </code> </pre> </li> </ul> </div> <h4>Booleans</h4> <p>Booleans are either <kbd>true</kbd> or <kbd>false</kbd></p> <div id="boolean" class="solution"> <ul> <li> <pre>
Adjusting the jQuery UI Month Picker Plugin for jQuery UI 1.12
Hi, I am the Lead developer on the jQuery UI Month Picker project. https://github.com/KidSysco/jquery-ui-month-picker The jQuery UI Month Picker Plugin is designed to be a version of jQuery UI Date Picker which allows user input for only a month and year when only that input is required. Our goal is to be as visually consistent as possible with the jQuery UI Date Picker. In order to make the plugin look consistent with Date Picker I created a .ui-widget-header that has next/prev buttons with a transparent
Data table header and body are not aligned
I want to align the body and header of the datatable, below is the datatable //JS oTable = $('#TeardownTbl').DataTable({ /* "rowReorder": { selector: 'tr' }, */ // "bFilter": true, "aLengthMenu": [[10, 25, 100,500], [10, 25, 100,500]], "sAjaxSource": URL, // "sScrollY" : "500", "processing": true, "iDisplayLength": 500, "sScrollX" : "1800px", // "sScrollY" : "400px", // "scroller": true, "bDestroy": true, "scrollCollapse": true, // "autoWidth": false, // "rowReorder": true, "aaSorting": [], "aoColumns":
Array in attribute callout
I'm trying to target a specific class that has an attr (myfield) equal to something from an array & then change the bottom padding: var ipd = 'field1,field2'; console.log('Img Pad string: ' + ipd); var ipdarray = new Array(); ipdarray = ipd.split(','); console.log('Img Pad array split: ' + typeof ipdarray); console.log('Img Pad array: ' , ipdarray); for(var i = 0; i < ipdarray.length; i++) { console.log('field: ' + ipdarray[i]); $('.my-cell[my-field="ipdarray[i]"]').css({'padding-bottom':
jQuery Upgrade from jQuery v1.10.2 to v3.2.1
Problem: Our site has some code that allows for viewers to see the results of thousands of cancer patients, following cancer treatment. The goal is to help folks understand which treatments work the best. This code uses library of code called HighCharts, along with jQuery. We are migrating from an old template to Elegant's Divi Template. Unfortunately, there seem to be issues between the version jQuery code we are using and the Divi Template. The version of jQuery currently loaded on the server
Scrolling div so that checked radiobutton is horizontally centered to the screen
I have some HTML and jQuery code. The idea is that if a radiobutton is checked, the div #kaaviotaulukko should be scrolled to left position of the checked radiobutton. And the checked radiobutton should be horizontally centered to browser window. The problem is that my current jQuery code does not center the checked radiobutton horizontally. $(document).ready(function(){
$('#kaaviotaulukko input[type=radio]').change(function() {
var container = $('#kaaviotaulukko'),
scrollTo = $(this);
Jsfiddle wont work locally
I can´t get this Jsfiddle to work on my computer: http://jsfiddle.net/v685v9t6/1024/ I have tried this: <html> <html> <head> <script type="text/javascript" src="//code.jquery.com/jquery-2.0.2.js"></script> <script type="text/javascript" src="//code.jquery.com/ui/1.10.3/jquery-ui.js"></script> <link rel="stylesheet" type="text/css" href="//code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css"> <style type="text/css"> .draggable { width: 90px;
Help is this possible - jquery - php - socket - update php variable?
Hi I am new to jquery and I need an answer to this. I have: Index.php: session_start(); $page = "/update.php"; $sec = "100"; header("Refresh: $sec; url=$page"); update.php session_start(); $start_word = "temp"; $FirstArrive = shell_exec("python /share/word.py $start_word"); $stringFirstArrive = explode(',', $FirstArrive); $stringFirstArrive = preg_replace('/[^A-Za-z0-9\+.:]/', ' ', $stringFirstArrive); // Removes special chars. $_SESSION['FirstArriveString'] = $stringFirstArrive; header("Refresh:
Persistent active tabs: prevent page scroll on click
I'm implementing this method of maintaining an active tab through multiple page loads, generously provided by @jakecigar https://forum.jquery.com/topic/maintain-active-tab-through-multiple-page-loads But I'm finding that clicking a tab causes the page to jump/scroll to the location of the ID of the tab's content. Here's an example: https://jsfiddle.net/dadra/n2r1uhjm/2/ I need the page to not jump to the ID when clicking on a tab, or when the "active" tab is loaded when opening a new page from the
Why exist is not determined?
Hi, I am using this code to signup a user and check if the user exists. When I enter an exists user my PHO correctly returns "exist" but my jquery is showing it in a normal alert not the DevExpress alert as if it's an error is there any issue in my if (data == "exist") this is my code: $.ajax({ type: "POST", url: 'https://www.mydomain.com/ws/signin_user.php', async: true, data: formData, dataType: "json", processData: false, contentType: false, success: function (data)
JQuery method plugin not working
I'm new to JQuery, and I'm struggling with methods creation. I've the following code: (function($) { $.fn.changeRed = function() { return this.each(function() { $(this).css('background-color', 'red'); } }); })(jQuery); $(document).ready(function() { $('p').changeRed(); });In the HTML page I've a simple <p>Hello</p> This not work. Can you figure why not?
Next Page