Search Results

Search found 17193 results on 688 pages for 'jquery easing'.

Page 25/688 | < Previous Page | 21 22 23 24 25 26 27 28 29 30 31 32  | Next Page >

  • jQuery ajax call doesn't seem to do anything at all

    - by icemanind
    I am having a problem with making an ajax call in jQuery. Having done this a million times, I know I am missing something really silly here. Here is my javascript code for making the ajax call: function editEmployee(id) { $('#<%= imgNewEmployeeWait.ClientID %>').hide(); $('#divAddNewEmployeeDialog input[type=text]').val(''); $('#divAddNewEmployeeDialog select option:first-child').attr("selected", "selected"); $('#divAddNewEmployeeDialog').dialog('open'); $('#createEditEmployeeId').text(id); var inputEmp = {}; inputEmp.id = id; var jsonInputEmp = JSON.stringify(inputEmp); debugger; alert('Before Ajax Call!'); $.ajax({ type: "POST", url: "Configuration.aspx/GetEmployee", data: jsonInputEmp, contentType: "application/json; charset=utf-8", dataType: "json", success: function (msg) { alert('success'); }, error: function (msg) { alert('failure'); } }); } Here is my CS code that is trying to be called: [WebMethod] public static string GetEmployee(int id) { var employee = new Employee(id); return Newtonsoft.Json.JsonConvert.SerializeObject(employee, Newtonsoft.Json.Formatting.Indented); } When I try to run this, I do get the alert that says Before Ajax Call!. However, I never get an alert back that says success or an alert that says failure. I did go into my CS code and put a breakpoint on the GetEmployee method. The breakpoint did hit, so I know jQuery is successfully calling the method. I stepped through the method and it executed just fine with no errors. I can only assume the error is happening when the jQuery ajax call is returning from the call. Also, I looked in my event logs just to make sure there wasn't an ASPX error occurring. There is no error in the logs. I also looked at the console. There are no script errors. Anyone have any ideas what I am missing here? `

    Read the article

  • jQuery autocomplete for dynamically created inputs

    - by Jamatu
    Hi all! I'm having an issue using jQuery autocomplete with dynamically created inputs (again created with jQuery). I can't get autocomplete to bind to the new inputs. Autocomplete $("#description").autocomplete({ source: function(request, response) { $.ajax({ url: "../../works_search", dataType: "json", type: "post", data: { maxRows: 15, term: request.term }, success: function(data) { response($.map(data.works, function(item) { return { label: item.description, value: item.description } })) } }) }, minLength: 2, }); New table row with inputs var i = 1; var $table = $("#works"); var $tableBody = $("tbody",$table); $('a#add').click(function() { var newtr = $('<tr class="jobs"><td><input type="text" name="item[' + i + '][quantity]" /></td><td><input type="text" id="description" name="item[' + i + '][works_description]" /></td></tr>'); $tableBody.append(newtr); i++; }); I'm aware that the problem is due to the content being created after the page has been loaded but I can't figure out how to get around it. I've read several related questions and come across the jQuery live method but I'm still in a jam! Any advice?

    Read the article

  • jQuery Validation error...

    - by Povylas
    Hi, I have been struggling with this jQuery Validation Plugin. Here is the code: <script type="text/javascript"> $(function() { var validator = $('#signup').validate({ errorElement: 'span', rules: { username: { required: true, minlenght: 6 //remote: "check-username.php" }, password: { required: true, minlength: 5 }, confirm_password: { required: true, minlength: 5, equalTo: "#password" }, email: { required: true, email: true }, agree: "required" }, messages: { username: { required: "Please enter a username", minlength: "Your username must consist of at least 6 characters" //remote: "Somenoe have already chosen nick like this." }, password: { required: "Please provide a password", minlength: "Your password must be at least 5 characters long" }, confirm_password: { required: "Please provide a password", minlength: "Your password must be at least 5 characters long", equalTo: "Please enter the same password as above" }, email: "Please enter a valid email address", agree: "Please accept our policy" } }); var root = $("#wizard").scrollable({size: 1, clickable: false}); // some variables that we need var api = root.scrollable(); $("#data").click(function() { validator.form(); }); // validation logic is done inside the onBeforeSeek callback api.onBeforeSeek(function(event, i) { if($("#signup").valid() == false){ return false; }else{ return true; } $("#status li").removeClass("active").eq(i).addClass("active"); }); //if tab is pressed on the next button seek to next page root.find("button.next").keydown(function(e) { if (e.keyCode == 9) { // seeks to next tab by executing our validation routine api.next(); e.preventDefault(); } }); $('button.fin').click(function(){ parent.$.fn.fancybox.close() }); }); </script> And here is the error: $.validator.methods[method] is undefined http://www.vvv.vhost.lt/js/jquery-validate/jquery.validate.min.js Line 15 I am completely confused... Maybe some kind of handler is needed? I would be grateful for any kind of answer.

    Read the article

  • when updating location.hash in Chrome the jQuery animation "freezes" for a second

    - by ubunut
    I'm trying to create a sort of "virtual gallery". I'm using Coda Slider 2.0 & jQuery v1.4.2 It behaves perfectly in IE, FF & Safari, but Chrome seems to reload/hang for a second when setting location.hash. This causes the jQuery animation to freeze for a second :S Example: http://hardyernst.dk/gallery.html try clicking on the navigation links above the pictures. The jQuery code that is being executed when clicking a navigation link: $('#coda-nav-' + sliderCount + ' a').each(function(z) { // What happens when a nav link is clicked $(this).bind("click", function() { offset = -(panelWidth*z); navClicks++; $(this).addClass('current').parents('ul').find('a').not($(this)).removeClass('current'); alterPanelHeight(z); currentPanel = z + 1; $('.panel-container', slider).stop().animate({ left: offset }, settings.slideEaseDuration, settings.slideEaseFunction, function(){ if (!settings.crossLinking) { return false; } // Don't change the URL hash unless cross-linking is specified }); }); }); if I add return false; at the end of the function. The animation will slide smoothly :)... BUT as you might have guessed the location.hash value remains unchanged :( I have tried setting the location.hash earlier in the function alas it did not change the behavior in Chrome Would be immensely grateful for any help :) Regards Ubunut

    Read the article

  • jquery question for events

    - by OM The Eternity
    I have to copy the text from one text box to another using checkbox through jquery I have applied jquery event in my code, it works partially correct.. code is as follows: <html> <head> <script src="js/jquery.js" ></script> </head> <body> <form> <input type="text" name="startdate" id="startdate" value=""/> <input type="text" name="enddate" id="enddate" value=""/> <input type="checkbox" name="checker" id="checker" /> </form> <script> $(document).ready(function(){ $("#startdate").change(function(o){ if($("#checker").is(":checked")){ $("#enddate").val($("#startdate").val()); } }); }); </script> </body> </html> this code works as follows, I always have checkbox checked by default hence whenever i insert the start date and then tab, the start date gets copied to enddate. My Problem but now if uncheck the checkbox and change the start date and then recheck the check box, the start date is not copied, Now what should be done in this situation.. please help me....

    Read the article

  • jQuery - Callback failing if there is no options parameter

    - by user249950
    Hi, I'm attempting to build a simple plugin like this (function($) { $.fn.gpSlideOut = function(options, callback) { // default options - these are used when no others are specified $.fn.gpSlideOut.defaults = { fadeToColour: "#ffffb3", fadeToColourSpeed: 500, slideUpSpeed: 400 }; // build main options before element iteration var o = $.extend({}, $.fn.gpSlideOut.defaults, options); this.each(function() { $(this) .animate({backgroundColor: o.fadeToColour},o.fadeToColourSpeed) .slideUp(o.SlideUpSpeed, function(){ if (typeof callback == 'function') { // make sure the callback is a function callback.call(this); // brings the scope to the callback } }); }); return this; }; // invoke the function we just created passing it the jQuery object })(jQuery); The confusion I'm having is that normally on jQuery plugins you can call something like this: $(this_moveable_item).gpSlideOut(function() { // Do stuff }); Without the options parameter, but it misses the callback if I do it like that so I have to always have var options = {} $(this_moveable_item).gpSlideOut(options, function() { // Do stuff }); Even if I only want to use the defaults. Is there anyway to make sure the callback function is called whether or not the options parameter is there? Cheers.

    Read the article

  • jquery child selector problems

    - by codedude
    I have a basic website nav layout that looks like this: <li class="folder parent_folder"> <a href="#">Some Folder</a> <ul class="submenu"> <li class="file"><a href="#">An awesome file</a></li> <li class="file"><a href="#">An awesome file</a></li> <li class="file"><a href="#">An awesome file</a></li> <li class="file"><a href="#">An awesome file</a></li> <li class="file"><a href="#">An awesome file</a></li> <li class="file"><a href="#">An awesome file</a></li> </ul> I have several of these throughout the site's page. Using jquery, I'm trying to make it so that when you click "li.parent_folder" "ul.submenu" disappears and then reappears when you click "li.parent_folder" again. I can get it to do this but I have a problem. When I click on the "li.parent_folder" all the "ul.submenu" disapear instead of just the one that is the child of it. What would be the correct jquery code to accomplish this? (Oh, I'm using jquery ui also in this project What I have right now is this: $('li.parent_folder').click(function() { $('li.parent_folder ul.submenu').hide(); });

    Read the article

  • jquery ui dialog and our dearest friend, ie6

    - by bradjive
    I'm using the jquery ui dialog for a modal popup dialog. It's working great in Firefox/Chrome but terrible in ie6. Problem: When I show the dialog in ie6, the browser window grows and automatically scrolls down to the bottom. The height increase and automatic scroll-down is equal to the height of the jquery dialog. I can scroll up and then use the dialog as normal, but the behavior where it grows the window and drops is maddeningly unacceptable. Here is how I'm launching the window: <div id="dialogWindow"></div> ... $(document).ready(function() { var $dialog = $("#dialogWindow").dialog({ autoOpen: false, modal: true, minWidth: 560, width: 560, resizable: "true", position: "top" }); $('.addButton').click(function(e) { e.preventDefault(); $('#dialogWindow').load('http://myurl'); $dialog.dialog('open'); }); }); I am already using the bgiframe plugin for jquery which is key for ie6 overlay issues. But this seems unrelated to that. Has anyone seen this before and found a work around?

    Read the article

  • jQuery Autocomplete with _renderItem and catagories

    - by LillyPop
    As a newb to jQuery im wondering if its possible to have both jQuery _renderItem (for custom list item HTML/CSS) AND the categories working together in harmony? Ive got my _renderItem working great but I have no idea how to incorporate categories into the mix. My code so far $(document).ready(function () { $(':input[data-autocomplete]').each(function () { $(':input[data-autocomplete]').autocomplete({ source: $(this).attr("data-autocomplete") }).data("autocomplete")._renderItem = function (ul, item) { var MyHtml = "<a>" + "<div class='ac' >" + "<div class='ac_img_wrap' >" + '<img src="../../uploads/' + item.imageUrl + '.jpg"' + 'width="40" height="40" />' + "</div>" + "<div class='ac_mid' >" + "<div class='ac_name' >" + item.value + "</div>" + "<div class='ac_info' >" + item.info + "</div>" + "</div>" + "</div>" + "</a>"; return $("<li></li>").data("item.autocomplete", item).append(MyHtml).appendTo(ul); }; }); }); The jQuery documentation for the autocomplete gives the following code example : $.widget("custom.catcomplete", $.ui.autocomplete, { _renderMenu: function (ul, items) { var self = this, currentCategory = ""; $.each(items, function (index, item) { if (item.category != currentCategory) { ul.append("<li class='ui-autocomplete-category'>" + item.category + "</li>"); currentCategory = item.category; } self._renderItem(ul, item); }); } }); Id like to get my custom HTML (_renderItem) and categories working together, can anyone help me to merge these two together or point me in the right direction. Thanks

    Read the article

  • How to jQuery plugin effects to items created later in the DOM

    - by Dan Denney
    How do I apply jQuery plugin effects to items that are created by an event? So, what I am attempting to do is have all uls throughout a site use the jquery.scroll.js plugin for styling. I currently have it working on all active uls. However, there are some category/subcategory sections. I am still new to writing any jQuery on my own and there is a leap in logic that I don't understand on applying plugins to items when they are loaded later. In the real example, users click a category from a ul and a sub category is loaded via Rails and JSON. For a light sample, I made a jsfiddle that simulates the issue that I run into. The category ul is styled correctly, but the subcategory ul doesn't pick up the styling. I'm hoping for some assistance not just in whipping up some code to fix it, but in pointing me in the direction of what I need to learn for this functionality. http://jsfiddle.net/dandenney/25R8F/1/ Thank you in advance!

    Read the article

  • jquery ui css not loading and creating poblems with asp.net mvc3 page (unexpected token error)

    - by giddy
    hi, So I suspect Im doing something silly, but first off, I can see that my mvc3 project already had jquery ui in it but no theme css files. I needed a date picked and as usual needed to override the EditorFor DateTime. I started off today by just using the default jquery ui js files supplied with the project under scripts. The date picker shows up fine, only with a completed messed up UI based on Site.css. So now I downloaded a build of jquery (with the start theme) and followed this page about how to put it together. Im using T4MVC so my page looks like this: Layout.cshtml : <script src="@Links.Scripts.jquery_1_4_4_js" type="text/javascript"></script> <link href="@Links.Content.Site_css" rel="stylesheet" type="text/css" /> <script src="@Links.Content.start.jquery_ui_1_8_7_custom_css" type="text/javascript"></script> Create.cshtml <script src="@Links.Scripts.jquery_validate_min_js" type="text/javascript"></script> <script src="@Links.Scripts.jquery_validate_unobtrusive_min_js" type="text/javascript"></script> <script src="@Links.Scripts.jquery_ui_1_8_7_custom_min_js" type="text/javascript"></script> And this is the result: Any ideas, Ive been googleing for a while now, I tried a couple combinations of where I put the script and css files tags in different places, but nothing seems to work.

    Read the article

  • jQuery UI sortable - sorting images

    - by GSTAR
    I've just implemented the jQuery UI sortable plugin for a set of images. The markup I have is as follows: <ul id="images" class="ui-sortable"> <li id="7884029"><img src="/images/member/4698568/7884029_t.jpg" alt="" /></li> <li id="7379458"><img src="/images/member/4698568/7379458_t.jpg" alt="" /></li> <li id="1704208"><img src="/images/member/4698568/1704208_t.jpg" alt="" /></li> <li id="1750715"><img src="/images/member/4698568/1750715_t.jpg" alt="" /></li> <li id="4364912"><img src="/images/member/4698568/4364912_t.png" alt="" /></li> </ul> <script type="text/javascript"> /*<![CDATA[*/ jQuery(function($) { jQuery('#images').sortable({'delay':'100'}); }); /*]]>*/ </script> The LI id is the 'name' column in the DB table - I prefer not to display the ID column. Now my question is how do I capture the sorting? I understand this would be an AJAX request but I have no idea how to do it. I have set up a sort_order column in my DB table and I am using PHP as my scripting language. I could do with a code example. EDIT: Ideally I prefer if the sort order is applied upon moving an item, i.e. I do not want to enclose it all in a form.

    Read the article

  • Calling a jQuery method at declaration time, and then onEvent

    - by cesarsalazar
    I've been writing JS (mainly jQuery) for quite a few months now, but today I decided to make my first abstraction as a jQuery method. I already have working code but I feel/know that I'm not doing it the right way, so I come here for some enlightenment. Note: Please do not reply that there's already something out there that does the trick as I already know that. My interest in this matter is rather educational. What my code is intended to do (and does): Limit the characters of a textfield and change the color of the counter when the user is approaching the end. And here's what I have: $(function(){ $('#bio textarea').keyup(function(){ $(this).char_length_validation({ maxlength: 500, warning: 50, validationSelector: '#bio .note' }) }) $('#bio textarea').trigger('keyup'); }) jQuery.fn.char_length_validation = function(opts){ chars_left = opts.maxlength - this.val().length; if(chars_left >= 0){ $(opts.validationSelector + ' .value').text(chars_left); if(chars_left < opts.warning){ $(opts.validationSelector).addClass('invalid'); } else{ $(opts.validationSelector).removeClass('invalid'); } } else{ this.value = this.value.substring(0, opts.maxlength); } } In the HTML: <div id="bio"> <textarea>Some text</textarea> <p class="note> <span class="value">XX</span> <span> characters left</span> </p> </div> Particularly I feel really uncomfortable binding the event each on each keyup instead of binding once and calling a method later. Also, (and hence the title) I need to call the method initially (when the page renders) and then every time the user inputs a character. Thanks in advance for your time :)

    Read the article

  • Error occurs while validating form input using jQuery in Firebug

    - by Param-Ganak
    I have written a custom validation code in jQuery, which is working fine. I have a login form which has two fields, i.e. userid and password. I have written a custom code for client side validation for these fields. This code is working fine and gives me proper error messages as per the situation. But the problem with this code is that when I enter the invalid data in any or both field and press submit button of form then it displays the proper error message but at the same time when I checked it in Firebug it displays following error message when submit button of the form is clicked validate is not defined function onclick(event) { javascript: return validate(); } (click clientX=473, clientY=273) Here is the JQUERY validation code $(document).ready(function (){ $("#id_login_form").validate({ rules: { userid: { required: true, minlength: 6, maxlength: 20, // basic: true }, password: { required: true, minlength: 6, maxlength: 15, // basic: true } }, messages: { userid: { required: " Please enter the username.", minlength: "User Name should be minimum 6 characters long.", maxlength: "User Name should be maximum 15 characters long.", // basic: "working here" }, password: { required: " Please enter the password.", minlength: "Password should be minimum 6 characters long.", maxlength: "Password should be maximum 15 characters long.", // basic: "working here too.", } }, errorClass: "errortext", errorLabelContainer: "#messagebox" } }); }); /* $.validator.addMethod('username_alphanum', function (value) { return /^(?![0-9]+$)[a-zA-Z 0-9_.]+$/.test(value); }, 'User name should be alphabetic or Alphanumeric and may contain . and _.'); $.validator.addMethod('alphanum', function (value) { return /^(?![a-zA-Z]+$)(?![0-9]+$)[a-zA-Z 0-9]+$/.test(value); }, 'Password should be Alphanumeric.'); $.validator.addMethod('basic', function (value) { return /^[a-zA-Z 0-9_.]+$/.test(value); }, 'working working working'); */ So please tell me where is I am wrong in my jQuery code. Thank You!

    Read the article

  • ZendX Jquery Decorator

    - by iJD
    How use partial decorator in Jquery Element I use this code for Form Element: $title = new Zend_Form_Element_Text('title'); $title->setRequired(true) ->setAttrib('class', 'inputbox') ->setLabel('Title'); $title->viewScript = 'RegElement.phtml'; $title->setDecorators( array( array('ViewScript', array('class' => 'RegElement')) ) ); But when i use Jquery Element i dont know how implement it: $datePicker = new ZendX_JQuery_Form_Element_DatePicker( "datePicker1", array("label" => "Date:") ); $datePicker->viewScript = 'RegElement.phtml'; $datePicker->setDecorators( array( array('ViewScript', array('class' => 'RegElement')) ) ); //views/scripts/RegElement.phtml <li class="row <?php echo $this->class ?>"> <div class="cont-error"> <?php echo $this->formErrors($this->element->getMessages()); ?> </div> <div class="rowfields"> <?php echo $this->formLabel($this->element->getName(), $this->element->getLabel()) ?> <?php echo $this->{$this->element->helper}( $this->element->getName(), $this->element->getValue(), $this->element->getAttribs() ) ?> </div> <div class="hint"><?php echo $this->element->getDescription() ?></div> </li> And display this error: Warning: Exception caught by form: Cannot render jQuery form element without at least one decorator implementing the 'ZendX_JQuery_Form_Decorator_UiWidgetElementMarker' interface. I need display datePicker with same format. but idk how implement this interface. thx for your help.

    Read the article

  • How can I load an external jQuery gallery/slideshow into a div

    - by DanTransformer
    Ive got a jQuery navigation menu loading external content into my #main div, which works fine when the content is static, but the site im working on contains jQuery galleries/slideshows which id like to call into the div. The problem im having is when the gallery is loaded, the images all appear but the jQuery functionality does not work. Any help appreciated. here is the javascript im using... $(document).ready(function() { // Check for hash value in URL var hash = window.location.hash.substr(1); var href = $('#accordion ul li a').each(function(){ var href = $(this).attr('href'); if(hash==href.substr(0,href.length-5)){ var toLoad = hash+'.html #main'; $('#main').load(toLoad) } }); $('#accordion ul li a').click(function(){ var toLoad = $(this).attr('href')+' #main'; $('#main').hide('fast',loadContent); $('#load').remove(); $('#wrapper').append('<span id="load">LOADING...</span>'); $('#load').fadeIn('normal'); window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5); function loadContent() { $('#main').load(toLoad,'',showNewContent()) } function showNewContent() { $('#main').show('normal',hideLoader()); } function hideLoader() { $('#load').fadeOut('normal'); } return false; }); });

    Read the article

  • CSS horizontal scrolling overflow with jQuery slider

    - by Jeffrey
    I'm trying to setup a full screen jquery slider. I've broken the project into two steps 1) css and 2) js. 1) CSS, below is a picture of what I'm shooting for (no fixed height) and below that is the code I have so far that doesn't work. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <style type="text/css"> /* Positioning */ #container { width: 2500px; } .block { display: inline; } /* Styling */ .block img { padding: 5px; } </style> </head> <body> <div id="container"> <div class="block"><img src="http://i42.tinypic.com/1zp2poz.gif"></div> <div class="block"><img src="http://i42.tinypic.com/1zp2poz.gif"></div> <div class="block"><img src="http://i42.tinypic.com/1zp2poz.gif"></div> </div> </body> </html> 2) Javascript, using jquery I'd like the divs to slide left when clicked on them... like the jQuery Coda Slider if possible. Thanks, any help is appreciated.

    Read the article

  • Building simple jQuery plugin, need assistance

    - by kirisu_kun
    Hi there, I'm building my first ever jQuery plugin (it's just a simple experiment). Here's what I have so far: (function($){ $.fn.extend({ auchieFader: function(options) { var defaults = { mask: '', topImg : '', } var options = $.extend(defaults, options); return this.each(function() { var o = options; var obj = $(this); var masker = $(o.mask, obj); masker.hover(function () { $(o.topImg).stop().animate({ "opacity": "0" }, "slow"); }, function () { $(o.topImg).stop().animate({ "opacity": "1" }, "slow"); }); }); } }); })(jQuery); I'm then calling the plugin using: $('.fader').auchieFader({mask: ".mask", topImg: ".top"}); If I then add another request say: $('.fader2').auchieFader({mask: ".mask", topImg: ".top"}); Then no matter what instance of my 2 faders I hover both of them will trigger. I know this is because my mask mask and topImg options have the same class - but how can I modify the plugin to allow for these items to have the same class? I know it's probably something really simple, but I'm still finding my way with jQuery and Javascript in general. Any other tips on improving my code would also be greatly appreciated! Cheers, Chris

    Read the article

  • Surely eAsy but I am not able ... JQUERY UI - WIDGET - HEADER

    - by alex
    I was making this simple trial, but can anyone tell me why the distance from the border of DIV to the H2 header is so much ? How can I reduce it ? I don't want space ... Prova WIDGET <link rel="stylesheet" href="jquery-ui-1.8.custom/css/smoothness/jquery-ui-1.8.custom.css" type="text/css"> <link rel="stylesheet" href="jquery-ui-1.8.custom/development-bundle/ui/jquery-ui-1.8.custom.css" type="text/css"> <script src="jquery-ui-1.8.custom/development-bundle/jquery-1.4.2.js" type="text/javascript"></script> <script src="jquery-ui-1.8.custom/js/jquery-ui-1.8.custom.min.js" type="text/javascript"></script> <script type="text/javascript"> $(themify); function themify(){ $("div").addClass("ui-widget ui-widget-content ui-corner-all"); $("input").addClass("ui-button ui-button-text"); $(":header").addClass("ui-widget-header ui-corner-all"); //ui-widget } </script> <style>#test{display:none}</style> <script type="text/javascript"> function rendiVisibile(){ if(document.getElementById("test").style.display = "none"){ $("#test").css({"width":"200px","float":"right","text-align":"center"}); $("#test").show("slide",{},1000); } } </script> </head> <body> <h2>Tentativo widget con DIV</h2> <form action=""> <input type="button" value="Submit" id="pulsante" onclick="rendiVisibile()";><br/></br> <div id="test"> <h2>CIAO</h2> Un saluto </div> </form> </body>

    Read the article

  • jQuery plugin Private functions inside Vs. Outside the each loop

    - by Pablo
    What is the difference between including private functions in a jQuery plugin in the examples below: Outside the loop: (function( $ ){ var defaults = {}; $.fn.cmFlex = function(opts) { this.each(function() { var $this = $(this); //Element specific options var o = $.extend({}, defaults, opts); //Code here }); function f1(){.... function f3(){.... function f2(){.... }; })( jQuery ); Inside the loop: (function( $ ){ var defaults = {}; $.fn.cmFlex = function(opts) { this.each(function() { var $this = $(this); //Element specific options var o = $.extend({}, defaults, opts); function f1(){.... function f3(){.... function f2(){.... }); }; })( jQuery ); The advantage of including the functions in the loop is that i will be able to access the $this variable as well as the Element specific options from f1() f2() f3(), are there any disadvantages to this?

    Read the article

  • Run script after Jquery finish

    - by Felipe Fernández
    First let's explain the hack that I was trying to implement. When using Total Validator Tool through my web page and I get following error: [WCAG v1 6.3 (A), US-508-l] Consider providing a alternative after each tag As my page relies heavily on javascript I can't provide a real alternative, so I decided to add an empty noscript tag after every script appearence. Let's say I need to provide a clean report about accesibility about my web page even the hack is senseless. (I know the hack is unethical and silly, let's use it as example material, but the point of my post are the final questions) I tried the following approach: $(document).ready(function(){ $("script").each(function() { $(this).after("<noscript></noscript>"); }); }); The problem raises because I have a jQueryUI DatePicker component on my page. jQuery adds a script section after the DOM is ready so my hack fails as miss this section. So the questions are: How handles jQuery library to be executed after document is ready? How can I run my code after jQuery finish its labours?

    Read the article

  • select dropdown option by value using jquery

    - by user1765862
    I have select following html structure <select id="mainMenu" data-mini="true" name="select-choice-min"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> </select> on page load I want initially set option with value 5 so I tried (but nothing changed) $(document).ready(function () { $('#mainMenu option').eq(5).prop('selected', true); }) I'm using jquery 1.8.3 and jqueyr mobile since this is mobile website <script src="/Scripts/jquery-1.8.3.js"></script> <script src="/Scripts/jquery.mobile-1.4.2.js"></script> UPDATE: I just realize that every code from posted answers works (as well as mine), #mainMenu option value is set to desired value (5) but it's text doesnt change (in any of this scenarios). Is this normal and is there workarround for this. I tried $("mainMenu").text("5");

    Read the article

  • Tool tip in modal window...

    - by piemesons
    I m havin a jqueryui modal form. and i m using jquery cluetip tool tip plugin but tool tip is not working in a proper way on modal window form.. this is the screen shot ... Star is showing the place where tool tip must be there and arrows are showing the place where tool tip is showin.. can any body tell me how to figure this out..

    Read the article

  • IE7 Animation with PNG transparency

    - by Kenneth B
    Hi guys and gals I've made a jQuery animation, which fades through some logoes that all uses PNG transparency. In IE the transparency disappears. I've tried unitpngfix.js but it doesn't work. The site is: http://tinyurl.com/yc5wdpr Note: Try using Firefox to see the wanted effect. Can any of you, see what the problem is?

    Read the article

  • Injecting jQuery into a page fails when using Google AJAX Libraries API

    - by jakemcgraw
    I'd like to inject jQuery into a page using the Google AJAX Libraries API, I've come up with the following solution: http://my-domain.com/inject-jquery.js: ;((function(){ // Call this function once jQuery is available var func = function() { jQuery("body").prepend('<div>jQuery Rocks!</div>'); }; // Detect if page is already using jQuery if (!window.jQuery) { var done = false; var head = document.getElementsByTagName('head')[0]; var script = document.createElement("script"); script.src = "http://www.google.com/jsapi"; script.onload = script.onreadystatechange = function(){ // Once Google AJAX Libraries API is loaded ... if (!done && (!this.readyState || this.readyState == "loaded" || this.readyState == "complete")) { done = true; // ... load jQuery ... window.google.load("jquery", "1", {callback:function(){ jQuery.noConflict(); // ... jQuery available, fire function. func(); }}); // Prevent IE memory leaking script.onload = script.onreadystatechange = null; head.removeChild(script); } } // Load Google AJAX Libraries API head.appendChild(script); // Page already using jQuery, fire function } else { func(); } })()); The script would then be included in a page on a separate domain: http://some-other-domain.com/page.html: <html> <head> <title>This is my page</title> </head> <body> <h1>This is my page.</h1> <script src="http://my-domain.com/inject-jquery.js"></script> </body> </html> In Firefox 3 I get the following error: Module: 'jquery' must be loaded before DOM onLoad! jsapi (line 16) The error appears to be specific to the Google AJAX Libraries API, as I've seen others use a jQuery bookmarklet to inject jQuery into the current page. My question: Is there a method for injecting the Google AJAX Libraries API / jQuery into a page regardless of the onload/onready state?

    Read the article

< Previous Page | 21 22 23 24 25 26 27 28 29 30 31 32  | Next Page >