Tabs - pulling in specific content with ajax
Hi, I want to use tabs to pull in content from static HTML pages. The idea is that if the user has JS disabled then the tabs link directly to the static HTML file. This is the default behavior and is working great. However, if the user has JS enabled I want to pull in just a certain part of the page e.g. pull in just content under <div id="tabContent"> and not the rest of the page (nav, header etc). I can do this with JQuery AJAX (http://docs.jquery.com/Ajax/load) but is there a way of integrating
Selecting the default tab, or load cookie plugin
So I understand how to make a default tab using the selector. $tabs.tabs('option', 'selected', 2); I also understand how to use the cookie plugin $('#tabs').tabs({ cookie: { expires: 30 } }); but I can't figure out how to combine the two! What I really want is to be able to load tab 2 as the default tab. But if someone changes the tab and then refreshes I don't want it to go back to the 2nd tab, I want it to stay on the one they've navigated to. Any help would be appreciated. Thanks, Isaac Earl
JQuery Tabs
Hi There :) , I am currently using JQuery tabs within a content pand of a master page, now this master page references all the scripts i need to use JQgrid within the div containers of my tabs functionality. The problem is this, when i choose to load the content via ajax , by loading external pages into the jquery tabs container , none of the grid or Jquery functionality work for the external content obviously. How would i resolcve rthis?....would i have rto rereference everything for the external
Cannot Get Theme Working
Hi, I downloaded the "Start" theme using ThemeRoller (1.7.2 version: UI Core, Tabs & Datepicker widgets, no Effects or Interactions), unpacked it and copied the contents of the "development-bundle\themes\base\" folder to my website "../css/" folder. The test html below works fine, except that: a) the Theme is still the default Theme (it looks like "Smoothness") b) the defaultDate is not working The following test html is at: http://www.pointandslope.com/ac-play/ac-play.html <HTML> <HEAD> <script
EARN MONEY $1000-25000 PER MONTH TAKE SIMPLE ONLINE SURVEYS CREATE FREE ACCOUNT OTHER DETAILS
EARN MONEY $1000-25000 PER MONTH TAKE SIMPLE ONLINE SURVEYS CREATE FREE ACCOUNT OTHER DETAILS LOG ON TO ********************************************************************************************** http://www.AWSurveys.com/HomeMain.cfm?RefID=syedcute85
tabs selector
I have a couple questions about using tabs. Pretty much all the content from my site is going into tabs, but I'm having some trouble. When I refresh the browser it defaults back to the first tab. Is there a way to load the same tab content when somebody refreshes the page?
2 Dialogs, 2 Sortable Lists
I have 2 dialog windows each containing a sortable list. (using the following code) $('#layout_editor_div, #layout_editor_cp').sortable( { placeholder: 'ui-state-highlight', items: '.data_block_edit', forcePlaceholderSize: true, handle:'h3' }); $('#layout_editor_div').sortable('connectWith','#layout_editor_cp'); I've found 2 problems. 1 is that overflow is set to hidden on a dialog, which, at the moment, i'm setting to visible using firebug. This causes elements that you attempt to drag out of the
Adding jquery.js in my site disturb the others javascript I use.
Hi everybody, I'm new here and I'm not sure that this is where I have to come to find a help ... In case I'm inthe wrong place please forgive me and let me know wher to go. So, I use some of javascript in my site which runs perfectly until I use a plugin which have jquery.js in its code. Now, In each old javascript I use where there is "element.xxx", it doesn't work anymore. I have an error like: element.tagName is undefined, element.getStyle is not a function, element.getInlineOpacity is not a function,...
[Accordion] IE6 & 7 expanding problem
Does anyone have any insight as to why Internet Explorer 6 & 7 will not collapse my accordion? An example can be found on http://gotboda.com/myocarditis/ Every other browser handles it just fine.
Purpose behind _setData(), _getData() functions
I'm trying to get my mind around getter/setter functionality. I probably do not understand their purpose properly. What is the exact difference between setting a property as: this.someProperty = someValue; and setting it as: this._setData ('someProperty', someValue); What's the point in other words?
Making Tables / Table elements Droppable
I have been struggling to make table elements droppable. Is this possible? $(document).ready(function(){ $(function () { //Degine Drag Options var dragOpts = { revert:true } $('#header').load('test.html'); //Make the Li items in the toolbox draggable $('#toolBox').draggable(dragOpts); //make the target droppable $(".droppable").droppable({ hoverClass: 'ui-state-active', drop: function(event, ui){ alert('hello!') } }); }); }); </script>
How to prevent some items in a list from moving while sorting
I am creating a web application where there are two kinds of objects in a list: One is sortable and the other cannot be sorted by dragging (using the cancel option). It is very similar to the example: http://jqueryui.com/demos/sortable/#items The second list in the example uses cancel to prevent sorting. The behavior I want - when I click on a sortable item and drag it to a new location - I only want the non-sortable items to move. I want the sortable items to only move when a user decides to move
How to find width of draggable().resizable() div that contains text?
How do you determine the initial width of a draggable().resizable() div, after just instantiating it, without doing anything else to it? The div contains text, and it is obvious that jQuery must know its own width, or else (presumably) the resizable borders would not be perfectly flush with the text. I have drilled down into the $(id)[0] object, including all childNodes, looking for any “width” property which may be useful (style.pixelWidth, clientWidth, posWidth, scrollWidth, offsetWidth, etc.).
Urgent Direct Client Requirement - UI Developer
Job Title: Senior UI Developer Location: Park Ridge, NJ Duration: Full time Should be 10/10 in Communicating. Job Description: The Senior UI Developer provides technical leadership to the UI Developers working on e-Commerce projects and ensures that the application architecture and development standards are followed. This person will also be responsible for the new development and optimization of the presentation layer. Responsibilities: • Lead the development of projects assigned by their management.
Jquery tabs
I am trying to use the jquery tab control in my page. It is working successfully. I have three tabs. in my second tab, i have one button. if i click this button. page is getting reload. immediately. first tab has been chosen by default. How to stay in second tab? I need c# code to stay in second tab instead of default tab while reloading the page. asp.net c# application, i am developing. please help me
dialog with .aspx page - is it possible like this?
hi. before i get into this i wonder if this is possible. i want to do a dialog where i open a .aspx page and while the dialog is open i want to be able to use buttons e.i i do some server side functionality. this cause a postback so can it be done without that the dialog close.. i would like it to be the jquery ui dialog cause i use it through my page.. any tips and suggestions how to achive this is welcome.. thanks
Safari not showing dynamic SVG content in accordion
Hi, I am using an accordion and one of the sections contains SVG content which is a mix of static and dynamic DOM elements. On Firefox this works fine but in Safari I see the dynamic components of the SVG only when first displayed. If I hide that accordion section and then reopen it, only the static SVG components are displayed. I looked at the Safari Activity window and it appears that the SVG source file is reloaded every time I open that accordion section (at least when loading a test file locally).
Changing dialog button
Hello, i'm using jquey to create dialogs but i want to add more buttons in the tittle and remove the x (close button) becouse my app need the dialogs always opened and if i close the dialogs, i have to reload the page to make everything back to normal. Some idea??? i'm using js jquery to make the dialogs like $('#dialog').dialog(); Some idea?
Combining the drag effect with cluetip
Is it possible to 'easily' combine the effect of 'drag' with the plugin cluetip. (http://plugins.jquery.com/project/cluetip) The end result that I want to produce is that when the user hovers on a link an overlay appears, which can then be dragged to a different position. I tried some unsuccessful experiments but as a neophyte I feel I'm stumbling around in the dark. I have 'cluetip' working by itself and I can implement the 'drag' effect with an object on the page but I'm unclear how cluetip and
UI Tabs breaks with more than one tab group (example code enclosed)
Hi, The following example code shows the problem with UI Tabs. The first tab group seems to work OK until you click any tab in the second group. Is there any way to make this work or do I need to find another way to do this? <!DOCTYPE html> <html> <head> <link type="text/css" href="http://jqueryui.com/latest/themes/base/ ui.all.css" rel="stylesheet" /> <script type="text/javascript" src="http://jqueryui.com/latest/ jquery-1.3.2.js"></script> <script type="text/javascript" src="http://jqueryui.com/latest/ui/
resizable overflow:auto handle not moving when using scrollbar
Browser: I.E. 7 JQuery: 1.3.2 UI: 1.7.2 Steps: 1. Get remote data using ajax. 2. Load remote data into div with style overflow:auto and reportContainer class name (contains no styling) 3. Find div containing remote data based on classname 4. Make reportContainer div resizable 5. Scroll using the scroll bars 6. Notice that the handles do not scroll with the content 7. To find the handles again you must scroll back to the original position How do I make it so the handles stay visible and appear to
UI tree
Hello all, I found an example of ui tree here http://sandbox.tinctuur.be/tree/ it works great with the version of jquery and jquery ui supplied but not with the current version does anybody know if there is a version of this out there that I can use with up to date versions of ui and jquery as well maybe some documentation to go with it ? Mean Mike
DatePicker question
Hello, I've implemented the date picker on a website I'm building and am getting a behavior I hope I can change. I allow a user to enter the date manually or click an icon to open the date picker. If the user manually enters the a date and moves to the next field in the form, the date picker will automatically set the date to the current day. How do I get it to leave the current date alone? Thanks!
Problem with jQuery UI Dialogs an CKEditor
hi guys, I'm developing a little site where I show a CKEditor (WYSWIG Html Editor-> http://ckeditor.com/ ) inside a jQuery UI Dialog. The problem comes when CKEditor open its dialogs (for example clicking the add-link button). The dialog shows correctly, the input shows the blinking cursor (so, it receives the focus properly) and mouse events are working fine (you can change select values, for instance), BUT keyboard simply does not work. You can't type anything on the input text even tough it's
jQuery Tabs containing multiple instances of the same page
I am using the jQuery UI Tabs and in one of my tabs I have a list of accounts. I want to provide the ability to amend an account via a page that will be displayed in a new tab and also provide the ability to have multiple account tabs open. This obviously means have multiple instances of the same page present within my page that contains the tabs. Does anyone know of an example that displays this kind of behaviour?
How do you determine the initial width of a draggable().resizable() div
How do you determine the initial width of a draggable().resizable() div, after just instantiating it, without doing anything else to it? The div contains text, and it is obvious that jQuery must know its own width, or else (presumably) the resizable borders would not be perfectly flush with the text. I have drilled down into the $(id)[0] object, including all childNodes, looking for any “width” property which may be useful (style.pixelWidth, clientWidth, posWidth, scrollWidth, offsetWidth, etc.).
How to use tabs in Dialog ?
Hi all , i try this but i get some troubles : -------- HTML --------- <button id="tabtest" class="ui-button ui-state-default ui-corner- all">tabtest</button> <div id="dialogtab" title="Create new user"> <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"> p1 </div> <div id="tabs-2"> p1 </div> <div id="tabs-3">
Semicolon in ID attribute
Hi, I have an text field whose ID is something like 'j_id1:username'. Now if I try to retrieve the input field using jQuery('#j_id1:username'), it does not work. It is only reading the id until the semicolon and thus looking for an element with id 'j_id1'. I can not avoid having semi colons as this is a framework generated code and it happens to be a standard convention. Is there any way I can escape the semicolon or some how access the fields with semicolon in the IDs? Please not that I have to
help in implementing tabs inside of accordions.....................
Hi all... I am having problem trying to implement tab inside of accordion. Can anyone post a simple example here on how an tab can be implemented inside a accordion? Of course, there are several accordions and each accordion contains tabs. i googled it many times............. but much of the result was associated with implementing accordions inside tabs................. Thanks in advanced.
UI Dialog error in IE8
Hello all! I got a problem with rendering dialog data in dialog when i want first to get data with function load(url) and then to show my dialog with it. in ie8 i can show only static text when i manually place it in the div#dialog but it does not work if i want to get my html data from the other page... how can i fix it ?! thanx!
localization of calendar
HI, I'm having an issue with the localization of the calendar plugin. It always default to the language of the latest js file I import. For example, if I do that : <script src="<% =ScriptsRoot %>Calendar/ui.core.js" type="text/ javascript"></script> <script src="<% =ScriptsRoot %>Calendar/ui.datepicker.js" type="text/ javascript"></script> <script src="<% =ScriptsRoot %>Calendar/ui.datepicker-zh-CN.js" type="text/javascript"></script> <script src="<% =ScriptsRoot %>Calendar/ui.datepicker-fr.js" type="text/javascript"></script>
IE 8 + dialog + $("#dialog").load(url) error
Hello all! I got a problem with rendering dialog data in dialog when i want first to get data with function load() and then to show my dialog. i can show only static text in ie8 when i manually type it in a div#dialog but it does not work if i want to get my html from the other page... how can i fix it ?! thanx!
Draggable containment document problem with margin left jquery ui 1.5
Hallo all. I have a problem with a draggable div created with the containment option set to document. The relative css for the div is .divclass { top:50%; left:50%; height:300px; width:600px; margin-left:-300px; margin-top:-150px; } The properties margin-left and margin-top seem to make some problems with the containment option on the left side and on the top side: infact with these properties is possible to drag the div out of the screen on the left (for the 50% of his width) and out of the screen
Trying to toggle / slide panel in page
Hi there. I'm trying to make a sliding panel that a user can hide (slide to the left) and show when she chooses. The effect is demonstrated on these sites. <ul><li><a href="http://www.atlanticbt.com" target="_blank">http://www.atlanticbt.com</a> ( toggle sliding pane by "site tools" rope at the top-right side of the page ) </li> <li><a href="http://maps.google.com" target="_blank">maps.google.com</a> ( toggle sliding pane by chevron in the left panel ) </li></ul> I have the beginnings of something
datepicker & onselect
Hi every body, I would like to thick-border a the date selected with : onSelect: function(dateText, inst) { var a = dateText.split("/");.... }) I can't figure out any code for doing this. Any help would be appreciated! Many thks
Accordion re-creation
Hi, I created an accordion in a dialog. Then I populate some data into the accordion using chain,js plugin via ajax call. The problem is when each time the script populate some data, the accordion seems not working, so I put the accordion in the ajax success as sample below and it works $.ajax ({ type: "GET", cache: false, url: "getdata.php", data: {srch: srch}, dataType: 'json', success: function (d) { $("#dialogInner").item(d).chain(); $("#accordion").accordion({fillSpace:true}); } }); #accordion
tree
I've seen different tree plugins but I have been only able to find one that i like it seem to be an old instance of ui-tree can someone direct me to a good tree plugin what I really need is to just list a list of items where anything can become a parent or child and can then be serialized back to the database Ideally providing left and right values based on the nested set model thanks for any help Mean Mike
Theme roller with a local html file
Hey, i'm using the themeroller firefox bookmarklet and i can't use it with a webpage that i'm making that is still on my local computer. Does anyone know how to get around this? Error: Access to 'file:///Users/Desktop%20main/public/ index.html#ffDefault=Segoe+UI%2C+Arial%2C+sans- serif&fwDefault=bold&fsDefault=1.1em&cornerRadius=6px&bgColorHeader=333333&bgTextureHeader=12_gloss_wave.png&bgImgOpacityHeader=25&borderColorHeader=333333&fcHeader=ffffff&iconColorHeader=ffffff&bgColorContent=000000&bgTextureContent=05_inset_soft.png&bgImgOpacityContent=25&borderColorContent=666666&fcContent=ffffff&iconColorContent=cccccc&bgColorDefault=555555&bgTextureDefault=02_glass.png&bgImgOpacityDefault=20&borderColorDefault=666666&fcDefault=eeeeee&iconColorDefault=cccccc&bgColorHover=0078a3&bgTextureHover=02_glass.png&bgImgOpacityHover=40&borderColorHover=59b4d4&fcHover=ffffff&iconColorHover=ffffff&bgColorActive=f58400&bgTextureActive=05_inset_soft.png&bgImgOpacityActive=30&borderColorActive=ffaf0f&fcActive=ffffff&iconColorActive=222222&bgColorHighlight=eeeeee&bgTextureHighlight=03_highlight_soft.png&bgImgOpacityHighlight=80&borderColorHighlight=cccccc&fcHighlight=2e7db2&iconColorHighlight=4b8e0b&bgColorError=ffc73d&bgTextureError=02_glass.png&bgImgOpacityError=40&borderColorError=ffb73d&fcError=111111&iconColorError=a83300&bgColorOverlay=5c5c5c&bgTextureOverlay=01_flat.png&bgImgOpacityOverlay=50&opacityOverlay=80&bgColorShadow=cccccc&bgTextureShadow=01_flat.png&bgImgOpacityShadow=30&opacityShadow=60&thicknessShadow=7px&offsetTopShadow=-7px&offsetLeftShadow=-7px&cornerRadiusShadow=8px'
How do you determine the initial width of a draggable().resizable() div
How do you determine the initial width of a draggable().resizable() div, after just instantiating it, without doing anything else to it? The div contains text, and it is obvious that jQuery must know its own width, or else (presumably) the resizable borders would not be perfectly flush with the text. I have drilled down into the $(id)[0] object, including all childNodes, looking for any “width” property which may be useful (style.pixelWidth, clientWidth, posWidth, scrollWidth, offsetWidth, etc.).
JQuery-UI Datepicker behavior change
I have ran into a situation where I need to change the built in behavior of the Jquery-UI Datepicker. In my case, I want to lock down the field so that users cannot type in their on information and must use the datepicker. The behavior I would like to see is that when they click in the field, it would open the datepicker. However, I also want to display icon to open the datepicker and have that work as well. Basically a hybrid of the two ways that it works now. Anyone have any suggestions on how
Next Page