I imagine I'm doing something wrong at a very basic level, but I guess i've been staring at it too long to figure it out. I'm trying to bind simple custom "enable" and "disable" methods to both forms and form fields. The idea is that disabling a field disables the field itself, disabling a form disables any corresponding :submit buttons. However, when I $.fn.trigger() my custom events, they seem to fire on EVERY form/field on the page, not just the one selected. I've created a fiddle to demonstrate and my JS is below...
//Disable FORM event handler
$('body').on('disable', 'form', function () {
console.log(this.nodeName);
var $form = $(this);
$form
.find(':submit')
.trigger('disable');
return $form;
});
//Disable field event handler
$('form').on('disable', 'input,select,textarea,button', function () {
I'm building for a UI design where the datepicker is supposed to be displayed in a modal window. As far as I can tell this pretty much forces me to use the altField functionality of jQueryUIs date picker? The problem I'm having is i can't get the date picker to honor the value in the alternate field. Here's a fiddle showing what i'm trying to do...
I'm at a loss. I've been using jquery-ujs to simplify async requests in my rails project and it's worked quite well. I've upgraded from jQuery 1.6+ to 1.7.1. An async form submission that was working before no longer works. It's as though the the async request is never successful, but i get a 200 and the correct response type (html). Before upgrading jQuery, my JS looked like this..
I have a situation where i need to locate a radio button by it's value and check it. The solution below works in all browsers. However, in IE 6 & 7 (not 8), if there's an apostrophe it blows up. It's happening for me in both jQuery 1.6.4 and 1.7.1. Here's an example...
When my response returns multiple data-role="page" elements, only the first one is loaded into the DOM, the rest are discarded. how do I load them all? This application is too large to load everything at once, but i do want to load groups of pages in chunks. is it even possible?
I'm trying to set a modal to the top right corner of the screen using block ui. In IE 6 the right margin is working, but it's ignoring the top margin and centering the modal in the window. In other browsers it behaves as expected. anyone else experience this behavior?
I've noticed the following in the jQuery Mobile source code. What's the purpose of passing window and/or undefined?
(function($, window, undefined ) {
// do stuff
})( jQuery, this )
window is global by default correct? and undefined...well, i'm at a total loss. Not even sure what that means. I know i can do a comparison like...if(typeof myvar === "undefined")...yeah, i'm confused :P
I'm trying to progressively enhance a web application I'm developing. Similar to jQuery Mobile, the UI is defined using data attributes (<div data-role="page"/>) that JS then applies classes to. The problem is I'm getting the FOUC on page load and I haven't figured out a way around it yet. jQuery Mobile seems to have sorted out this issue. I've been searching through the jQuery Mobile source code, but so far I haven't found my answer. Currently, my page looks like this...
I'd like to try running the latest code from gitHub. I've cloned the repository. Now I just need to build...how is this done? Not finding anything in the docs
i'm creating an interface for some webcams that provide an mjpeg stream. when switching from the thumbnail view to a camera view I want to pause or stop the streams on the previous page...not sure how to do this? Ideas?
<input type="..." id="field_id"/> <!-- or textarea/button/select -->
...I'm doing this...
$(':input').each(function(){
var $field = $(this).wrap('<div class="wrapper"/>');
var $wrapper = $field.parent();
var $fieldID = $field.attr('id');
var $label = $('label[for="' + $fieldID + '"]:first');
$wrapper.prepend($label);
});
...to get this...
<div class="wrapper">
<label for="field_id">Field Name</label>
<input type="..." id="field_id"/>
</div>
It feels pretty clumsy Is there a more elegant way? Maybe even through chaining? Sometimes the <label/> will be before the field and sometimes after...
Since IE 6 doesn't recognize type selectors in css (input[type=xxx] {}) I'm adding classes to elements dynamically so I have handles for the different types of <input/> elements. Here's what I'm using, but it feels sloppy (maybe not the most efficient approach?). Is there a better/less verbose/more efficient way to do this?
i have a link to a dynamically generated report download. when you click the link it takes a while for the server to do the number crunching and return the file. i need to execute some JS on completion of the file download. is this even possible??
This is more a general JS question, but it's making me nuts. I use a "spinner" (with the $.blockUI plugin) in a few places to let the user know something is still happening and to be patient...like so...
Sexy eh? Anyway, in one example I put the spinner up when a link is clicked as it takes a while for the next page to load (a report that's generated dynamically). When the next page loads obviously the spinner goes away. However, if the user clicks the back button, the spinner is cached with the page...just sitting there, spinning away. Not sure how to get around this? Any ideas?