Attempting to follow http://demos.jquerymobile.com/1.4.0/collapsible/ article
This is my code. Something is missing because the icon with the + sign does not appear. Also the content is shown by default, rather than closed as specified in the text. Is there anything else I need to add to this code: <!DOCTYPE html> <html> <head> <link rel='stylesheet' href='jquery/mobile/jquery-mobile-1.4.5.css' type='text/css'> </head> <body> <div data-role="collapsible"> <h4>Heading</h4> <p>I'm the collapsible content. By default I'm closed, but you can click the header to open
Loop through stacked element continiously
I am trying to look the trough the display of a bunch of absolutely stacked elements, but it stops when it gets to the last one. My code looks like below: Any ideas on how I can get it to work? $(".box").each(function () { $(".box").click(function () { $(this).removeClass("retain").removeClass("back"); $(this).addClass("back").delay(1000).queue(function(){ $(this).removeClass("back").dequeue().addClass("retain"); }); }); }); See complete working code on jsFiddle.
jQuery UI datepicker Debug version different from Release Visual Studio 2015
I have a MVC 5 C# application when I run it in Visual Studio 2015 and the debug mode has all its graphics available. When I publish it in Release mode its graphics have disappeared but the datepicker still works. TIA, Bruce
How to use different .ui classes?
Hello. I have used jquery-ui's accordion in my pages but I want to have 3 different type of that. I have styled .ui-widget-content , .ui-state-default and .ui-widget-header classes to build an accordion for my footer but actually it impresses other ui elements. Now I want to have another accordion with a different style and want to give another properties and values to those classes . How should I do that? Thanks in advance.
Problem for dynamics data
Hi I don't understande how to do that. I have a form where I add dynamically a div : $(".datepicker").datepicker(); $("a[name='addDom']").click(function () { $(this).after('<div class="exception">Fermeture excetionnelle à cette date : <input size=10 type="text" class="datepicker" name="exception_fermeture[]" value="" ><hr>Ouverture supplémentaire particulière<table border=0 ><tr><td>Date d\'exception <br>(jj/mm/aaaa) : </td><td><input size=10 type="text" name="exception[]" value="" ></td><td>Début
JQuery UI Full Documentation
Hi, I'm new to Jquery UI and i was exploring some widgets and found the Tabs widget. I noticed that some methods are not documented (for example appendto()) so my question is where do i find a full documentation on all the methods of the widgets?
Drag-Drop parked objects over an image and save the layout
Looking for solution for placing UI obejcts (Labels/Buttons) over a layout image and saving it. Also want to reload for further modifications.
Disable sortable for certain table cells and change sensitivity?
Hey, I'm using jQuery Sortable on a table and it works to re-arrange rows. One of the columns is a link and I don't want that column to be "draggable". Can I turn of the sorting for just that one column? Also is it possible to reduce the sensitivity on the actual grabbing? I have another ul list where every li is a toggle button AND sortable. Sometimes I just want to click it, but it reacts so quick that it starts to drag it instead. I have to be really careful. Is there a parameter to change this
jQuery UI selectable - How to unselect element by dragging a box (lasso)?
It's my very first time trying to select items by dragging a box(lasso). Now I can select elements by dragging a box and also unselect them when clicking the element one by one. I think that's a little bit annoyed when you have too many elements to unselect. So my question is how to unselect the selected elements by dragging a box not only by click it? Here's my JSFiddle or you can also check the code below： HTML part： <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
I am unable to find following (jquery-ui.css) in my word press.
Hi, I would like to modify slightly on "jquery-ui.css" but, I couldn't find in my WordPress account. http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/themes/smoothness/jquery-ui.css Can anyone help me out, please!!! Thanks in advance.
jquery autocomplete with dynamic data and submitting on selection
Hey all, First post to these forums as I usually can figure out issues on my own but I am stumped on this. I am attempting to implement a member search feature where the user can begin typing and a member list is displayed, when they find the right person, they click or select them and it submits their data to another ajax function I have. For now I would accept seeing the "aha" alert appear but nothing is happening at all now. If I use the most basic of autocomplete examples provided it works,
how to use draggable() in modal?
I'm trying to use draggable() within modal. it works perfectly outside of modal but doesn't work when I use it in modal. Would you tell me what the problem and how to fix this? here is my code and view. Thank you. <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href="/5zo/view/CSS/imageMapWidget.css" rel="stylesheet" type="text/css"> <link href="/5zo/view/CSS/videoWidget.css" rel="stylesheet" type="text/css" > <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
Expected '}' error - jQuery UI Autocomplete
Hi, I am trying to use the auto complete option in jQuery UI for SharePoint OnPremise. I have tried the below code: $("input[title='Skill Required Field']").autocomplete({ source: function (request, response) { var term = request.term; var listname = "MySkills"; var resurl = siteURL + "/_api/web/lists/getbytitle('" + listname + "')/items?$select=Title&$filter=startswith(Title,'" + term + "')"; var alldata = []; $.ajax({ url: resurl, method: "GET", headers:
Using Accordion With Tables
Hi all, I am quite new to jQuery, and even more to accordion. Would like to seek help on the following problem. I had a form which is in tabular format. However, I want to use accordion to collapse the table and only expand it when the user require to input data in it. I had search many sites for solutions but to no avail. Would like to seek any kind souls here for help. Your help will be much appreciated. The following are my codes: jQuery Code: jQuery(window).load(function() { jQuery("#accordion"
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
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 i can't include library with Ionic-Angular App
Hello, I'm developping an app with ionic - Angular and I wanted to make the dragging service with jquery UI but it didn't work enven with basic examples, this is my code: <head> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.4/jspdf.debug.js"></script>
Theme Roller Button Changes Size on Hover
I am working on a website that is using oscommerce 2.3.4 and a Theme Roller theme running jquery-ui-1.10.4. One minor issue is that the bold button text changes to normal on hover and the button shrinks. Rather than re-run the theme in Theme Roller again, I thought I would hack the jquery file to provide bold text on hover. I have been unsuccessful. Any suggestion you may have would be appreciated.
Maintain active tab through multiple page loads
I have a list of links: <ul class="links"> <li><a href="link-1.html">Page 1</a></li> <li><a href="link-2.html">Page 2</a></li> <li><a href="link-3.html">Page 3</a></li> </ul> And below that some jQuery tabs: <div id="tabs"> <ul> <li><a href="#tabs-1">First</a></li> <li><a href="#tabs-2">Second</a></li> <li><a href="#tabs-3">Third</a></li> </ul> <div id="tabs-1">First tab content</div> <div id="tabs-2">Second tab content</div> <div id="tabs-3">Third
Form Navigation via Dynamic Colour Changes to Dropdown Text
Can anyone assist ? I have a multistep form comprising various dynamic DD selects that a user is guided thru using purple buttons that light up to prompt user navigation & selections in the correct order. Step1 snippet of the overall form is shown here: [URL="http://www.jcsweb.biz/mef/client/wd_scen_lev/Step1_01j.php"]http://www.jcsweb.biz/mef/client/wd_scen_lev/Step1_01j.php[/URL] To optimise the layout, I wish to remove the buttons that light up but maintain the colour-guided navigation using dropdown
Styling of close icon on dialog
I am using the dialog widget with a custom theme. In several of my dialogs I don't need any buttons. However, if I don't include any buttons, the styling of the close icon changes (the background is one of the theme colors, instead of white). Why would the presence/absence of buttons affect this? Icon when buttons are included Icon without buttons
Date Picker for dymically added row not working
Dear Sir please refer http://prajaktasoftware.com/srm/indentadd.php Trying to add rows dynamically. using following code $('#addRow').click(function () { addItem(); }); function addItem() { var rowcount=$('#rowcount').val(); var itemRow = '<tr>' + '<td><?php echo fillDropDownselect("rawmaterial","name","id",$rawmaterialid," 1 ","rawmaterialid".$_POST["rowcount"],"name","Select raw Material");?></td>' + '<td><input type="text" class="form-control update row-quantity
Tap widget question
Hello there! I'm using jQuery Tap codes for my squarespace website, and I was wondering if there was a way to display the content not below but above the header? This is the page on which im working on: https://www.brandlangers.com/portfolio-grit2#tabs-3 Hope anyone could help me! If I have to be more specific I can try. All the best, Gido Gil
Datepicker by week/year?
I am creating a report in which I need to use START WEEK and END WEEK as criteria. I'm not even sure if the datepicker is the right way to go with this, but if it is, how can this be done? I'm hoping for example code, as I am not super comfortable in jQuery yet... Thanks in advance!
Using UI 1.12.1 Does not work
I just downloaded UI 1.12.1. both jquery-ui.js and jquery.js are in the same fold my html page is in. I proceeded to review a jQuery tutorial and copied the sample; ran it in Firefox:nothing worked. I have tried .hide(), .append(), and alert(); no jQuery script works, nada, zero, and zip works. Regular JavaScript still works. This is my code: Why doesn't this work? <body> <div id="divOne"> <p id="pOne"> </p> <p id="pTwo"> This 2</p> </div> <script> document.write("Ready");
How to bind a jQuery class to a dynamically create INPUT element?
// define a jQuery getdate class for datepicker below (function() { var d = new Date(); var maxD = new Date(d.setDate(d.getDate())); $('.getdate').datepicker({changeMonth: true,changeYear: true,yearRange: "-31:+0",maxDate:maxD}); // ,dateFormat: "MM dd, yy" })(); // goal: add a defined jQuery class to a dynamically created INPUT field // defined jQuery class = getdate; and it works fine with regular reference // create a dynamic INPUT element var cellText = document.createElement('input');
Jquery and css3 mediaquery problem
Hi I have a strange problem involving jquery/jquery-ui-accordion and css3 mediaquery. I have a site where the jquery works fine ( image swap, accordion and so on). But i have a mediaquery in my css and when the windows hits its size the jquery stop working. All of it.. nothing works anymore. I use jquery 3.1.1/jquery.min.js and query-ui-1.12.1.custom/jquery-ui.min.js from Googles CDN Is it someone out there that can tell me what is going on? Why does the jquery stop working? Link to the problem
jQuery Calendar question
I recently bought a JavaScript book that showed me how to build my own calendar. However, when I run the code in Firefox it has no style at all. The functionality works but looks very bland as you can see. The link to the CSS code is:<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/ui-darkness/jquery-ui.css"> As you can also see it doesn't do anything. Is this a broken link? I saw a similar question asked by dashtetanhaimein, but it didn't help my situation. Thank you in advance. The
jQuery UI Slider with multiple ranges - background bug
I'm trying to create slider with 2 ranges and add some color to background, it's OK with max value 100 (line 9): jsfiddle - ok Problems appear after changing it, from max:100 to max:95: jsfiddle - bug Maybe where is a better way to do this, maybe i miss something, please help me. Thx for attention.
Dynamic Nested Accordion based on JSON
HI, I'm having trouble creating a dynamic accordion based on json data. My Fiddle: https://jsfiddle.net/trvr7ynx/1/ Example Fiddle: http://jsfiddle.net/3zza6L4v/ of nested accordion. However, the example Fiddle doesn't have the same json structure as I do. I'm generating mine on server side from a data table, and it is "flat". What I need: For each unique Category(see my json in fiddle) >> accordion panel, inside it nested - all blocks belonging to that category, where "ItemTitle" is accordion
Text alignment in columns in jQuery UI accordion headings
I'd like to be able to align some text in the headings of a jQuery UI accordion so that values selected in each panel is summarized and visible... and lined up consistently on all the collapsed panel headings. Here is a sample of more or less what I'd like, but it was accomplished poorly and unreliably by using varying numbers of s. Additionally, I'd like to add a column on the right edge of the headings with an indication of whether the section is fully completed. Obviously, when the 4th section
using autocomplete on cloned elements
Hi Guys, Had an issue that I could never find the correct solution online for so thought I would post one up in case it would ever help anyone. So basically I wanted to add the same autocomplete function to multiple cloned elements, but as anyone that has tried this before knows, there are tonnes of issues meaning it never works without complications. I've came up with a few solutions, (new ids, add to each new id) but by far my favorite is shown below: $("[name='nameofelement']") .focus(function(){
Date picker range from any date
I am using date picker below is my code i need solution for i have two fieldes fromDate and tDate if i select every date in fromDate in toDate filed there will be only 7 days will be enabled, currently when i selected today date it is working but i need it for first condition. $("#fromdate").datepicker({ dateFormat: 'yy-mm-dd', minDate: new Date(2014, 1 - 1, 1),
Anomaly with combination of resizable/draggable
Hi All, Something wrong on a resize and draggable item with containment. The bug comes when the resize grow on left and the border touch the container /*! jQuery UI - v1.12.1 - 2017-04-21 I don't use responsive yet.
Question about resizable function
I do not speak English, sorry, I'm using a translator. Resizable function does not work if the div contains an iframe. When the resize reaches the edge of the iframe, it stops working. Attached a sample gif Thanks
How to hide the [x] Close button in a jQuery UI Dialog
I'm trying to put up a modal dialog box made by the jQuery UI Dialog widget. It works fine, but I can't find the right way to hide the close box in the upper right corner. I've read some suggestions, including the example in the UI API documentation for the Dialog widget "Hiding the close button" which involves setting up a CSS rule and using it in the dialog setup... but that didn't work for me. I also tried, in the code that brings up the box: $("#really-change.ui-dialog-titlebar-close").hide();
Jquery Dialog 1.12.0 CloseText is visible overlaid on the Icon very irritating
The following script would cause a dialog to be displayed with the text "Close" is overlaid on top of the Cancel icon on the top right corner, which is very irritating. It suppose to be "invisiable" by default theme. $("#createdialog").dialog({ autoOpen: false, resizable: true, modal: true, width: 850, }); The workaround we used to is to use the CloseText option closeText: "" But why the default behavior has changed ?? Here is the rendered HTML after attaching the dialog to the element
Why do we lose cursor upon datepicker selection?
Objective: Upon date selection from datepicker, user would tab to next field and the onblur event would trigger an action to populate selected date in the SPAN with ID of "dated". However, upon date selection, the cursor simply disappears and if I move cursor using mouse to the next field, the SPAN with ID of "dated" is still not populated with datepicker date. What gives? Thanks in advance. <table> <tr> <td> <input type="text" name="exeDate" size="30" class="gdate" onblur="document.getElementById('dated').innerHTML=this.value;">
autocomplete (sending an additional parametr to server request)
Hello! I'm trying to use autocomplete with data source from php. I need to make the request to my script with the 2 parametrs. getset.php?get=table&term=some But still don't understand how. I need to do something like this: $( "#autocomplete" ).autocomplete({ sourcel:'/getset.php', params: { 'get': 'table' }; }); But there is no params option in http://api.jqueryui.com/autocomplete/#option-source Could you help me to solve this problem?
Autocomplete match beginning
This is more a tip than anything else for someone like myself who has next to zero experience with the jQueryUI. In using the Autocomplete widget I noticed that the first letter entered matched against ANY letter in the associated list of words. I thought this to be unconventional behavior. I think most users would want to see only the words that BEGIN with the letter(s) they typed. At the very bottom of the jQueryUI API page on Autocomplete is an example for matching only the beginning of terms.
Next Page