JQuery callback functions fired before event
I don't know if I am doing some silly mistake here but facing this problem of firing callback functions on page init before actual event happens. Here is the code $(document).on("pageinit",function(){ $("#discInvitePopUp").popup({ transition: "slidedown", history: false, afterclose: function( event, ui ) { activeDiscInviteCloseHandler(); }, afteropen: function( event, ui ) { openDiscFrmInvite();
isotope hashchange back button problem
I'm currently having some problems using a hashchange function, in combination with the isotope plugin (http://isotope.metafizzy.co) and it's filtering capabilities. Combined with a hashchange, I'm filtering divs allowing me to navigate in the browser without having to reload the page. On page load all the divs are filtered out (hidden) except for the actual filter buttons, which when clicked bring in the relevant content. Here's a jsfiddle demo: http://jsfiddle.net/neal_fletcher/vcffM/16/ Full demo
Themeroller theme doesn't seem to work properly?
Hi all, I've just attempted to use the themeroller for the first time, but it doesn't seem to render a few things correctly. Here is the theme > Click here Notice the background is not black, and also the collapsibles (Click 'Gallery' and 'Shop') don't seem to show properly and aren't coloured/styled. Is there something obvious that I've missed? The header, footer and top menu buttons seem fine... Using latest jqery mobile. Here's a link to check > Clicky here Here's my header code. EDIT: Ah, think
JQuery + Ajax. Can you import XML from a script?
I know in ajax you can do the following, but my question is instead of sites.xml, can you use a python script 'script.py' to generate an xml object and pass it back to Ajax? $.ajax({ type: "GET", url: "sites.xml", dataType: "xml", success: function(xml) { } });
Correct way to manipulate elements/widgets via JS
Hi, we have many elements on our pages e.g. <li> etc and are using jqms css classes to render them as lists etc. However if we want to change a value with in a list (or other jqm widgets) via javascript (NOT via server call), what is the correct way to change values of the generated jqm elements ? i.e. without having to do lots of nasty stuff like .attr().siblings() etc which aswell as being complex would no doubt make or app unupgradable to new versions of jqm if jqm changed the dom structure of
ajax external url php file
Hello jQuery, They need to upload huge files to ftp, because of the limitation of the plan, I have partially written and copy code to make this work. to use an external php fix this problem. code snippet 1: jQuery/javascript: <script> $(document).ready(function(){ $('#IDFormField_fileupload_0').change(function(){ var file = this.files[0]; name = file.name; size = file.size; type = file.type; //your validation }); $('#IDFormField_fileupload_0').change(function(){ var formData
Panel and the scrolling problem
This is my code with jquery mobile <div data-role="content"> <ul data-role="listview"> <li><a href="#panel-nav1">Subject 1</a></li> <li>Subject 2</li> .....a lot of </ul> </div> <div id="panel-nav1" data-role="panel" data-display="push" data-position="left" data-swipe-close="false"> <ul data-theme="d" data-icon="false" data-divider-theme="d" data-inset="false" data-filter="true" data-filter-placeholder="keywords" data-role="listview" style="overflow:scroll;" id="ulid1"> <li>Subject 2</li> .....a
jqGrid Number of Rows depending on screen size
I am trying to see if it would be a logical approach to decide on the number of rows in jqGrid based on screen size. Say for example if we are browsing from a tiny laptop, I can set the rows to 5 (to avoid redundant vertical scrollbar and make it friendly for the user). If I browse the application from a really big monitor, I can very well set to 100 or like that. Any suggestions to decide on this?
Copy table row and copy data from table column
Hi, I have poblem with some jquery code, can any one help me? My html code in http://jsfiddle.net/6Uv22/ I have couple of question. 1) I want copy blank tr row only if I write min one letter in last row. If I filled third row, I want new tr row as a fourth row. Only Name column are checked if is filled. 2) I want to show copy button. Copy button must be in between row (between first row and second row, second row and third row, and so on) and one button to copy all row. So if I have third row, I
Trying to get the right Object to animate.
http://jsfiddle.net/nakins/SUeyb/ I found some code that would open/expand and close/collapse a div. Once the Div was expanded, I needed to put in other clickable elements, so I removed the .box class, which worked. And, I did some other adding and removing of classes to get a "close" link. But, I'm not animating the original div, but animating the elements inside the div.. In this part of the code, shown below, closes the div. But I'm not sure what is pointing or referencing what. Is $(this) pointing
PROBLEM WITH COUNTRY , STATE AND CITY DROPDOWN LIST AJAX SCRIPT ALONG WITH PHP
Need to rertrieve and decode JSON data sent to PHP programs from AJAX and any additional help with the Country , State, City Dropdown List Jquery Ajax program would be greatly appreciated. <SCRIPT> function loadcountries(){ $.ajax( url : "GETCOUNTRIES.PHP"; data : dataType : JSON ResponseType : JSON async : true success ( function(countries) { var cbocontrol = $("#COUNTRYCBO");
Unwarp doesn't update DOM properly??
I use: $(".Something", this).each(function(index){ $(this).contents().unwrap(); }); To unrwap some blocks such as: this <span class='Something'>is</span> a test ... the problem I then have is that when i step through the nodes, in both IE and Opera it steps through three text nodes: "this ", "is", " a test" ... I would have thought that the fact that i removed the span would combine the text back into one block as if the span never existed in the first place? Any ideas how to update the
Something other than an anchor for tabs
I'm annoyed by Chrome (and probably other browsers) showing a status line of my long URL when I hover over a tab. From what I've read, there's no way to disable this (although I'd be happy to learn otherwise). Is there a way to use something other than an anchor in the list for the tab text? If not, I wonder if the team could consider adding this, maybe a little div or something instead of an anchor.
How to create a map by using jQuery in which I can select cities without any use of google map?
Hi everyone! I want to make a map using jQuery in which I can see the cities change color when hover the mouse and show the name of the city in a list when clicked. I also want to be able to select the city in the list to show it in the map. You know, I want it to work 2way. The point here is that I don't want to use google map at all. I want to draw my own map. Can anyone help me please? Thank you all.
Trying to use two jquery plugins but failing
Hi all, I am trying to use two jquery plugins one for rotation and the other fancybox... they both work seperately but not together! any suggestions would be greatly appreciated! -----------------------------------------------------------here is the code ----------------------------------------------------- <%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site1.master.cs" Inherits="WebApplication2.Site1" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server">
How to tell my jquery hover slide out, not to build up a queue and stop and just slideout on mouseover and slide back in after a mousleave???
Hi all, first of all, thanks in advance for looking at this piece of jquery. This jquery piece should fold out three pictures only to the right, which is working perfectly. Thing is that because of the hover, it's building up a queue and when you hover over it three times or something like that, it doesn't slide back on mouseleave, but it stays slided out, because of this queue... I was told to add a stop function... So I tried...but it doesn't really work... I'm really an amateur on jquery, so
Injecting JQM Pages on the fly and swiping through left & right.
Can anyone help me on how I can add extra JQM pages to my DOM on the fly and then use the swipe method on the newly injected pages to loop through them? To give you some idea I have created a fiddle: http://jsfiddle.net/a4poster/nMR85/1773/ - Hope this helps. Thanks, Lammie.
Jquery Ajax issue submitting with image
I have the following ajax code: $(document).ready(function () { $('body').on('click', '.addtocart', function(){ // Get the form data. This serializes the entire form. pritty easy huh! var form = new FormData($('#myform')[0]); // Make the ajax call $.ajax({ url: 'test.php', type: 'POST', xhr: function() { var myXhr = $.ajaxSettings.xhr(); if(myXhr.upload){
firing the server side click event
Hi, I have an ASP.NET datalist <asp:DataList ID="appointmentList" runat="server" Width="100%"> <ItemTemplate> <div class="appointment"> <div style="float: left; display: inline-block; width: 75%;"> <asp:Label Font-Bold="true" ID="type" runat="server" Text='<%# Eval("AppointmentCategoryDescription") %>'></asp:Label> - <asp:Label ID="date" runat="server" Text='<%# DateTime.Parse(Eval("AppDate").ToString()).ToShortDateString()
formwizard ajax posted values
I have the following code, but I can seem to get the values on the page it posts to (store.asp).; simply by doing a request.querystring. What am i doing wrong? $(function(){ $("#demoForm").formwizard({ formPluginEnabled: true, validationEnabled: true, focusFirstInput : true, formOptions :{ success: function(data){$("#status").fadeTo(500,1,function(){ $(this).html("You are now registered!").fadeTo(5000, 0); })}, beforeSubmit: function(data){$("#data").html("data
Problem in scrolling list view, is very slow any solution
<ul> <li> <a> <fieldset> <checkbox> </checkbox> <label for =checkbox> <label> </fieldset> </a> <a> </a> <li> . . . .<li> <a> <fieldset> <checkbox> </checkbox> <label for =checkbox> <label> </fieldset> </a> <a> </a> <li> </ul> I am construction list order on server side and send data to client and adding in <ul> after that $('#ul').trigger('create'); $('#ul').listview('refresh'); if data more than 100 problem in listview scroll is very slow in ipod but in system it is very fast i need
issue with jquery tab event
Hi, i am working on jquery. and in my project i have used the following code, but whenver i select a tab and refresh.it reolads with the first tab and its contents. but not with the selected tab and its contents. is there any issue with the .js file as i am using jquery1.9.1. <ul id="myTab" class="nav nav-tabs"> <li class="cooldrinks"> <a href="#pepsi" data-toggle="tab">pepsi </a><span class="limca"></span> </li> <li class="coke"> <a href="#coke" data-toggle="tab">coke</a><span class="limca"></span>
returning data to ajax call
I'm invoking a python script from an ajax call (using django) and I want to return data. I've never done this before. I've been reading examples on the web and I came up with this: $.ajax({ url: 'permalink/', type: 'GET', data: { report: "{% url motor.core.reports.views.view the_controller.app.name the_controller.get_name %}", params: "{{ the_report.params_string }}" }, dataType: 'json', success: function (data) { setTimeout(function () {
jquery mobile json listview - all the list loaded at one time
i have a problem with json parsing listview as all the list loaded at one time so take many time as its big so i hope to find a way that make it loaded as how a webpage loaded one by one here is the code i use $.getJSON(url1, function(json) { $('#blogList li').remove(); $.each(json.posts, function(i,dat) { output='<li data-icon="false">'; output += '<a href="singlePost.html?id=' + dat.id + '">'; output +='<div class="ui-li-aside">'; output+='<h3
Scroll only listview
Hi everyone, <div data-role="page" id="RecipelistPage" data-iscroll="enable" > <div class="line" id="line"></div> <div data-role="header" data-theme="a" data-position="fixed" id="RecipeListPageHeader" > <h1 id="RecipeListPageHeaderName">Recipes</h1> <a href="#" data-role="button" data-rel="popup" id="ButtonSync" data-iconpos="notext" data-theme="c" data-iconshadow="false"></a> <a href="#popupMenu" data-role="button" data-rel="popup" id="ButtonMenu" data-iconpos="notext" data-icon="gear" data-theme="c"
JQuery Validation does not work on hidden elements
I am trying to validate a number of forms some of which are collapsed,I can validate the forms that are shown but I can not validate the ones that are collapsed. And I also have tried "ignore". I guess if you tell me how to validate the hidden elements my problem would be solved. I really appreciate your help.
News Ticker Need Help on Mouse hover pause
I have created a news ticker, I need to pause the ticker on mouse hover. Here goes my code. <script> function tick() { $('.ticker li:first').slideUp( function () { $(this).appendTo($('.ticker')).slideDown(); }); } setInterval(function(){ tick () }, 5000) </script> <ul class="ticker"> <li> <h5 class="simple-title leftfloat
Passing data from dynamic listview
Hi there, I'm having trouble with some beginner case: There is a button which appends a li element with id ="123" to an ul element (listview) ... then i wanna click on that new element and a new page should appear saying "element id = 123". It kind of works as long as the li elements were not appended dynamicly but hard coded in the html part. Whats my fault here? <script> var passDataObject = { selectedId: null } $(document).ready(function(){ $("#acclist a").on("click", function(e){
scrolling dosent work
hi , I am using jscrolling plugin for scrool when i changed and add new div for scroll this script doesn't work. good work Unchanged http://jsfiddle.net/r2KjB/1/ doesn't work when i added div . http://jsfiddle.net/ma9An/ How to resolve this ? Please help tnx
Using a query string to populate a radio button and show/hide a div
Hi All, Here's my HTML populated jsFiddle: http://jsfiddle.net/FelixFortis/VQYab/ I'd like to use a query string to populate the radio buttons named "attend" and then show/hide the div #venue_choice based on the result. So if attend = "attend_yes" then the first radio button is selected and the div #venue_choice is shown when the page is visited. Other attend options include "attend_no" and "attend_ppt". Thanks very much!
Spurious load errors in Rails production
In a large application built with Rails 4 I have been getting load errors in production but not development. When I check my production log there is no request received at the server. I have tried turning off data-ajax but the the resulting page will not load in Chrome. Does anybody have any ideas how to fix either of these errors? I have just changed my front menu page from a multi page to a single page and so far the error has not been repeated but may crop up elsewhere. Every time i load my app
Validating fields
<html> <script> function save(){ } </script> <form name="myform" action="http://www.mydomain.com/myformhandler.cgi" method="POST"> <div align="center"><br> <input type="radio" name="group1" value="Milk"> Milk<br> <input type="radio" name="group1" value="Butter" > Butter<br> <input type="radio" name="group1" value="Cheese"> Cheese <hr> <input type="radio" name="group2" value="Water"> Water<br> <input type="radio" name="group2" value="Beer"> Beer<br> <input type="radio" name="group2" value="Wine">
firebug/netbeans missing ;
Both netbeans and firebug say I am missing ; before the function x10 line but I can't see where. Hoping someone can see where I am missing it. <Script type="text/javascript" src="jquery/jquery-1.7.1.js"></script> <script type="text/javascript"> $(document).ready(function(){ var intervalId = setInterval(X10Check, 5000); $("button.toggleStatus").click(function(){ //This Ajax toggles device on and off $x10Device = $(this).data("x10"); $.ajax({ type:
Move overflow text only in other div
Hello Friends, I have one div with height auto and overflow hidden. I need to get only those content which hidden for overflow. Any solution to get this content which is hide because of overflow:hidden. Thanks Balraj
Javascript not working till refresh
i have javascript embeded on my jquery mobile page. the problem the javascript doesn't work unless you refresh the page. any solution on how to make this work once the page loads. here's my code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.3.1 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <style type="text/css"> body,td,th
Problems with on() method
Hello, ppl i'm writing a simple INSERT/ALTER code using ajax and jquery . When i choose a name on my select, a change function starts, then a post method call a new div with a form and data of the selected one. After that, a new button appears... a alter button... But i can't use it, because he isn't on DOM yet... i tried on(), like i've done once with live()... but doesnt work. <!-- jquery script > $("#consulta").on("change", function(){ var cadastro_id = $("#consulta").val(); $.post("cons.php",
Show/hide with a reset event
Hi guys, I'm trying to reset/clear out a response if you change your mind on a show/hide div. You would choose "Yes" to "Other" in the table, type some text into the now shown essay box, but when you choose "No" on "Other" it should clear the text out of the essay box. Please help, thank you in advanced! jsFiddle file: http://jsfiddle.net/Luck12/Csed2/2/ $('input[name="Q45_A_8"]').change(function() { if(1 == $(this).val()) { $('#myDiv').show(); } else { $('#myDiv').hide();
Customizing navbar to different look and feel?
Is it possible to customize navbar as per their design requirement? I am looking to customize the jQuery mobile default navbar looks to different look & feel as per the design requirement. So, any help example would be appreciated.
Datepicker load
Hi, Why does a datepicker only load from a jquery function and not from a javascript function? Example: <script> test(); function test() { $('#datepicker').datepicker(); //Datepicker doesn't load but the function is called } </script> //This works <script> $(function() { $('#datepicker').datepicker(); //Datepicker is loaded </script>
Should I create a function
I have a block of code that I would like to execute every 10 seconds or so and also on a buttons click event. Should I create a function to save on coding repetation ? I will have alot of buttons on the page that will fire this block of code, but realise I can use a class selector to trigger the code. I need the timer interval as 3rd parties will be able to change the values that the code is checking, I am not to concerned about the timer been super accurate. How would I change the code into
Next Page