call jquery function dynamically
I'm working on a page where I'd like to have multiple accordions or datepickers. I understand that I can add the following code multiple times to my page and change the selector to the ID of the item I want to work with. <script> $(function() { $( "#accordion" ).accordion({ collapsible: true, active: false }); }); </script> What I would like to do, and what seems more natural to me, is I would like have that code only once with a variable for the
multiple slideshow - page counter problem
Hello, I have multiple slideshow in one page. My problem is that I can't have the page counter for each slideshow. (It appears only on the first one) Here my JQuery code : $(document).ready(function() { $('.slideshow').each(function(){ $(this).cycle({ speed:1, timeout: 0, next: $('.slideright', $(this).parent()), prev: $('.slideleft', $(this).parent()), after: onAfter }); }); }); function onAfter(curr,next,opts) { var caption = (opts.currSlide + 1) + ' / ' + opts.slideCount; $('#counter').html(caption);
Full-Screen Page Loading Widget
Is it possible to customize the page loading widget so that (i) it shows a dark backdrop over the screen (like a Dialog) ? (ii) supports a back / cancel button that returns the user if they wish to abort the load process? For (i), would this CSS do the trick, or is there a better way ? .ui-loader { padding-top: 40%; width: 100% !important; height: 100% !important; left: 0 !important; top: 0 !important; margin-left: 0 !important; margin-top: 0 !important; } thank you.
How to prevent duplicate click-type events?
I have an ongoing issue with users clicking on buttons and intermittently generating duplicate events. I've been using a variety of events to catch the clicks sooner rather than wait the 300 msec (like vmousedown), but this most recently happened with a vclick event. Since it's obvious that neither jQuery or jQM is doing anything to prevent this, and it's also not a bug in those due to the uncommon nature of it (I can replicate it now and then, but it takes lots of attempts to catch it once), I'm
Required form field support
Anyone wondering if the JQM team has any plans on supporting/gracefully degraded the html5 required property on form fields? I use alot of popup forms here and there and having a built in tooltip for required fields (or other failed validations) would kick ass. That could be something like this: <input type="password" id="password" data-validation-message="Please enter a password with more than 6 characters, 1 number and 1 capital letter" pattern="^.*(?=.{7,})(?=.*[a-z])(?=.*[A-Z])(?=.*[\d@!#$%^&*+-=]).*$"
.click function highlights text / elements
Hello, Whenever I am using the .click function, it is highlighting the text and other elements that have the same class name. Does anyone know what is causing this and / or how it can be fixed? Example - [ Button 1 ] [ Button 2 ] [ Button 3 ] If buttons 1, 2, and 3 all had the same class name "button", whenever I click on a button the other two become highlighted.
Firefox raises SecurityError and points to JQuery
Hi Guys! Test environment: Firefox 16.02 MacOS 10.7.4 / JQuery 1.7.2 In our application we have a custom implementation of a file uploader UI (to make it CSS-friendly). We are using hidden <input type="file"> elements (we hide them via .hide() function). Clicking a normal <button> triggers a click event on the hidden file input too and the file selector screen shows up. Sof far so good. But as soon as we select a file, Firefox raises an exception: SecurityError: The operation is insecure (code:
Jquery cycle custom with two effects
I'm trying to replicate the use of 'scrollHorz' using the 'custom' effect in jquery cycle but I can't figure out how to specify two different sets of effects with animIn, animOut so that the correct one would be applied based on either prev or next button clicked. Can this be done? The code below always scrolls left: $("#content").cycle({ fx: 'custom', cssFirst: {left:0}, cssBefore: {top:0, left: 1600, opacity:0, display: 'block'}, animIn: {top: 0, left:0, opacity: 1},
Superfish - disable submenu on one of the parents items only.
Hi there, I would like to disable submenu on one of the parents items on my menu only. So when I hover on that item I don'y want to have dropdown of menu items but I want to keep the submenu on others. due to some other reasons (CMS and SEO) I want to keep the submenu items on my menu, so I would like to just disable superfish somehow on that particular item. Thank you in advance. shiva
changing jqm css style from a function
Hi JQM Gods- I'm stuck and I hope you can help. I'm new to development and I'm not quite sure where my thinking is wrong here. In my header toolbar I have two buttons for select lists. I've figured out how to put a pointer on top of the select list popup that points to the button tapped. I can't figure out how to change the position of the pointer when the user taps a different button. I added a line in the .ui-popup-container:after style that aligns the arrow under button 1 (left:90px). To align
jQuery fade effects in IE(8)
Sample code: <!DOCTYPE html> <html> <head> <title></title> <style> span {display:none;} </style> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script> <script> $(document).ready(function(){ $("button").click(function(){ $("span").fadeIn(3000); }); }); </script> </head> <body> <button>Fade in</button> <span>This is some text.</span> </body> </html> It doesn't work in IE8 and probably older versions. Any solution?
how do I .on('elementCreation')?
Lets say I have this <label id="cloneme" class="baa"><input type="checkbox"></label> <div id="foo"></div> and this $('#foo').on('??creation??', '.baa', function(){ if ($(this).find(':checkbox').is(':checked')) $(this).addClass('ischecked'); }); Then I do this // some iterations where ischecked may or may not be true $('#cloneme').clone().attr('id','').appendTo('#foo').find(':checkbox').prop('checked', ischecked); I can't wait until they're clicked, the class should be ischecked if the checkbox
JQUERY learning book required
Dear All, I am new to jquery and want to learn. I need a good tutorail book with asp.net. can any one share/provided it. Thanks
Dialog close button triggers click on item behind it.
I have a dialog box (not a popup) with some fields and two buttons styled like so: <a data-role="button" data-inline="true" data-transition="none" href="#" data-icon="check" data-iconpos="left" id="saveEdit">Save </a> <a data-role="button" data-inline="true" data-transition="none" href="#" data-icon="delete" data-iconpos="left" id="closeEdit">Cancel </a> When one of them is clicked, a click event handler closes the dialog:
JQuery and OAuth
Hi, I need to communicate with a web service using OAuth. I need to send the OAuth properties in Request header. 1. if i use $.ajax with datatype 'json', then OPTIONS is executed first where here itself Am getting 400 bad request error 2. If i use $.ajax with datatype 'jsonp', Am unable to add Authorization header. Can anyone guide me regarding this? Thanks and regards, Gokul
Grids populate only once?
Hey, on my page I have 2 jqxTrees and 2 jqxListboxes. What I'm trying to do is show properties of the selected element from those widgets. I do that using jqxGrid which loads data from the database on select event. It works fine the first time I select a listBox element (or tree). However, when I select another element from that widget nothing is shown. I have determined that no data is sent to the php file (no GET variable is sent). Of course, selecting for the first time sends the variable. Here's
Testing data returned from a getJSON call
Happy Halloween to all I'm using a getJSON in a javascript file I have. I have a co-worker who on testing a change for me tells me he's getting a js error on my page, when I and others do not. I make a getJSON call using data in my callback. I test for data using data.length. The error is on the 'length'. Code: $.getJSON("get-sub-object-codes.html",{object_code:$('#tmp_object_code1').val(), type:code_type}, function(data){ $("#sub_object_code1").html(''); if( data.length > 0 ){ <--
big problem to use event "touchstart"
hi ! i try to make a website by using openlayers for a map on my HTC-Desire. My source you can find in my develop-example. there i inser following source map.events.register("touchstart", this, function(e) { alert("touch start"); }); but if i touch simylar on the screen (map) the message will not show. may the wrong event i want to call ? did i use "tab" ??? could you help me? regards Jan :-)
Jquery Menu Background Disappearing
I have a jQuery Menu that is very glitchy in Chrome. It works okay in FF. There are tabs that have an extended background that appears when you hover over the menu item. The background is supposed to disappear when you hover over another item but the tab is supposed to stay. All the tabs disappear when you hover over another tab in Chrome it does at times in FF but works for the most part in FF. You can see how it is supposed to work by clicking on this link and viewing in FF. Then try it in Chrome.
Display dialog modal using frames
Hello, Im unable to get my modal screen to appear. Im including 3 frames within the html. I have included my code. The ajax function is working, it's just the modal is not displaying. The frames are completely separate areas that my dialog should not go across. Help ...PS the /%...%/ are AS/400 data place holders, just ignore. <HTML> <HEAD> <link rel=stylesheet type=text/css
Loading message? What am i doing wrong?
I have never got the Loading message to work. Well, at least not using the docs method to invoke it. What am i doing wrong. $( '#mypage' ).live( 'pagebeforeshow',function(event) { //Old method...does not work. $.mobile.showPageLoadingMsg("a", "Wait getting data.", false); //New method (1.2)...does not work. $.mobile.loading( 'show' ); }); Also, i am still using "live" instead of "on" (in the event). Why? Because when i use "on" nothing happens=does not work. Have no clue why that
Render pdf using JQuery from a HttpHandler
hi, I have an application in which i have implemented an HTTP handler. I m calling this handler with jquery from my aspx button click. I have written code for the handler to return a PDF file. I want the browser to prompt for open or save option when i click the button. My code is rendering something like this %PDF-1.3 3 0 obj <> endobj 4 0 obj <> stream ... this is my code for calling the HTTP handler where i have the method for creating a PDF function pdf_report() { $.ajax({
Jquery Cycle Version: 2.9999.8 not working in Firefox 16.0.2.
Please help me fix my possible problem in Firefox. The script below works in Chrome and IE8, but not Firefox 16.0.2. I'm using XHTML 4.01 transitional, Jquery 1.8.2 and Cycle 2.9999.8 I'm using the following HTML (head and relevant code included) <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Photo slideshow with Java Scritp</title> <link href="../styles/photoslide_test1.css" rel="stylesheet" type="text/css" /> <script type="text/jscript" src="../jscripts/jquery-1.8.2.js">
postal code is h2b3f4 validations
Hi, I need to check the postal code is h2b3f4 But i worked as h2bfff and so on... For Eg: first three character is below the searchwords and next three character is anything. this is i worked. But now i want first three character is validated form search words and next three character is 3G3 That means Number Letter Number... Please any one help.. to change my below code Below code: function doSubmit(myform){ searchWords = ['h7l', 'h1h', 'h8t' ,'h1g','h1j','h1k','h1m','h1p','h1r','h1s','h1t','h1v','h1w','h1x','h1y','h1z','h2a','h2b','h2c','h2e','h2g','h2h','h2j','h2k','h2n','h2l','h2m','h2p','h2r','h2s','h2t','h2v','h2w','h2x','h2y','h2z','h3a','h3b','h3c','h3e','h3g','h3h','h3j','h3k','h3l','h3m','h3n','h3p','h3r','h3s','h3t','h3v','h3w','h3x','h3y','h3z','h4a','h4b','h4c','h4e','h4g','h4h','h4j','h4k','h4l','h4m','h4p','h4n','h4r','h4s','h4t','h4v','h4w','h4x','h4y','h7m','h7n','h7r','h7p','h7s','h7t','h7v','h7w','h7x','h7y','h8n','h8p','h8r','h8s','h8t','h8y','h8z','h9a','h9b','h9c','h9e','h9g','h9h','h9j','h9k','h9p','h9r','h9s','h9w','h9x','j7t','j7v','j7w','h7g','h7e'];
Decimal value assetion in q-unit
I really hope this wasn't asked before... i really couldn't find anything :S... How do I assert correct decimal value with a bit of tolerance? Lets say I want to assert this: 1 / 3 I don't want to assert this with a long string like this: equal(1 / 3, 0.3333333333333333) I would like to specify tolerance for it like this: equal(1 / 3, 0.33, 0.01) // As in... value can be from 0.32 to 0.34 Is this possible in q-unit? One possible solution to this would be if i multiplied the result by like 1000 and
json-jquery autocomplete
how to import json data from a url into the jquery autocomplete text box...
Help! What's wrong with my code?
I have created a teaching portfolio on Google Sites. I want the menu to be expandable, e.g. when you click on "Courses Taught," the menu will expand so you can see links to various courses pages - as opposed to having to create a whole new page. You can see the example here: https://sites.google.com/site/clareeileencallahan/teaching-portfolio The code I am using below. As you can see, under "Courses Taught" are links two two course descriptions. I was able to find a way to get the menu to collapse,
Working with checkboxes
Hello everyone!!! I am really need your help. I have a list with checkboxes, like: CHK1(main category) --CHK2(sub category) --CHK3(sub category) --CHK4(sub category) How can I do the next things: 1) When I click the CHK1 all sub categories will checked? 2) When I check the sub category, the main category will checked automatic? THANKS.
Loading external content into div withinout iframe
I have a website that has used an iframe for a long time to display external content within my page. As of recently, the external website has enabled x-frame-headers that blocks us from using an iframe. I am trying to find a way to use ajax to request a local page on my server that redirects to the external page and then loads into a div tag. Number one I dont know if this is possible, but the issue I am having thus far is that i cant seem to capture the data of the redirected page. I see
date picker
I am using the date picker function: function Datepicker() { this.debug = false; // Change this to true to start debugging this._curInst = null; // The current instance in use this._keyEvent = false; // If the last event was a key event this._disabledInputs = []; // List of date picker inputs that have been disabled this._datepickerShowing = false; // True if the popup picker is showing , false if not this._inDialog = false; // True if showing within a "dialog", false if not this._mainDivId = 'ui-datepicker-div';
.change(handler); How to create a personallized handler to add to the .change method
Hello to everyone and sorry for my bad english. My problem is the following. I have to use the .change() method for a "select" element: $select = $('#idElement"); $select.change(function() { // Some action });What I want to do is to create a stand-alone function in its own right to insert in .change method. Something like: $jQuery.fn.myFunction() { } $select.change(myFunction); And also I'd like to use the (this) parameter also in myFunction; How can i do this? Thank's in advance!
Success message when error, no success message when successful
I am having problem with success messages. If the form is submitted and there are no problems, I want it to alert Success. If the form is submitted and there are problems, I want it to alert Error occurred. Currently, if I submit something that is posted to MySQL successfully, it gives me no messages. If I submit something that does not meet the requirements within the PHP script it gives me the Success message, not the error message. JQUERY: [code] $(document).ready(function(){ $("#security_add_category").click(function(event){
Jquery call wont work after page calls itself
Kind of hard to explain. But with the website here: http://beerportfolio.com/mobile/ the button on the top left opens up the side bar navigation. When a user puts in the login information the page calls itself with this code: <h5>Sign In</h5> <form name=\"input\" action=\"index.php\" method=\"post\"> User Name: <input type=\"text\" name=\"user\" id=\"user\" /> </p> Password: <input type=\"password\" name=\"password\" id=\"password\" /> <div class=\"blank-divider\"></div> <p> <input type=\"submit\"
selector issue
Hi, I am a newby here. I have tried to use jquery statement to change the value of height, it failed many times. Not sure what else I need to do. HTML markup: <div style="height: auto;margin-top:15px;"> <div style="float:left;" class="PRbox"> <div class="tabsButtons"> <div class="PRboxTitle">Press Releases</div> </div> <div style="overflow-y:scroll;overflow-x: hidden;height:330px;"></div> </div> </div> I wanted the selector ".PRbox" as parent to change the value of height for
Adding require.js to jquerymobile template.
If I'm using the CDN files of jquery&jquermobile...how would i implement require.js Any steps or examples would be helpful. thanks. this is from the docs: http://jquerymobile.com/test/docs/pages/backbone-require.html
Conflict between body-wide replace function in toggle function inside the body tag
Hi, I like to realise a multilingual surface of my cms. Therefore I like to use the replace function. The problem is, I use a toggle function which is placed inside the body tag. Both together do not function. How can I solve this problem. I need the toggle function inside the body Tag <body> <div class="switch">switch</div> <div class="show">Text</div> <script type="text/javascript"> $('div.switch').click(function () { $('div.show').toggle(); }); var replaced
Using vmousedown to switch background on a button not working.
I'm trying to toggle the classes on vmousedown and vmouseup. It works ok one time per page div, then it stops working. I've tried $(document).on and delegate, though I'm not sure which element to tie it to. Is there a better way to just change background colors? $( '.logout').live('vmousedown',function(e) { $(this).addClass('ui-bar-c'); } $( '.logout').live('vmouseup',function(e) { $(this).removeClass('ui-bar-c'); }
Can i have multiple views?
Hi, I want to develop a website using PHP MVC and JQuery mobile. My Question is "Can I create different view files for different devices?"
Hiding div onload jquerymobile
Hi, I have a list that I want to hide when the page loads. My problem is that I need to refresh the page to have my ul hidden, because it's not on the first loading. How can I get rid of that ? If needed, here's my code. <script src="/jquerymobile/js/jquery-1.7.1.min.js"></script> <script type="text/javascript">$('#mypage').live('pageinit', function () { $('ul.my-list').hide(); $(".menu-icon").click(function () {$("ul.my-list").toggle();});});</script> <script src="/jquerymobile/js/jquery.mobile-1.1.1.min.js"></script>
JQueryMobile Listview border doubling up
Hi All, For some reason all of my list views whether rendered programatically or just through adding the elements in straight HTML seem to have a double border. It seems as though there is a slight gap which is causing the border bottom and border top to appear as a 2px width border instead of 1px. Any ideas on how to resolve this? Thanks
Next Page