multiple selected elements
I simply want to select two boxes, instead of one box at a time. Can anyone help? jQuery UI Selectable - Default functionality *#feedback { font-size: 1.4em; } *#selectable *.ui-selecting { background: rgb(254,202,64); } *#selectable *.ui-selected { background: rgb(243,152,20); color: white; } *#selectable { list-style-type: none; margin: 0; padding: 0; width: 60.0%; } *#selectable li { margin: 3.0px; padding: 0.4em; font-size: 1.4em; height: 18.0px; } Item 1 Item 2 Item 3 Item 4 Item 5 Item 6 Item
Managed multi dialog for a dashboard page
Hi all, When displaying the home page of our web application business I displays several block with dedicated information ( list of my files to my contact list , ...). To make dynamic interface , I encapsulated the block ( div ) in jquery UI dialog (page dashboard ) . I love first results but i have one major point to used this solution. ?) I would like save the position and size(in SESSION variables) after eatch user action on each dialog. In this case, the user finds his "dialogs" as he left them
Tabs :Beforeactivate function is not working on IE
Hi guys, i have the next issue, i have the tabs created and its working, but i want to validate that beforeactivating some other tab, you have already the required fields on this tab filled. so i have this code: $('#content').tabs({ beforeActivate: function(event, ui) { return validationRequired(); }, }); and the weird thing is that i have another action that is Activate and it works in Chrome and IE9, but the BeforeActivate it doesn't
Save size and position (x, y and z)
Hello, I would like to save in localstorage the position (x, y and z) and size of images using interaction ".draggable", ".resizable" and maybe ".sortable". I followed all the instructions of this post : "https://forum.jquery.com/topic/remember-position-and-size-in-a-cookie" and it works fine but only if all the images got different "id". And in my case all the images got the same "class" because I use PHP, GET, SESSION, foreach etc. Does anybody have a solution ? Maybe save in localstorage and
Can't seem to get the tooltip to display text
Hi guys, I've got a page that is not loading the text within the tooltip. Regretfully, the information on the page is still in development and cannot be accessed by the public. but here's an example of how I'm using it: <div title="some title" >content</div> jQuery(document).tooltip({ position: { my: "center bottom-20", at: "center top", using: function( position, feedback ) { jQuery( this ).css( position ); jQuery( "<div>" ) .addClass(
simple Grid in jquery ui
Hi I want to display dynamically Row, column data like Grid/Table JQUERY UI does't have grid control, is there any java script file for dynamic grid? thanks
Jquery UI Menu Widget in a div
I have a div where I am dynamically creating the list for the jqueryui menu widget. A couple of questions - the list flashes visibly before assuming the JqueryUI menu - is there a way to populate the menu in a more hidden way. If the div is hidden then the menu is also hidden. Second and more importantly - I tried using the following: var setMenu = function(mySelector) { jQuery(mySelector).menu({position: { collision: "flip fit"}}); } And the issue is that
Jquery Dialog Height Isuues
please I need help on this: jquery dialog box not at the center when the page height is bigger than the window (the system screen)
Dialogs cross refreshing, how do I avoid that?
Hi all, Noob with a (possibly) noob question. I have a page that has several Dialog forms on the screen...when I drag the one, the other refreshes to its start state, while it should remain in it's present state... Basically, each frame is a div that holds an iFrame, that frame points to a PHP page/file that has a collection of panes overlapping, the first being the start pane to set some filters... When I'd drag the info pane, the page makes a connection to the server and thus refreshes the dialogs
How to create multiple instances of a Jquery widget in a page?
I have created a widget. I want to create multiple instances of the widget in the same page. On doing so, i am getting a problem, What are all the values, in the first instance are same in the subsequent instances. $.widget('srgtech.logicbuilder', { config: { MetaData: {}, WizJSON: '', PageJSON: [], // an array of object contains pageid and its title. ex: { id: 1, title: 'Home Page' } SectionJSON: [], // an array of object
How do I bind the droppable event to dynamically created nodes?
Hey is there any way to bind the droppable event to dynamically created nodes? here my fiddle fiddle Go to my fiddle and drop menu to droppable place (it's work) then drop podcast into menu (it's work) drop music or any element into podcast (can't work)
Embed submit button in Accordion Header
Hi everyone, Long time reader but never posted, Im having issues embedding a form into the accordion header, when the submit button is initated the accordion continues operating as normal and the submit is not triggered. Here is the code, pretty basic, is there a work around for this? So that both the button and the accordion can operate? $(function() { $( '#accordion' ).accordion( { collapsible: true, active: false, heightStyle: 'content' }); }); <div id='accordion3'> <h3> <table>
Autocomplete keypress skip menu
Hi All, I am using jquery-ui 1.11.2 for autocomplete with the following custom menu rendering: function integrationSearchRenderMenu(ul, items) { var self = this, emptyItem = { label: '', value: '' }; ul.append($('<div></div>').data('ui-autocomplete-item', emptyItem).append( '<div class="image"></div>' + '<div class="name">Product</div>' + '<div class="dek">Description</div>').addClass('ui-widget-header')); ul.addClass('integration-search');
How to show modal dialog over an object.
Problem: Modal dialog hides behind the object tag but i want to appear modal dialog over an object .Thanks
Drag N Drop Stops working for some reason in IE 9
I'm a newbie in Jquery. I'm using jquery ui drag n drop (draggable and droppable) jquery-ui-1.10.3.custom.min.js and jquery-1.10.2.min.js, it works , but for some reason it stops working after several seconds when i'm sending some data (using ajax) about columns' position into the server , i can't understand what is the problem and why it stops working (i.e. i can't drag columns with mouse cursor , it only selects text with cursor but doesn't drag the columns). Also i have an issue with helper: "clone"
Dialog modal form demo not working in Firefox?
Hi, I'm trying to understand how the Dialog modal form demo (http://jqueryui.com/dialog/#modal-form) works. I copied the source to a file on my local machine and I'm accessing it through a local apache server. When I use Google Chrome everything works fine, however when I try to access the page using firefox the dialog doesn't appear at all. I get the 'existing users' table but when I click on 'Create new user' nothing happens. The firebug console doesn't show any errors. If I look at the online
How can I get a Single Line Scroll Tab with Sortable Items.
Hello Everyone, I'm trying to create a Tab that can only be on one line and can be scroll left and right with Arrow on the left and right of the tabs. See image: And I also want to combine it with Sortable Items in each tabs and allowing them to move from one tab to the other Like this here: http://jsfiddle.net/tilwinjoy/6PL8H/ How do I go about doing this? Have anyone created any plugin that already does this? Thank you
how to make dragged element droppable again
I am using Jquery UI and creating drag and drop feature. I have div element which can be dragged and then once it is dragged, user can add images to this dragged div element. This is how my code is setup $("#dvSource img").draggable({ //containment: '#gbox', cursor: 'move', helper: 'clone', scroll: false, connectToSortable: '#edit, #edit1, #mainContentDiv' , //appendTo: '#edit', start: function () {}, stop: function (event, ui) {}
Menu for uploading from a web URL or from ones computer
I am trying to reproduce on my homemade site a feature that I have seen on many forums, namely a pop-up menu that allows the user to upload a file either from a URL or from the user's computer. (thus, what I am looking for is exactly like what happens when the portrait icon is clicked at http://math.stackexchange.com/questions/ask for example). The nearest I could reach so far is the very incorrect and very ineffective code below. Any help appreciated. <!doctype html> <html lang="en"> <head>
Building a drag and drop UI, positioning draggable to nearest droppable.
I've pulled and put some code together to position draggable elements on a grid of droppable elements. The droppable grid is made of units (a * b) and the draggable element is (2a * b). I'm hoping to eventually record positions on the grid in a database in order to save positions for future logins. I've pulled some code together, but I'm struggling to make it work nicely. I want the left side of draggable to line up with the closet left side of a droppable grid unit. The problem is that the left
Uncaught TypeError: undefined is not a function
Hello, I'm using b.popup but on click its showing error Uncaught TypeError: undefined is not a function, Uncaught ReferenceError: jQuery is not defined how can i solve it source is http://www.housingmilitary1st.com/
Trouble with .show() method
Hi all, I am new but thanks to code academy, I feel that I have a decent grasp of Jquery and Javascript. I am building a very simple test site to practice my skills but I have run into a problem. I am sure I must be overlooking something but I'm ready to pull my hair out! I am trying to load up a <div> element using the .show() method with the clip effect, however it is doing nothing. The <div> just loads up as if no effects are being applied to it. When swap the .show() method for .hide() with the
JQuery UI Accordion
Hello, I don't know if this is the place to ask but I tried to google my problems and no good solutions and I'm very new to Jquery. Here goes. I did an FAQ using this method below: http://api.jqueryui.com/accordion/#entry-examples the CSS hrefs are: 1. jquery-ui.css 2. structure.css the script hrefs are: 1. the latest jquery file from the website 2. jquery-ui-js The end results it, it works perfectly for Firefox but doesn't work at all for Chrome and IE(10). Can help me with this? Thank you
How to validate indivivual accordion?
I have accordion that works similarly like this: http://jqueryui.com/accordion/ The only difference is we are have textboxes for users to enter data and dropdowns to select data from. Once a user completes the process on each accordion, the user clicks the next accordion and continues the process. The issue we have now is we have not figured out a way to validate form fields on each accordion in such that a user cannot go to another accordion until all textboxes are filled and selections made from
how to call jquery UI datepicker using function?
i have 5 textboxes for datepicker. i need to call datepicker through this function. <tr> <td>Date</td> <td> <input type='text' readonly name="EXPDT1" id='EXPDT1'><img src="calendar.gif" name='imgCalendar' id='dat_img' onclick="return showCalendar('EXPDT1')" > </td> </tr> <tr> <td>Date</td> <td> <input type='text' readonly name="EXPDT2" id='EXPDT2'><img src="calendar.gif" name='imgCalendar' id='dat_img' onclick="return showCalendar('EXPDT2')" > </td> </tr> <tr> <td>Date</td> <td> <input type='text'
Static non-scrolling panel at top of jQuery UI dialog
It would be very helpful if an option could be provided for a static, non-scrolling panel at the top of dialogs, just under the title bar, and above the scrolling section. I realize this would require adding another div, but I think the benefits could be very helpful. The option would require that a height in pixels be provided, with a default of 0 to keep things consistent with current functioning. Also, some way to specify the div for the panel would be needed. I frequently have explanatory text
How do I load this jquery accordion into a div?
Hi, I have a jquery accordion that works fine on its own. When I try to load it into a div located on my home page using a link and the load method, the accordion appears as a list with headings and loses all its functionality. My working accordion can be found in http://jsfiddle.net/jenova007/jhhpovzb/ I would like to load this accordion into the "result" div when I click on the "Store Locations" link. After making many attempts I end up loading the original accordion page or loading a list of
Jquery UI & arabic letters
Hello guys, I use for my arabic site the Jquery UI and it works fine with all browsers except IE (11). It shows the letters but not correct. here in the images you can see screenshots example for the button in chrome and IE. the first one of chrome is correct and the second is of IE. and here is the head <meta http-equiv="content-type" content="text/html";charset="utf-8" /> <script type='text/javascript' src = './JS/jquery-1.11.1.min.js'></script> <script type='text/javascript' src = './JS/jquery-ui.min.js'></script>I
I nested a tab box into an accordion. There's a ton of blank space beneath the tab box.
Hello all. I'm loving JQueryUI so far, however I've run into a problem that I don't quite know the solution to. I have a tab div nested within an accordion div. It all works fine, but there is a TON of extra space after the tab div. I've tried changing some values around in the master .css file (jquery-ui.css), but can't find what's causing this. Here is a picture with the problem area circled in red, I can also post my code if you would like. There's a small amount of custom CSS in the page at the
Video stops when using effect on show
I'm trying to add an effect when a video is shown, this works with the simple fade effect, but anything else e.g. scale stops the video when the effect is completed. See http://jsfiddle.net/6roxf1a1/5/ The following stops the video 2.5 seconds in: card.show({"effect":"scale", "duration":2500}); Using the fade effect the video keeps on playing: card.show({"effect":"fade", "duration":2500}); The video also stops with other effects such as bounce, slide, clip and blind (haven't tried all the others)
JQuery SelectBox - adding an .active class when expanded
Hello, I've been trying to understand how to select and style jUqey's SelectBox when it is expanded. There seems to only be an ARIA attribute, aria-expanded='false' / 'true' but targeting the SelectBox this way doesn't seem correct and I haven't been able to apply styles this way. Does anyone have any insight into targeting the SelectBox while it is expanded for CSS styling?
drop event does not trigger in firefox
Hello, I built a drag/drop layout builder that works in chrome and safari, but in firefox and IE 11 the drop event is not fired. Is there something special I need to set/do for firefox and IE?
Strange behavior when draggable div floats on the right
Hello, I would ask you if there is a reason for which, if I use: "right": "0", at 55th row of javascript code of this demo (like at 45th row), it doesn't work, whereas, if I write in that way: "left": $('body').width() - $(this).outerWidth() it works as expected. Thanks a lot, Cheers, Riccardo
how to wrap parameters with Data attribute from ajax get call
please look at the code below. the web method is not firing when i wrap "data" attribute in double quotes(" ") like [ data: " { 'Name' : '4' } " ] in ajax call. am wrapping in quotes because i have to pass textbox data dynamically.let me know the reason pls. $('#txt').keypress(function () { var date1 = $('#txt1').datepicker().val(); var x = 10; $.ajax({ type: "GET", url: "school.aspx/GetEmployees",
Having trouble with resizable()...Please have a look...
hi forum, im totally new to jquery and trying to play a little bit around. i hope that my question is not to stupid but after playing and trying for hours i decided to ask you. i have one thing i dont understand and i have no idea how to get this work. i tried to find a answer and i was searching hours... but i dind't this is my code: <script src="js/jquery/jquery-ui-1.11.2.custom/external/jquery/jquery.js"></script> <script src="js/jquery/jquery-ui-1.11.2.custom/jquery-ui.js"></script> <style>
Having trouble with the Menu widget
Very new to jQuery, can anyone tell me why I cannot get the menu widget to work? I would appreciate it so very much. Firebug is giving me the "function not defined" error. Here is my code: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>In Page Viewer</title> <link href="../_css/site.css" rel="stylesheet"> <style> #navigation ul, #navigation li { margin: 0; padding: 0; list-style-type: none; } #navigation a { background-color: rgb(204,204,204); text-decoration: none; font: 16px 'ColaborateLightRegular',
Having a problem with Datepicker -
Hello, I have a website that is using the datepicker control. The problem I am having is that sometimes (like 1 in 50) if a date is put into a textbox, and then you click back into that textbox to delete the date, it won't work. You need to click inside the textbox a second time in order to be able to delete the text inside the textbox. What can possibly be done to remedy this? Here is how it is implemented: <script language="javascript" type="text/javascript" src="../../Scripts/jquery-1.9.1.js"></script>
Datepicker Problem
I'm trying to create a datepicker inside a <div> tag like this index.html <div id="tab-information"></div> SomeJSScript.js $("#tab-information").append('<p><input type="text" id="datepicker"></input></p>'); I'm making some other things on the javascript file and works fine, only this line doesn't work. Some help?
Autocomplete jQuery UI with geonames (how to addMarker)
Hello I am using jQuery UI Autocomplete pluging with geonames. I would like to place Maker on search how can i do it here is my code jQuery(document).ready(function($){ $("#pwGeoAddressTxt").autocomplete({ source: function (request, response) { //alert(selectregionuser); var textvalue = $("#pwGeoAddressTxt").val(); if (textvalue != '') { $.ajax({ url: "http://api.geonames.org/searchJSON?featureClass=P&lang=local&style=full&maxRows=12&name_startsWith="+textvalue+"&username=shakti",
jQuery UI - Progress Bar With Images
Hello, I am trying to create a progress bar using jQuery UI. I have two images: a "container" and a "filler". I am using the following code: <script> $(function() { $("#progressbar").progressbar({ value: 100 }); }); </script> <style> .ui-progressbar { background: url(jquery-ui/bars/1/main_bar.png); border: none; background-repeat: no-repeat; width = 890px; height
Next Page