Jquery Drag and Drop Card Sort App
Hi, I am building an app in jquery as in LinkedIn KornFerry.com - CardSort App. here is the link. https://linkedin.kornferry.com/InSight/CardSort Jst login with your linkedIn Credentials and click on "Get Started Now". You will see the app which we can rotate the images and drag and drop in a particular box. I am done with rotating the images and drag and drop in a box. But I not able to arrange those images in a box properly, and I want to know which image is dropped in which box. ? I am new to
showing one modal at a time
Hello, I have a list of cd track. I want to use a modal for showing the songtext of every track. I used the following code based on the jquery dialog example. <script> $(function() { $( "#dialog0101" ).dialog({ autoOpen: false, show: { effect: "blind", duration: 1000 }, hide: { effect: "explode", duration: 1000 } }); $( "#dialog0102" ).dialog({ autoOpen: false, show: { effect: "blind", duration:
Combine Two Accordion Functions
I'm setting up the Sortable Accordion widget but would like it to have the Collapsible function as well. When I drop the Collapsible script into the header with the Sortable script, the whole setup breaks. How would I combine those two? Thanks. Great site, great stuff goin' on! Cayce
FF Bug with Dialog and Datepicker - jquery-ui-1.10.0
Hi all, I have seen other issues with the month and year datepicker dropdowns in a Dialog in Safari, but not in FF so I think this is a new bug but I'm not 100% sure. Has anyone else experienced the following? I open a Modal dialog in FF 18.0.1 which contains a form with a date picker with the change month and year dropdowns enabled. When I click the input field to open the datepicker and then try to use the month and year dropdowns, they are not clickable, focus remains on the first field in the
Jquery explode animation
Hi all,On my website I am using hide() and show() animation for a list wich appears when the listmenu is changed and it's writen like this in Js file $('#find').show(1000); $('#find').hide(1000); recently I saw something in Jquery UI website and tried to use it but it didn't work $('#find').show( "explode", {}, 1000 ); my table just become visible and invisible without any animation and sometme it doesn't work either this is the website if you need to look to give me advice http://delimes.ru/
make a list of draggable elements, sortable
Please, look at this semplified code: $('form').submit(function(e) { [...] append submitted element to ul.list [...] $('ul.list').sortable({ //the ul list have to be sortable stop: ... }); $('ul.list li').draggable({ //the li element could be dragged to another div }); } The code above: -add a li element to a list - add sortable behaviour to ul container - add draggable behaviour to li element The purpose is to let the dynamically created li 's to be sortable in the parent list and
tabs and the print stylesheet
just wondering how i would "disable" tabs for a print style sheet, so that the content of all tabs would be listed and print. roxstyle
Loading a file into a div, CSS/UI not applying styles to classes in Firefox, but will in IE, kinda...
Example of what's going on: (".analyzer").click(function () { if ( $(this).attr('id') == 'ct50' ) { $('#analyzers').load('ct50.html'); $('.CT50').show(); } else if ( $(this).attr('id') == 'status' ) { $('#analyzers').load('status.html'); $('.Status').show(); } else if ( $(this).attr('id') == 'plus' ) { $('#analyzers').load('plus.html'); $('.Plus').show(); } else if ( $(this).attr('id') == 'connect' ) { $('#analyzers').load('connect.html'); $('.Plus').show(); } else if ( $(this).attr('id') == 'ct500'
JQUERY UI - Dialog UI load $post content
Hi I have this script $('.modifica').click(function(){ var oTBL = document.getElementById('example') var row_number = $(this).closest("tr")[0].rowIndex; alert("row number: "+row_number); var value = oTBL.rows[row_number].cells[0].firstChild.data alert(oTBL.rows[row_number].cells[0].firstChild.data); alert(value); $.post('dati/testuali/test.php',{title: value} , function(resp){ $('<div>').dialog({ modal: true,
Jquery Accordion expand and collapseall
I am newbie..I want to know whether expand all and collapse all can be put in accordion.I have seen in the answered questions that accordion does'nt consist of more than one active panel...plez check this link. i want something just like this and in same code that you have used in jquery web site for accordion...Plz let me know what changes i need to make in the given code of yours to get result as shown in the link.Thanks in advance.. http://www.snilesh.com/resources/jquery/jquery-expand-collapse-expand-all-collapse-all/
Problem with Auto Complete "Search" Event
Hi Experts, I am using autocomplete plugin & it is fine. Now I have a bit different scenario. My auto complete will work only for few selected words/phrases. So, I have decided to check the work/phrase entered by user. I have used Search event where I check the word. Now my question comes into light. Below is the Search event syntax: search( event, ui ){} My question is: 1. Here what is "event" & 'ui' ? I read the docs & I know that event is of event type & ui is of object type. But here what they
Help IDing dropped object
Hello, I have a draggable object, just a div that says different things. diff inputs inside. I want it to clone. So I can drag them from a list onto my target [code] $( ".draggable" ).draggable ( { helper: "clone", cursor: "move", } ); [code] target droppable [code] $( "#droppable" ).droppable ({ drop: function( event, ui ) { alert(ui.helper.name); for( key in ui.helper ) { if(ui[ key ] != null) { // alert( "key is " + [ key ] + ", value is " + ui[ key ] ); } } [/code] object [code] <div
jQuery UI in a Firefox extension
Hi all, maybe it's a question already asked in the past, but I haven't been able to find a solution. I'm able to load in my Firefox extensions jQuery, but I cannot do the same with jQuery UI... I receive this error: Error: TypeError: div is null Source file: chrome://myext/jquery-1.5.2.js Row: 5653 I'm loading it with the following code: loadLibraries: function(context) { //load jQuery var loader = Components.classes["@mozilla.org/moz/jssubscript-loader;1"]
Problem with Jquery Modal UI
Hello all, I have problem with jquery modal dialog that i have put a server side button of asp.net inside the modal dialog and raised a event from it and written some script under button click.but when i am clicking the button present inside modal dialog then the event is not firing. Please help me , Thanks in advance...
Help in JqueryUI
I want to make a jquery plugin in which I want to make a combination of your selectable(eg. http://jqueryui.com/selectable/) and sortable#connect-list(http://jqueryui.com/sortable/#connect-lists) because i want to add two button by which i can move selected items in right list and vice versa.
Accordion Not Rendering
I get on this error Uncaught TypeError: Object [object Object] has no method 'accordion' whenever I run my jquery accordion. I am not sure what is causing this error. I can run the exact same code in a seperate html file. I am wondering exactly what could cause this error. I have tried removing other jquery plugins and jquery code, and still the error occurs. Can anyone offer me advice on how to troubleshoot?
Drag and drop between windows
I have a page that loads and then that page's JavaScript opens a popup window that will become a gallery. The user will upload images, using JavaScript and PHP that is part of the popup gallery window, and these uploaded images will be displayed in the gallery window that we popped up Once several images have been uploaded and displayed in the gallery window I would like to drag and drop them into the primary window. Actually I'd like to leave the image in the gallery and just drag a ghost image
Datepicker not showing up when placed inside selectable in Firefox
Using jquery v1.9 Using jquery ui v1.10.0 The easiest way to show this was for me to create a jsfiddle demonstrating the issue... it can be found here. The desired effect was to have the user select one of the items in the selectable and then append an input element bound to a datepicker to said selectable item.... Works perfectly in Chrome however in Firefox v.18.0.1 the datepicker refuses to show up after clicking on the input. Is this a bug or am I doing something wrong? Thanks!
JQUERY UI - Tabs ajax load doesn't work bug?
Hi from here http://ugom.comuf.com/meteo/stazione_meteo/dati_storici/ (sorry for slow site but find i fast one in not easy) select "dati giornalieri" pick a day shuold appaer a tab ui the problem is if I pass from "dati testuali" to "performance gfs" is all fine If I pass from "dati testuali to "grafici" is ok but after i click on "performance gfs", performance gfs I obtain a blank page. If after I click on "dati testuali", "Dati testuali" is correcly showed substantially each time I pass from "grafici"
jQuery UI Autocomplete problem on Kindle
Hi, i have a problem on Kindle. The UI Autocomplete script is not working well because of Kindels Autocorrect. Basically when the autocorrect is off the script is working perfect. Can someone help me with this ? BR, Dragos
Delimiter for multiple words on Autocomplete plugin
Hi, I have a question - how to make autosuggest after simple typing word, without delimiter or after whitespace: select: function( event, ui ) { var terms = split( this.innerHTML ); // remove the current input terms.pop(); // add the selected item terms.push( '@<a href="' + ui.item.link + ui.item.value + '">' + ui.item.label + '</a>'); // add placeholder to get the comma-and-space at the end terms.push( "" ); this.innerHTML
Jquery Dialog With Scrollbar In IE7
Hi, I am loading a page using jquery dialog. If you notice the dialog box in the image content starts some where in the middle if there is more data on the page and there is a scroll bar for parent page also. I want the content to be start from the top of jquery dialog & no scroll bar for parent page. Any help would be appreciated.
Show popup outside an iframe?
Hi! I'm forced to work with iframes in a project. The jQuery Mobile header is in a iframe and I have a button with data-role="popup" Header.aspx <div data-theme="b" data-role="header"> <h3>Title</h3> <a href="#popupMenu" data-rel="popup" data-role="button" data-icon="check" data-iconpos="right">Popup in Default.aspx</a> </div> <div data-role="popup" id="popupMenu" data-theme="a"> <ul data-role="listview" data-inset="true" data-theme="b"> <li data-role="divider" data-theme="a">Popup API</li> <li><a
Slider Madnezz
Hey everyone, I've been searching for weeks on how to get a slider working but I can't figure it out so here is my cry for help.. I came across this lovely post:http://atomicrobotdesign.com/blog/web-development/infinite-slider/ Now what this does is show images (or i use divs) accross the entire screen. What I want to do is show only 4 images in a seperate div so the previous or following are invisible until you click next or prev.. I also want to have links on my page and when you click them the
tabs: Change Ajax data loaded before append
Hello all. I've some tabs loaded dinamically with AJAX. BUT, my datasource have it's own images repository and it uses relative paths. So, I'm receiving from AJAX calls something like this <img src="/apps/images/XXXX.png" /> I'm trying to change these src attributes, but I can't wonder what is the correct place to do this. I tried in beforeLoad event, change the images but, after that, I can't stop the default tabs load behavior and jQuery insert the original data content, overriding mine. I also
DatePicker double update not working ... (noob)
Hi, Bit of a noob at this, fumbling along best as I can ... This bit of code is working fine ... <script> $(document).ready(function(){ $(function() { $( "#datepicker" ).datepicker(); }); $( "#datepicker" ).change(function() { $( "#datepicker" ).datepicker("option", "dateFormat", "DD, d MM, yy"); }); }); </script> ... <td class='xx_tdc'><input type='text' id='datepicker' size='30' /></td> But when I try to add this in it only completes the first step (format the date)
Accordion and subcategories
I have the following php code: class Categories { var $exclude; var $depth; function __construct() { $this->exclude = array(); $this->depth = 1; } function get_menu() { $nav_query = mysql_query("SELECT * FROM categories WHERE parentid='0' ORDER BY order_by ASC") or die( mysql_error() ); $tree = ""; // Clear the directory tree $this->depth = 1; // Child level depth. $top_level_on = 1;
Duplicates after Drop
Hello. I have problem with drag'n'drop. When I drop element I create text (for sample) in drop zone. But instead of one string, I have two strings. It's very strange and I can't understand why it's happens. $(".draggable").draggable({helper:'clone', zIndex:1000}); $("#dropzone").droppable({ accept: '.draggable', activeClass: 'droppable-active', hoverClass: 'droppable-hover', tolerance: 'touch', drop: function(ev, ui) { var
Dialog + buttons + modal + postback
Hi all, I'm trying to put JQuery Dialog into my ASP.Net application. The problem I'm getting is that when the user clicks on the "I Agree" button I want to do some server side work and then go back to the same page with a confirmation. So the way I thought about doing it was creating a asp.net button, set to display:none and I would call this from the dialog buttons. Unfortunately I can't call ASP.Net controls from the dialog until I assign the dialog to the form: $dialog.parent().appendTo(jQuery("form:first");
UI-Spinner
Hi Everybody Does somebody know, how to prevent the spinner-widget from editing. Spinning should stay enabled, but it sould be impossible to click the textbox and enter an value. Is there a simple way to realize that? Best regards peppich01
jQueryUI draggable helper ok in IE, wrong position in Chrome, Safari
I am struggling in understanding why this JSFiddle I set up with Isotope http://jsfiddle.net/PpAdu/ (basically I set all elements as draggable) it is functioning right under IE while when dragging in Chrome or Safari the helper position retains the distance from the first element. I.e. if you drag whichever element in IE it will be ok, while in Webkit only the first top-left element is correctly dragged...the other show the helper at a distance equal to the distance from the first block. Can you
Sortable Connected Lists MySQL Update Problem
Hey everyone, to start off I'm very new to all of this and I've been attempting to teach myself coding for a couple weeks to design a web based app for a project at an internship. I've created a sortable list that exports the positions of each item to a database so upon refresh, they don't change. I ultimately want to have 2 lists that update a database and keep the positions of each item on the lists, but I haven't gotten there yet. I am currently having trouble with my connecting lists and I think
JQuery UI tabs notgetting selected
Hi, I'm trying to add a new tab dynamically to the JQuery-UI tab. The problem is that the newly created tab is not getting selected automatically. I want the newly added tab to be selected automatically. How to fix the problem? This is my code: $(document).ready(function(){ var tabs = $("#container-1").tabs(); $('#add_tab').click( function(){ var ul = tabs.find( "ul" ); $( "<li><a href='#newtab'>New Tab</a></li>" ).appendTo( ul ); $( "<div id='newtab'>Name
How do I show an 'openDialog' box to retrieve a path ???
Hi, When my user cIick the button, I need to show an 'openDialog' box to retrieve a path. Is there possible? How?
Complicated ui range slider
Good day! I am totally confused with solving one solution. I'll be very glad if you help me! I need to create a sophisticated version of jQuery UI Slider. Part of the work I've done at the moment, here I upload the image screen what I have but I need to create more complex range price slider and this is a screen image from psd file what I need and trying to do , so if you can see I need to create a hidden price range or something else, maybe I am not right? (you can see the light green line - lately
[ui 1.10 bug?] Clicking in a dialog scrolls the content of another dialog
I create 2 dialogs, one containing more text that can be shown. I scroll to the bottom, click inside it. Then when I click into the second dialog, the contents of the first dialog move up, the scrollbar going back to top. http://jsfiddle.net/mbraga/5cB2K/2/ Seems related to the part where a dialog is moved to top of the stack, which redraws all the dialogs. I do not dare to say, but seems a bug to me.
Two datepickers, one loads saved date, the other does not
I have two date pickers on my page, a begin date and an end date. I want the date selected in each to re-load from the $_POST variable after submit if there was a problem submitting the form. Strangely, it works perfectly in the first datepicker input, but not in the second. Why not? <input class="-hidden datepicker" name="datepicker_b" type="text" id="datepicker_b" value="<?php if (isset($_POST['datepicker_b'])) {echo $_POST['datepicker_b'];} ?>" /> <input class="-hidden datepicker" name="datepicker_e"
Double Interactions
Hello, I would like to learn how to associate to type of interactions to an unique object. My objective is to configure an instance of sortable and at the same time it be a selectable one. Doing the following, "Foo" becomes sortable: $( "#foo" ).sortable(); But after the following: $( "#foo" ).selectable(); It becomes selectable, but leaves the sortable properties, and I can't drag it anymor. =( Pleasem tell me if I'm doing anything wrong, Phillip Spring.
datepicker image icon not removing
i've a datepicker with setting with image beside but i need to remove it dynamically. $(function() { $.datepicker.setDefaults({dateFormat: 'yy-mm-dd', showOn: "button", buttonImage: "image/calendar.gif", buttonImageOnly: true }); }); function remove_element(element) { element.parentNode.removeChild(element); } only the text box is removing, the image icon still there.
Jquery tabs
Hi Can anyone solve my problem I had used jquery tabs functionalliy it was working well and gud but it was loading slow until the jquery files loads the page shows the strange behaviour that doesnt look good at my site What should i include in the script inorder to load it very fastly
Next Page