cant´t change icon
Hi, I got some scripts from a former colleague to work on and have a problem: I´m looking for a way to change the symbol on a select form field. Usually it´s a filled triangle pointing down, but all I get is a grey, filled circle instead I´ve tried it with: $( "#XYZ" ).selectmenu({ icons: { button: "ui-icon-triangle-1-s" } }); where XYZ is the id of the <select> the statement is called inside $(function(){}); Thanks for your help
Sortable - prevent to drop after given table row
Hello, please, it's possible prevent to drop table row AFTER a given table row while BEFORE a same row is drop allowed?
Activate Month dropdown only when Year is selected from dropdown in datepicker
Please let me know how to achieve this scenario. I am using jquery datepicker. now my requirement is that User should only be able to select Year first than Month and than day. this is for Date of birth capturing. Please help me in this.That is becoz users while selecting their DOB are not selecting year of birth which is than taken as default and thus loss of business and revenue
Question about droppable events
I'm using the draggable/droppable functionality, but there's something I can't figure out. How do I detect which element was dropped into the same container and attach an event to it? This is what I'm looking for... See comments in the "if" statements: $(function() { $( "#mybox, #mysquare" ).draggable({ revert: true }); $( ".container" ).droppable({ accept: "#mybox, #mysquare", activeClass: "activeelement", hoverClass: "hoverelement", drop:
Min verson
I use jQuery UI succefully but when I try to debug with chrome I get lost in the min version. Her is the URL that I use: https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js Can someone advise? Maybe the is a developer version in google? Thx I.Sher
jquery datepicker not working with dynamic html tables
Hi, I construct a table with dynamic rows and bind the date picker elements to some of the columns. However, when a row is added to the table the date picker works only for the first row and not the rest of them. I tried to unbind and then rebind the date picker but does not work. Any help would be great. Regards, Arjun The code is attached for reference. $('a.add-passenger').click(function(event){ event.preventDefault(); counter++; var newRow = '<tr>' +
Dynamically removing tab entries after dynamically adding them
I'm creating tabs dynamically with: <div id="tt" class="easyui-tabs" > </div> function addTab(title, url){ var content = '<iframe scrolling="auto" frameborder="0" src="'+url+'" style="width:100%;height:100%;"></iframe>'; $('#tt').tabs('add',{ title:title, content:content, closable:true }); } I need to remove them dynamically. The suggestion from the man page is: $(
Installing JqueryUI and calling correct links in HTML page.
Hi all, I just recent caught the Jquery and UI bud and would like to learn more about it. Therefore, I'm a real newbie and i require some assistance please in installing and linking the UI in my html page. After downloading the custom UI jquery-ui-1.11.4.custom, i see the following files and folder. --JQUERY-UI-1.11.4.CUSTOM (Folder) --jquery-ui.css --jquery-ui.js --jquery-ui.min.css --jquery-ui.min.js --jquery-ui.structure.css --jquery-ui.structure.min.css
Why do my jQuery UI buttons no longer display the excite-bike theme?
On a previous site, I used the excite-bike jQuery UI theme on buttons, and (IMO) they look great: On my new site (which is now live here), which started with the same exact code as that previous one, and I just changed what needed to be changed for the new site, it no longer works. The buttons are outsized and generic (select the Media tab at that site to see them). Yet, I'm still referencing the necessary CSS and jQuery in my _SiteLayout.cshtml file (this is a WebPage project created with WebMatrix
Mobile UI Sujjestion with chart or graph or image
Hi, I have following simple requirement to display in mobile (android or apple). Requirement: 1. I have two works per each hour in day. lets say works are 'A' and 'B'. 2. Daily I need to work 8 hours 3. So when I open application, screen should display all 8 hours and what is my work I need to do. 4. I am able to click on each work item to view details about work. Example: 1 hour = A (20 issues), B(5 Issues) 2 hour = A(5 issues), B(6 issues) 3 hour = A(10 issues), B(4 issues) . . 8 hour
How do I move all items in a connect list to another list?
I have two connected lists (sortable1 and sortable2) ... and I have two separate buttons. Button 1 to move (append) all items from sortable1 to sortable2 Button 2 to move (append) all items from sortable2 to sortable1 How? TIA, Bob
Graph or Performance bar representation
Hi, I need to display good UI graph or status bar following requirement: Requirement: I have target values and actual values in the system. based on values I need to display image/grapth to user that where he stands based on actual value. if actual value is not meet target value I need to display as red else green. I need to do this in HTML 5 and Jquery. Can anyone suggest me the best approcach. Thanks & regards, Vijay
Autocomplete from JSON file
Hi, I know that there are many topics about Autocomplete & JSON, but I didn't find what I'm looking for... It is very basic: I have some simple JSON file named auto.json: [ {"name": "Audi", "model": "A6", "datum": "12.04.2012", "boja": "crna"}, {"name": "BMW", "model": "X5", "datum": "15.03.2011", "boja": "siva"}, {"name": "Ferari", "model": "Spider", "datum": "01.11.2010", "boja": "crvena"}, {"name": "Jugo", "model": "Koral 55", "datum": "04.04.1991", "boja": "bordo"}, {"name": "Zastava",
Dialog UI Won't Perform Click Action Callback Function
Hello everyone, I'm trying to write a script utilizing the jQuery dialog UI. The form shows up in the dialog box as it's suppose to. The "Submit" button is created. The weird thing is when you click on the Submit button, if I have a "close" action inside the function, it works. But if I have another function to be called inside of the click function, it won't call that function. /** * set the dialog */ var createDialog = function(autoOpen=false, height=300, width=300, modal=true)
Problem with Jquery UI select custom menu open when Mouseover occur.
Hi All, I am using the "selectmenu with custom avatar 16*16 images(select menu i need images)". reference link and code same in this site(http://jqueryui.com/selectmenu/#custom_render ). I have a problem in this selectmenu open when mouse over occur and closes when mouse over out. $('#people-button').on('mouseover', function() { $('#people').selectmenu('open'); }); but it show an error like cann't call methods on selectmenu prior to initialization;attempted to call method 'open' ' add the
Jquery Ui problem regarding to menu select.
Is their any function In Jquery select menu for user clicks the menu select items. My sample code here .http://plnkr.co/edit/7Z3E4UF9oosvnJaykIca?p=preview () Is their any function to call after the user select(clicks ) the menu items.
How to have 2 accordions in the same page
I'm trying to use the accordion in the left and right column of a landin gpage. i've attached the code. i've already tried to modify the XSL for the rightcolumn and change the uid of myhrlinks to myhrlinks2. but it still doesnt work. :( help?
Selectmenu and screenreaders: Selectmenu works with NVDA and IE8, but not NVDA and IE11
Hi there, I'm using a selectmenu widget on my site, and I need to support screenreaders. I've noticed the selectmenu works fine with NVDA and IE8, but not NVDA and IE11. (Probably the first time I've come across something that works in IE8 and not IE11 - it's usually the other way around.) Is this a known issue? Do jQuery UI widgets in general support screenreaders, or is it not something that's tested? Has anyone else come across problems with selectmenus and screenreaders? If so, is there a way
tabs and datepicker
hello, i'm using jquery to implements tabs and datepickers. tabs are loaded via ajax: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//IT" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-type" content="text/html; charset=ISO-8859-1" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/themes/smoothness/jquery-ui.css"
Download Excel - jQuery
I use a jqQuery UI Dialog that collect parameters which should be posted to an aspx page that will download a pre-generated excel file based on the report parameters. I already have a ReportGenerator.aspx page which when executed opens the excel file String filePath ="<path>\Graph_IR_Scenarios.xlsx"; String outputFileName = @"Graph_IR_Scenarios.xlsx"; FileInfo fileInfo = new FileInfo(filePath); HttpContext context = HttpContext.Current; HttpResponse
jQuery UI Dialogs
This is what I am trying to build 1) Trying to integrate jQuery UI Dialogs into my application Effort is to open different html views into the same dialog based on a click on different href links. Enclosing a small snippet a) This is the container <!--Start : report Dialog Container--> <div id="reportDialog" style="display:none;"> <iframe frameborder="0" scrolling="no"></iframe> </div> b) To open a dialog var open = function (reportId, description) { var opt = {
Maintain resizable within RadListBox after postback asp.net
HI - i'm using jquery to resize a telerik radlistbox which works fine - problem is its lost on postback. I was wondering if anyone had any ideas on maintaining the resize position on postback. Thanks! <telerik:RadListBox ID="cboQuestionsListBox" RenderMode="Lightweight" DataTextField="ROW_TEXT" DataValueField="ROW_ID" runat="server" Skin="WebBlue" CheckBoxes="true" Width="300px" Height="340px"> </telerik:RadListBox> <script type="text/javascript"> $(document).ready(function () {
How to make Json with flow model
Reference from Drag and drop After seeing this post i design a new flow model for drag and drop and it work's , but there is a problem i want to save the flow chart so i have to make json for it the desired json i want is link of my fiddle fiddle var sunny = { "data":{ "id":"", }, "key":"", "module":"user", "children":{} }; I want each
autopopulate option in cascading autocomplete if it is the only option
Hi trying to create cascading autocomplete e.g. 1. CITY 2. STREET 3. NUMBER and once the 1st autocomplete is selected then child elements get autopopulated with option(s) if it is the only one. E.g. there can be the only one street in the city and the only one building number on that street so I' like to be STREET and NUMBER automatically to get their value in such case. In case there is more options then classic widget will be shown. Could you please nudge me closer to solution how to extend autocomplete
datepicker skins
Hi. On line 5 of the code below, I have chosen one of the default skins, vader, for the datepicker. It works great but I want to use one of the other default themes. Please see http://jqueryui.com/themeroller/ On the left, in black, chose the GALLERY tab. There are 24 skins available. When I try the skins that have one word, like smoothness or vader , it works great. When I choose a skin with two words, like UI lightness , I get only a shell of the datepicker. Help? <!-- -------------------------------->
Tabs "Jump To" Button
I am trying to have buttons within a tab to jump to a different tab, but get the following error: Error: cannot call methods on tabs prior to initialization; attempted to call method 'enable'. Below is the code I tried. What is the correct way to implement this? <div id="tabs" > <ul> <li><a href="#tabs-1">Nunc tincidunt</a></li> <li><a href="#tabs-2">Proin dolor</a></li> <li><a href="#tabs-3">Aenean lacinia</a></li> </ul> <div id="tabs-1"> <input id="lnk" type="button" value="Jump
Possible bug in datepicker
Not sure if this is a bug, or if I am just doing something wrong/unsupported. <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>jQuery UI Datepicker - Display month & year menus</title> <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> <script src="//code.jquery.com/jquery-1.10.2.js"></script> <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <link rel="stylesheet" href="/resources/demos/style.css"> <script>
How to create a select menu related to another select menu
I am currently studying jQuery but I came across a topic related to select menu. I studied how a select menu is styled by a code as the following: $('#colors').selectmenu({ width : 300, change : function (event, ui) { // put your programming here } }); But I don't know how to add a second select menu with another set of options related to the original menu’s selected option, and so on. Can any one help me by showing how this is done or at least refer me to a reference that does just this. I would
Is jquery IU included in the jquery 1.10
I noted that when I add the library of jquery 1.10.1 or higher in JSfiddle, the possibility for adding the jquery UI disappears. Does jquery 1.10.1 includes the the said plugin. I would appreciate an explanation for this.
IE is messing up my accordions and tabs!
Hi, IE is messing up my accordions and tabs! Can you please help? It looks like IE is not using the ui-helper-clearfix class b/c in the developer tools, all references to the class are crossed out.
missing several *.js progs
After building my custom jquery-ui (1.11.4) I can't find several tools (e.g. jquery-ui-tooltip.js). Where are they?
Can I get JQuery tabs loading via ajax not to abort on tab switches?
Using 1.11.2 of JQuery and UI. I have an ajax generated Tab object that contains clickable elements that add new tabs to this Tab. Multiple tabs can be added. When one of these tabs is selected, or the clickable element is double clicked, the tabs panel is created and the ajax request to load the data is built and initiated. If another tab is selected before the ajax request is completed an ui.jqXHR.error is received with a status of zero and statusText of 'abort'. How can I keep the initial
Need Help with HTML Best Practices with the Dialog Widget (JQ UI)
Hello Forum! Please see code below. Everything works fine, but according to many HTML validators, using <div>'s as children of <li>'s is not best practice. What would you suggest I use instead? <li> works as well, but I'd like to know if there are other acceptable ways as well. Thanks! HMTL <ul class="PM-list"> <li class="dialog">Button 1</li> <div title="Content 1 Title">Content 1</div> <li class="dialog">Button 2</li> <div title="Content 2 Title">Content 2</div> </ul> JS
using autocomplete within jqgrid and german "umlaute" and IE
Hello, I'm using autocomplete within fields in a jqgrid: I attach the autocomplete within the gridComplete function: gridComplete: function(){ ... $(".valueac").autocomplete({ source: "/index.php?id=422&type=9026", .... }); ... } This works fine if the initial value of the field does not contain any german umlauts (ä,ö,ü,). If there are such umlauts I have a problem with Internet Explorer 10 (in IE 10 mode - no compatibility mode) if the grid get refreshed
jquery ui button with glyphicon - is it possible?
Hi, Is there anyway of applying a bootstrap glyphicon to a jquery ui button? My current code for adding a button to our viewer toolbar is: function AddEmailButton() {
var emailButton = $('<input type="button" title="Email Documents" id="emailButton"></input>');
emailButton.addClass('atala-ui-button');
// click action for what to do with the button
emailButton.click(CleanupImage);
return emailButton;
} I've tried adding this into the function: emailButton.html('<span class="glyphicon glyphicon-envelope"></span>');
Trying to slide tabs horizontally when "next tab" button is clicked.
Hi, I have the following code structure: <img id="#nextTab" src="..." /> <div style="width:700px;overflow:hidden"> <div id="tabs" style="width:2000px"> <ul> <li>Tab 1</li> <li>Tab 2</li> <li>...</li> <li>Tab N</li> </ul> </div> </div As the total width of the tabs is larger than the screen, the newly selected tab should slide to the left when the "nextTab" element is clicked. The following code succeeds in moving the set of tabs 300px left, but when trying to set
jQuery Grid: how to render a column in a separate ajax call?
I have a jQuery grid that has 3 columns. The grid is populated by a webservice call. The third column has to fetch data from the server based on the result of the first call. How to achieve this? Currently, I am doing second ajax call in the renderer function, but unable to set the result of that call to the grid.
Localization of Datepicker - How?
Hi, I was reading http://api.jqueryui.com/datepicker/ and I downloaded .datepicker-fr.js from here: https://github.com/jquery/jquery-ui/tree/master/ui/i18n Here is my code: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Example</title> <link href="styles/css.css" rel="stylesheet" type="text/css"> <script type="text/javascript" src="scripts/jquery-2.1.1.js"></script> <link href="scripts/ui/jquery-ui.css" rel="stylesheet" type="text/css"> <script type="text/javascript"
How to create charts?
Hello everyone! For a school assignment I need to create graphs using JQuery UI. They need to be those "bar" graphs. I have googled everything and I can't find anything on Jquery UI forums either. Could anyone tell me where I could start? Here's an image of what I need to create: Could anyone tell me how I could achieve this?
Accordion active by index since 1.10
Hi, Why activate an accordion by Id since v1.10 ? (i'am actually in 1.11) this commande not working for example: (working in 1.9) $( "#accordion" ).accordion( "option", "active", '#ui-id-2'); I want to activate an accordion before update but I can not know where it is placed. So I can activate it by ID. Thanks for your help,
Next Page