Help getting jquery.collapser to be collapsed by default...
Hi Everyone, I have only just started playing with JSQuery, but have managed to cobble together a semi working attempt at what I'd like to do. I am trying to make a webpage that has hidden tables by default, which can then be uncollapsed. I based it all on this tutorial site: http://www.aakashweb.com/resources/pages/demos/jquery-collapser/ I used Demo 3 as my starting point. In the attached zip file you will find the webpage which has collapsible elements in it (if you click the headers of each table
JQuery.get() -receive text and Javascript objects
Hi I have send data with <a href="javascript:void(0)">1</a> / Get. The script response from the site (url), but the javascript inside (like this <a href="javascript:void(0)">2</a> and other scripts) doesnt work.Someone has an idea how I can enable javascript/respone? Thank you! $(document).ready(function() { $('a').click(function(){ var that = this; $.get('url', {'page':$(that).text()}, function(data){ $('#div_id').html(data); }); }); });
Slide Up on click on body when the element is shown
This is my code I need to Slide up the menu when the user clicks on any part of the body. $('.show-menu').click(function(event) { event.preventDefault(); $(this).addClass('active'); $(this).next('.menu-filter').slideDown(300); }); if($('.menu-filter').is(':visible')){ $('body').click(function(event) { event.preventDefault(); $('.show-menu').removeClass('active'); $('.menu-filter').slideUp(300); }); }
Why does this work and not this (wrapInner() inside a function works but not standalone)
// This entire post is related to IE9 only. All other browsers work // this works if ($('.bttnnew').length) { $('.bttnnew').addClass('hasIcon').each(function(){ var content = $(this).html(); $(this).html('<span class=txtDesc>'+content+'</span><span class=iconHolder></span>'); }); };yields: <a href="..." class="bttnnew hasIcon"><span class="txtDesc">Default Button Text</span><span class="iconHolder"></span></a> // But this does NOT work // in IE 9 if ($('.bttnnew').length)
jScrollPane: scrollbar disappears
Use the pluguin JScrollPane to create a scrollbar within the site area. The content is dynamically generated and therefore need to enable autoReinitialise the plug so that it calculates the height of the content. Within this content is a series of anchors. To function, activated the hijackInternalLinks: true to the plugin capture these anchors. The problem now is that when I click the link that leads to a particular anchor, the scrollbar disappears.
prevent text area from being focussed when div is displayed
I have div, which is set to "display: none" via css. When a user pushes a button I make the div visible via .show(). The problem I'm having is that my iPhone 4S automatically focuses on the text area within this div when I show it and the iPhone's keyboard is displayed on the screen. Should using .show on the div bring the text area into focus? It doesn't seem like it should to me. Here's the div, with display set to none: <div id="message_sender" style="display: none"> <label for="messageText"><strong>Message:</strong></label>
rotator that works on desktop and pc
Hi I have been asked to make a site mobile friendly, and so am making it responsive - no problems there. however, the site has an image rotator on the front page that's made with flash, so I figured I'd replace that with a jquery affair. The site is coded in xhtml4.1 trans with css2. I am not sure what the best way to proceed for the image rotator is - I was hoping to get one jquery solution that works on iPhones, android etc as well as desktop. However, when I start my googling I discover that there
Custom select menu options not positioned under select
I am trying to use the custom select menu and finding that the options are displayed in a location far away from the select menu and label. I am using the custom select menu inside a dialog - not sure if that is what is causing the issue or not. I have the following code: <div data-role="fieldcontain"> <label class="ui-input-text">Contact</label> <div class="ui-div-contain"> <select name="user" id="user" data-native-menu="false"
Is there any {{while}} loop in JsRender? I
Is there any {{while}} loop in JsRender? I could find {{for}} loop but required while kind of loop Chirag
Moving an element
I have image that I want to move from one place to second place, I use animate and left, right or top. What I want is to kill in someway the element because when I moved it to the bottom for example I get scroll bars for X and Y because the screen is now too big, Who I can move element to any place that I want and save the screen size?
form elements in lists not theming
I have a list being generated and feed into a jquery mobile page via json. Each list element contains two select lists and each list has the data-role="fieldcontain" set. I'm also using: $('#qualslist').html(data); $("#qualslist").listview('refresh'); To add the list of the page and refresh it. This is theming the main list as expected, however the select lists aren't themeing, they just look like standard list elements. the json looks like: "<li data-role=\"fieldcontain\">GCSE Additional
jQuery animation glitch
Hello, I'm developing a portfolio for a client with animations using jQuery. The website is http://go4impact.com/site/index2.html The problem I'm having is that when you click on Client Samples >> Print, Graphics, Websites, Case Studies it starts an animation of sorts. If you click on the same tab again before the animation starts, it calls for the animation to be started again, which leaves the previous animation kind of glitchy and leaves a sort of "residue". How do I fix this? I've tried using
Using fixed footer with Jquery mobile + phonegap on android
I am building a phonegap app for Android using jquery mobile and having some trouble with fixed footers. Please see the HTML code below. <!DOCTYPE HTML> <html>
<head>
<title>Test</title>
<script type="text/javascript" charset="utf-8" src="cordova-2.0.0.js">
</script>
<script type="text/javascript" src="js/jquery-1.7.min.js">
</script>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/jquery.mobile-1.1.1.min.css" />
jQuery Template Engine
Hi All, As you see we've been busy developing couple of plugins for our new projects. One is jQuery Template Engine. To merge loaded data at ajax call with templates in project. Its easy to use and free for everyone. see more samples here jTemplate Samples <select id='countries'> <option loop='true'>%#field%</option> </select> var loadedData = ['Australia', 'Brazil', 'Canada', 'China', 'England', 'France', 'Italy', 'United State']; $('#countries').template(loadedData); <select id="countries">
value of checkbox attr not changing as expected
using this html <p><input id="agree" type="checkbox" /> I agree: </p> and this jquery $(document).ready(function() { $('#agree').change(function() { alert($(this).attr('value')); }); }); When I run this I start with a unchecked checkbox as I should. When I click the first time a check appears in the box ant the alert messate says on however the next time I click the check goes away but the alert box comes up with the on (shouldn't it be blank?) every time I click the the alert
Stop update of URL
Hello, I am trying to make a JQM app but I seem to have ran into some trouble. I've created a form to allow for login. I set the action to 'login' but when I post the page with a simple button the url changes to http://baseUrl/login I guess this is expected from a JQM-point-of-view but for me it looks very ugly. Is there some way I can prevent it from updating? I don't care about back-button functionality. [edit] Maybe I should add that it really is the login that bothers me the most because the
jQuery BlockUI Plugin clashing with jQuery UI
The methods for block and unblock in jQuery BlockUI Plugin clash with the jQuery UI datepicker. jQuery BlockUI Plugin // global $ methods for blocking/unblocking the entire page $.blockUI = function(opts) { install(window, opts); }; $.unblockUI = function(opts) { remove(window, opts); }; jQuery UI datepicker this._showDatepicker(this._dialogInput[0]),$.blockUI&&$.blockUI(this.dpDiv),
How to create tabs with “content” on fly on click of hyperlinks under grid?
In my legacy webapplication (using jquery,struts, java), i show the emails in grid(using datatable) where subject is one of the column under grid and values under it is hyperlink generated on the fly at server side.Right now, when i click on any subject hyperlink , its contents is shown (as hyperlink points to struts action class which process the request for that specific email id and forward to another jsp) on the same browser and return button is provided on that so that user once view the content,
Why this fails? equal($("<h1/>"), $("<h1/>"))
Or even equal($("<h1/>")[0], $("<h1/>")[0]) http://jsfiddle.net/kdEtk/24/ Thanks
ipad css
http://jsfiddle.net/rajkumart08/GRPe4/embedded/result/ how to make this div movable in css when the width of the browser is expanded... since it does not work properly in ipad...
jquery slideshow with text across fading in and out
Hi I am working on a three image slideshow. As they say a picture is worth a thousand words. But it would be even nicer If I could also have text fading in and out across the image slider. <head> <script type="text/javascript" src="../js/jquery-1.7.2.min.js"></script> <script type="text/javascript" src="../js/jquery.cycle.js"></script> <script type="text/javascript" $(document).ready(function(){ S("#slideshow").cycle() }); </script> <style> #slideshow{ width: 800px; height: 200px;
Jquery.post response Text not working.
Hello, I am having difficulty getting message from response text from the server. I was wondering if anyone can assist? My code is as follows: $(document).ready(function() { $('#xmail').submit(function(){ $("#loader").fadeOut(100).show(); var name = $("#name").val(); var email = $("#email").val(); var subject = $("#subject").val(); var message = $("#message").val(); var pattern = /^([a-zA-Z0-9_.-])+@([a-zA-Z0-9_.-])+\.([a-zA-Z])+([a-zA-Z])+/;
how to use the .text() method with variable text to insert
I have a JSON object full of text strings. I also have a function to change the HTML text depending upon the user's selected country, which they can change around at will. Most of the function works, but the expression with .text()(function(){ }) does not change the HTML text. What do I need to change? Is the problem in the function or in the object? Here is relevant code. var countryText = { "eng":[ { "US":[ { "stateMessage2"
find sequence of characters in paragraph with several spans
Hi, is there an easy jQuery way to get a sequence of characters like: e.g.: 'wor' in <p><span>wo</span><span>rd</span></p> and replace it with for example: <p><span><span style=backgroundcolor:yellow>wo</span></span><span><span style=backgroundcolor:yellow>r</span>d</span></p>
Convert AJAX call from jQuery 1.4 to 1.8
I have the following code that works well if I use jQuery 1.4 however I would like to upgrade to latest version 1.8 and this code returns '0 error' when jQuery above 1.5 is used. Would someone know what i need to change to make it 1.8 compatible please. <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>PA Web Test</title> <script src="jquery-1.8.0.js" type="text/javascript"></script> <script type="text/javascript"> var offset = 0; var howMany
How to do a page 'slide' from left to right? Example inside.
If you click on this link: http://asyraf9.github.com/jquery-mobile/#scroll and click on the 'Features' item on the left, the page transition that occurs is my goal. I'd like to know how to do that action with my code. I don't need the split-view, but the ability to click on a menu item and pop over to a new page with the nifty little sliding animation. Thanks for the ideas!
finding words that are scattered in several nodes
Hi, I'm finding words in a text, which code below works: $('p *',$(frame).contents()).each(function(){ $('*',this).contents().add($(this).contents()).filter(function(){ return this.nodeType==3 && $.trim($(this).text()).length>0 }).each(function(){ if(!($(this).parent()).hasClass('HL')){ var html=$(this).text(); var compare=$(this).text(); html=html.replace(new RegExp(text, "gi"),function(matched) {return "<span class='HL' style=background-color:#d2b0ff>" + matched + "</span>";});
Tablesorter 2 is not sorting money properly
First off, let me say that the tablesorter plugin is amazing. Great job guys! I've seemed to encounter some sort of bug, for some reason the column with money is not being sorted properly... any ideas as to how i can fix this? Thanks all. Here's the code i'm using: http://pastebin.com/Xm1gtk4S
Cycle plugin count
Hi! I'm using the Cycle plugin with a counter in my site, like this: http://jquery.malsup.com/cycle/count.html In the previous example, the current slide number changes AFTER the effect. I'd like it to change BEFORE the effect, but I can't seem to find the way to do it (using the before: option instead of the after: one, etc...) Any help would be appreciated.
Not able to Close the title of a Dialog with .dialog('close')
Here is Code , when .dialog('close') triggers only the content of dialog is closed and the title bar remains on the page , Does any one have idea am I using the wrong way to close dialog box ? function popDialog(){ if ($('#dialog').parents('.ui-dialog:visible').length) { $('#dialog').dialog('close'); } $("#dialog").dialog({ open: function(){ $(this).load('/privacy.jsp'); }, title: 'A dynamically loaded dialog' }); }
Help with Hover Effect on Touchscreens and Mobile Devices
I recently added a circle hover effect to the homepage of my website using a Circle Hover Effects with CSS Transitions tutorial I found online. However, I just realized that the effect doesn't seem to work at all on touchscreen/mobile devices- it just appears like a regular image (i.e. no flipping, linking to another page, etc.). :( In the tutorial comments, one reader suggested using jQuery Mobile to fix the problem, but seeing as I have zero experience with Java/jQuery I'm not sure what to do!
Play video once at page load
I need to play a video when someone first visits my JQM page. The video should play, then when finished the JQM page is displayed. I was using the following snippet which used to work fine with a previous version of jquery: <!-- / Play video on load --> <script type="text/javascript"> window.onload = function () { setTimeout('delayer()', 50); } function delayer() { window.location = 'http://vid.ly/1u5m6m '; } </script> When using:
jQuery Form Transform Problem
I am using a jQuery plugin to change the appearance of certain parts of my form, I believe that the plugin name is formTransform. When applying the jQuery to drop down list menus, the plugin works fine for two of them but then does not show the third one...it is almost as if there is a limit to how many drop down lists the plugin can apply to. The same thing happens for radio and check box groups. I have looked at the code but can not see what would be causing this to happen. Any help would be appreciated.
Live search function suddenly stopped working!
$.extend($.expr[":"], { "containsNC": function(elem, i, match, array) { return (elem.textContent || elem.innerText || "").toLowerCase().indexOf((match[3] || "").toLowerCase()) >= 0; } }); $("input[name$='search']").keyup(function() { var filter = $(this).val(); $("#contentchampions a:not(:containsNC(" + filter + "))").css("display","none"); $("#contentchampions a:containsNC(" + filter + ")").css("display","block"); }); This code has always been working. I didn't change anything and suddenly it stopped
input text value after jquery ajax post
Hi, I have a textfield and a button next to this field. When I click this button, a javascript function is called, i get the value from the textfield and submit this value to an action using jquery ajax. The action is called successfully and i am able to perform whatever i wanted to do with the value submitted in the action. But, the next time when I enter a new value in the textfield and click the button, in the javascript function, when I get the value from the textfield to submit, the value
Tablesorter, PHP and multiple tables
Hello, I'm planning on using the table sorter plugin. The problem I'm having is that I'm generating more than one table using PHP. What's the best way to have a unique table id and call the table sorter for each tables generated on the fly? I hope I'm clear enough in my question ... Regards, Olivier
New to jQM - need help with refresh
I'm new to jQuery Mobile, so hopefully this is a really easy answer. I've built a simple php page that uses jQM to show a list of links (using the <ul> <li> format). Each <li> link uses a standard html anchor tag to go to load a different page. However, the page that is linked to does not use jQM. (It uses a javascript plugin that isn't compatible with jQM). When this page loads, the plugin doesn't register because the page still seems to think it's under jQM control. If the user refreshes
how to retrieve data from database based on postition in phonegap?
I'm displaying the alphabets in a grid view,whenever i click on each alphabet it has to display the corresponding words of that alphabet,for that i could able to get the position of each alphabet,so how can i retrieve or pass the data from database? here is the screenshot of that Copy code var a2zArray =['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z']; $(document).ready(function() { createA2ZGrid(); }); function createA2ZGrid(){ var rowElem='';
Differences beetweer .trigger 'refresh' and 'updatelayout'
Hi, in starting programing whit jquery mobile and have a dude about update items created dinamic i use .trigger('create') for make this alive but have a dude about using triger 'refresh' or 'updatelayout' what i must used? Thanks forward.!
How to execute php in ready function?
I want to execute php in javascript file (js extension file) how can I do this? Thanks
Next Page