How to display Local file and directorys in modal popup
Hi Team, As per our new requirement, I have to develop customized File browse functionality. In model popup i have to show user local directory and available files (exactly windows browse popup) and available files i have to assign check box for each file and then, user select and upload one file at a time. Please suggest if any inputs available to develop modal file upload popup. Regards, Srinivas
Firing an event only when resizable has "snapped" to a grid.
I am using a jQueryui resizable element and want to fire an event only when the element snaps to a gridpoint. I have looked at event an ui and I just do not see anything there stating that the size of the visible element changed. Am I missing something?
tabs not same when jquery ui upgraded to latest version from 1.8.1
Hello, Using jquery ui 1.8.1, I have the following: Using jquery ui 1.10.1, I have the following: I can't fix the css so that the green bar overlaps the inactive tabs (it works in 1.8.1) using the following code: .ui-tabs .ui-tabs-nav li.ui-tabs-selected { margin-bottom:0px; padding-bottom: 4px; } I believe this is a jquery bug that needs to be fixed.
Tooltip efficiency
I have a page with a fairly large table (~2500 rows x 15 columns). The cells in four of those columns can display tooltips if they contain data, but the tooltip setup is the same for all of them. Because this appears in an internal application that is restricted to IE8, the processing on this is pretty slow. Is it more efficient to create one tooltip using the table id as the selector or would I be better off creating individual tooltips for each cell that needs one?
how to set width height of modal window
Hi, I have a modal window and need to set witdth & height of it. Here is my code for modal window. Setting attribute of width:200px height:300px doesn't work. How would I set it? My browser is IE 7. Many thanks <script type="text/javascript"> $( function() { $('#ModalForm1').dialog( { modal : true , autoOpen : false , buttons : { Cancel : function() { closeModalAndReset(); } , Update : function() { closeModalAndUpdate();
Problem with button state inside modal dialog called from another modal dialog
I have a problem with the state of a dialog button that is included within a modal dialog called from another modal dialog. The second modal dialog loads fine, but the button in the dialog initializes in hover mode and no rollover effects seem to be working. The click function on the button works without a problem. I seem to remember reading somewhere that this was a jQuery UI bug? Any help greatly appreciated.
Autocomplete. Why wont you work?
I have this script $(document).ready(function() { $("#Search").autocomplete('loadxml.asp', { minChars: 2 , matchSubset: false , matchContains: true , width: 290 , max: 10 , scrollHeight: 600 , dataType: 'json' , parse: newParser , cacheLength: 10 , selectFirst: false , formatItem: function(row) { return row['value'] } }).result(function(event, data) { window.location.href = data.url; }); function newParser(raw) { var array = new Array(); var prodCount = 0; for (var i = 0; i < raw.length; i++) { if
Problem with Tabs and SelectBox
Hi, i have following problem i think its only on Internet Explorer 9. Theres a jquery UI tab on my website with a form and drop down menus in it there will only show three letters of four letters. Example: <option value="herr">herr</option> <option value="frau">frau</option> Website will only show "her" and "fra" but only with Tabs. Example on web: http://citybreaker.square7.ch/1/
datepicker focus steal (for lack of better word)
Hi I have an external js library that I use to create tooltips. That's all the library does. I generate tooltip content dynamically depending on items the mouse hovers on. On this tooltip I use an input field to allow the user to choose a date. For date selection I use datepicker. The problem: The tooltip works in such a way that if the mouse goes out of the tooltip area, it will disappear. So when the mouse is moved to the datepicker, the tooltip is gone and only the date picker remains. What I
How to save state of the page same on next run with movable and sortable items?
I have a page created with div.columns and div.items. All the items can move from one column to another and also you can sort the order of the items inside the columns (something like the portlets sample on jQuery demos). Is there a way so save the current state of the page layout so I can see the same layout when I (or someone else) opens the page next time?? If possible what solution you propose and how to do it? Some demo or sample link?
Having trouble with tabs appearance
Hello, I'm trying to duplicate the appearance of tabs (see below) where the green coloured border goes behind the active tab but overlaps the inactive tabs.It's also thicker than normal. After modifications, especially to .ui-widget-header { border-bottom: 4px solid green/*{borderColorHeader}*/; color: #222222/*{fcHeader}*/; font-weight: bold; } .ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 4px; margin: 0 .2em 1px 0; border-bottom: 0px !important; padding: 0;
Why am I getting this "Stop Script" message in IE7/8 when using a select list in a dialog?
Hi all, I have a select menu inside of a jquery dialog on a page. The list is fairly long, 1450 items. When it is on the page it's self, it works fine. However when I embed it in a jquery ui dialog and click on it in IE7 or 8 (haven't tested 9), I get the infamous "Stop running this script" error, and the menu never opens. The page uses the jQuery validate plugin on the form, but removing that doesn't fix the problem. There is no other JS attached to the menu.
2 lists one sortabel one draggable.
I have a list of items on the right of the screen, I'd like to be able to drag from this list and drop the items onto a list in the middle of the page which is sortable, I need the original list items to stay in place so that you can go back drag them on again. I have the sortable list in the middle of the screen, and the list on the right is draggable but how do I make the draggable items droppable onto the sortable list in the middle of the page? Its not connected lists I would like to use
how to delete the droppable element in a container
my coding is here: <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title> UI Droppable</title> <link rel="stylesheet" href="css/jquery.ui.all.css"> <script src="js/jquery-1.9.1.js"></script> <script src="js/jquery.ui.draggable.js"></script> <script src="js/jquery.ui.resizable.js"></script> <script src="js/jquery.ui.selectable.js"></script> <script src="js/jquery.ui.droppable.js"></script> <script src="js/jquery.ui.mouse.js"></script> <script src="js/jquery.ui.position.js"></script>
Tabs example not working - all tab content shown
Hi there, just tried the example of jquery.com with tabs. I've set up jquery tabs with the ui. Included js and css is there aswell as jquery is. But as soon as I load the page the tabs are properly shown but in every content is the full content of each tab content on top of each other. The code is exactly the same as shown in the jquery-ui documentation but not working. Here my includes <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
Sortables in Between Multiple Dialogs Connection/Floating Issues
Issue: http://jsfiddle.net/Drath/Y9k3P/ I've been having this issue connecting two jQueryUI sortable lists in between two dialogs. The issue comes down to floating. If you move the sortable around it's own dialog, it works perfectly. If you try to move it to the other dialog, it will fail to register as the element that "accepts" the sortable has no height, because all of it's elements are floated. What I've tried: Tried using display:inline-block instead of float. This does work, but makes drag/drop
Tooltip : how to position the tooltip in relation to the mouse without tracking
I would like to position the tooltip in relation to the mouse position, without using the track option. The same behavior than windows system tooltips. $(document).tooltip({ position: { my: "left top+5", at: "left bottom", of: ??? } }); Thanx
Tooltip - different options for different elements
Hello, is possible to have different tooltip options for different elements? For exaple .quick-tooltip class will have delay 0 but default tooltip has this option set to 250? It is ajax application so $(".quick-tooltip").tooltip() will not work. I know I can create tooltips live with $(document).on() function but I am wondering if there is simpler way to achieve this behavior. Thanks
upgrading jquery ui 1.8.5 to 1.10
i am using autocomplete in one of my project. I want to upgrade from ui 1.8.5 to 1.10.1 . i simple include the new new libraries of jquery and jquery ui and autocomplete is not showing the result menu, it just displays the text "2 results are available" and i can navigate among the result but menu for selection is not displayed. here is the code for autocomplete. function initLoc() { $(".location").each(function (index) { $(this) .bind("keydown", function (event) {
Bug 6198 (Datepicker Dropdowns in ie) still happening
We have upgraded to jquery 1.9.1 and jqueryui 1.10.1. The bug described here: http://bugs.jqueryui.com/ticket/6198 is still happening for us even though it was supposedly fixed in 1.8.15. How can we stop this bug from happening? The bug requires that you click the month and year dropdowns twice - basically doubleclick - in ie or the dropdown will "flash" and close.
jquery tabs and search form in one tab
I am a middle school geography teacher learning web programming. For my school, I am creating a single-page multi-tab portal with four jquery tabs. I'd like the fourth tab to contain a form and also search & display MySQL query results. My problem is, on the fourth tab, once I enter the search term and hit the "Search" button, the results are not loading in the fourth tab. They are loading on a separate page: http://localhost/notes_search.php How could I get the results to appear in the fourth
Dialog has wrong position in form
Hi, I have a problem with dialog which is using inside a form. I want to make my dialog inside a div (which is parent for the form) attached to the left top border. Dialog must be looked not like a modal form Example of html: $(function () { $.fx.speeds._default = 1000; $("#dialog").dialog({ modal: false, draggable: false, autoOpen: false, resizable: false, width: 300, height: 200, position: {
Themeroller - Download Theme button doesn't work
I'm doing custom theme. When I click on the Download Theme button nothing happens. I don't see any error messages. Am I doing something wrong? My theme is: http://jqueryui.com/themeroller/#!zThemeParams=5d00000100fc05000000000000003d8888d844329a8dfe02723de3e570162cf18d27450c454aa2f2e374d1d127fabb9ebc66c3ee5a70fb154870371702db6720bcd83f0ecbb2131337f10a086e219c538a2003e4a05b37f637b91dbf9e5ea1a30eee0f7354635c67587b16e39b844855d43f178d3256e5c08e1739f2e7f44d5677fb1c0b74e5addbb01d04c4cd2f9c08a17993d9a0c6f776a3be16c4998202c49ba6fc48ba1dff02a4d3effa4387d8db60c4d34408895c6dee3e7bbb9d431c111102f3f085b74a794946ca20e65f2fcb155a8a4c905815b170210695f186094f50279e13ffd30f51530f99453a7dd71fc23ea3f414fd71144eff4e10d46ef9933a8af3b63d3a2d07ebf83031bc33fb83d8d9ff662591338e3367b47a29ca5abd21a8bed9fcff5f3990cc13efb069298fcfdfe672286a48da7ea8cf902da3a63cd8e52ade6f5a39eb1bf941692f2b8381785b7a3b5d21c24559f338f92fb6eb4dd181da73e8fef31a0739d9681ad3d04aafb72cbacd98724ff620995302caeec3f18518f5b423a38bada8a58516aa2c09ca7b9204a92ffabaa157a6acc29311626ac39720aa217e94d1d932e75657604c88fc2e510bb7ec6ad16835d7a6b56a52973d13a5b18e2ea0ab4d4c4e5dad52d7638abaffd2a54520
Which framework to use
I'm going to be starting a customer portal project soon and wanted to get opinions on whether or not to use jquery and jquery ui or start with jquery mobile. Mobile users should have access so I was going to use that but what if any support does jquery ui have for mobile? I do like most of the functionality from UI and would rather use it, but if mobile isn't really supported well I can't start down that road. Any help would be greatly appreciated!
Weird jquery tab problem
I am getting a very strange behavior using the latest versions of jquery and jquery ui - they are inserting the index page of the website into the tab area. Never seen anything like this. I have used earlier versions of both in the same kind of website without problem. Found nothing about this via google.
how to get x,y coordinates and position when the div is resizable
while resizing the div i need to get the resize position
Issues on Dialog in IE8
Hi all, I'm trying to put a very simple dialog in an app, unfortunately it does not seem to work on IE8. The code is : $('<div id="dialog-confirm" title="Validate?">'+val+'</div>').dialog({ height:250, width:400, modal: true, buttons: { "Confirm": function() { $(this).dialog("close");
Is it possible to control a scrollable jquery ui dialog using keys (PgUp, PgDn, … spacebar?…)
I have a jQuery UI dialog that has enough content to trigger the appearance of vertical scroll bars. I found that the only way to make it scroll was to either click-and-drag the scrollbar, or click in the scrollbar area - i.e. it was not possible to make it scroll using the PgUp or PgDn keys, nor the arrow keys or spacebar, etc. What would be the best way to enable keyboard activated scrolling? [Note: I'm actually using an enhanced version of the jQuery UI dialog (http://www.fieryprophet.com/demo/jqui-dialog-minmax/)
Question about Spinner in .NET
I'm somewhat new to jQuery, been using .NET for a long time. I'm using the spinner box and trying to get the selected value on the server side, does anyone know how to do this? Its easy enough to set the UL to runat=server, then the UL is available as an HtmlGenericControl in a button click event. I tried sel4.value , but 'value' isn't available for HtmlGenericControl. Any suggestions would be helpful. <ul id="sel4" runat="server" class="ui-spinner-box"> <li>Monday</li> <li>Tuesday</li> <li>Wednesday</li>
two cities
Hello, I'm using this plugin: http://jqueryui.com/autocomplete/ # remote-jsonp how do I change it to insert two cities (birth and residence)?
javascript onclick call in jquery ui tab not working
I have a page where I'm using jquery ui tabs and in each tab I am displaying a table of data that has an onclick javascript function call for each row of data. When I click on a row in the table my javascript function is not working any longer and I am getting the error "TypeError: $.prompt is not a function". This code worked before I put the tabs on the page. Any suggestions?
jQquery UI Autocomplete
Hi guys! I've used jquery-ui-1.8.20's autocomplete and it used to work fine. Then, I changed it to jquery-ui-1.9.1, and it failed. I'm using not only autocomplete of jquery-ui-1.9.1, but other features too, like dialog, so I don't want to have 2 versions of jquery-ui in my project. Here is my code: $("#searchBox").ready(function () { $('input[id$="txtPredictiveSearchBox"]').autocomplete({ minLength: 1, delay: 200, autoFocus: true, highlight:
autocomplete: prevent close when hiding virtual keyboard on mobile
I'm using the jQuery UI autocomplete in a jQuery mobile page (so I hope I used the right forum, it might be a bit of a border-line case but I think I should fix the issue within jQuery UI). When I use the page on a mobile device the autocomplete box pops up and technically it works as expected. Now my problem is that there might be only very little screen space and the device's virtual keyboard takes up a lot of space. I'd like to close the virtual keyboard with the built-in button. My problem is
Problem with child nodes having same element name as parent
I'm trying to go through a collection of objects and read out a value 'location' for each, however, I don't want to pull out any values for each object's children that also may happen to be called 'location'. Using 'find' brings all the 'location' values right down the tree, whereas I just want the location values for the current level. e.g. <building> <office> <location>1st floor</location> <person> <location>office 10</location> </person>
accordion with content before hearder
Hi i wanted to know if is it possible to show the content up the header and not under it ? Thank you already for your answers. Jomania
[datepicker] Add custom text to a cell. Which way?
I need to show custom text on some dates at Jquery UI datepicker, to be more precise, to render a specific price for some dates. My idea was to use beforeShowDay to attach specific price in titles of such dates and then, in beforeShow to check out each td and to place title's text into the cell. Example: var m, d, y, checkDate, specificPrice = ''; var specificPrices = {"2013-3-8":"300 EUR", "2013-2-26":"263 EUR"} $('#my-datepicker').datepicker({ beforeShowDay: function checkAvailable(date)
I would like to pay for some jquery input....
Hi all, I'm posting this a 2nd time as I've had no (proper) responses to it first time. I need a jQuery based dynamic database facility to be added to my website. I have no idea how to do it and too little time to learn. I have therefore decided to offer someone an opportunity to earn a bit of money and maybe even get a job later. In the short term, I'll tell you what I need - you come up with a price. If we agree, away we go. The 'winner' will be offered any further work that comes along, but
popupLogin example - JQM 1.3.0 - popup in popup - cut and paste mistake?
Below is the start of the code sample for the popupLogin example. Note that the popup is inside of a popup. The outer popup has an id of popupMenu so I am thinking there was a cut and paste mistake when the example was created. The example works because the definition of popupMenu is present. But, I can't see why there would be a need for the popup with an id of popupMenu wrapped around the popup with an id of popupLogin. <a href="#popupLogin" data-rel="popup" data-position-to="window" data-role="button"
Multiple drag in a single drag
Team, I have a situation here .I want to drag mutliple items in a single drag.Is this possible. I have put in a small piece of code which drags one item at a time.below is the code .Can someone help me here. pageLoad =function(){ $(".block").draggable({helper: 'clone'}); $(".drop").droppable({ accept: ".block", activeClass: 'droppable-active', hoverClass: 'droppable-hover', drop: function(ev, ui) { var dropguy = $(ui.draggable.element).clone(); var id = dropguy.attr("id"); var
Problem with Resizable()
I am currently facing issue with Resizable(). If i open div with screen size and moving it by using draggable(). I am unable to click the links on the page. I can click on the link only when i re-size the div.
Next Page