need manually refresh jquery mobile linked page
0 down vote favorite I follow the tutorial and example of JQuery mobile to implement a menu. For the page itself, it works. But when I click a link, the new page (different html page) shows without the menu. I have to manually click "refresh" button of the browser to make the menu visible. What is wrong? Any information would be appreciated. Thanks in advance. My two pages have the same css, js.. as follow. The differences between these two pages are the word"test1" and "test2" <!DOCTYPE html> <html>
best way to change the elemnt on which the event handler is applied .
hey guys check out the below code :: var i = 1; var funk = function() { return i < 5 ? ++i : i = 1 ; } changeHanderler = function(){ str = funk(); console.log(str); var elem = $('ul li:nth-child('+ i +')'); } $('document').ready(function(){ elem = $('ul li:nth-child('+ i +')'); elem.on('click.ga' , function(){ // even after elem increaments
Change BG image
Hi everyone! I hope someone can help me! I want change html background img on click So, i create an array with images and a for to iterate in array. But, on click, don´t change imgs bg as i want. Follow the code below $('html').on('click', function (e) { var bgs = ['2.jpg','3.jpg','4.jpg']; for(var x in bgs) { console.log(bgs[x]); $(this).css({ background : 'url(http://localhost/w-factory/img/'+bgs[x]+')' }) } });
where do i put the code
I’m trying to make my already existing website, mobile friendly. Where do I put the code to make this happen?
javascript variable hoisting .
hey guys have a look at the below code :: var i = 1; $('document').ready(function(){ str = funk(); console.log(str); var elem = $('ul li:nth-child('+ i +')'); elem.on('click' , function(){ console.log('logged'); funk(); }); }); var funk = function() { return i < 5 ? i++ : i = 0 ; } see how the
Help with a navigation bar.
Hi. This might of been asked but I couldn't find it. I'm new to web design. I have a navigation bar that's horizontal on large screens and when the screen size gets smaller, it changes to just say Menu and it adds a button with three horizontal bars that the user can click. When they click, the menu links are supposed to come out from the side. I'm having trouble with that part though. I'm using jQuery and don't know what's wrong here. The menu comes out when the user clicks or hovers, like
New to jQuery: How to set cookies for stylesheetswitcher?
Hello, I'm new here and I'm learning jQuery :) Code of the switcher: google.load("jquery", "1.3.1"); google.setOnLoadCallback(function() { // Color changer $(".colorblack").click(function(){ $("link").attr("href", "app/tpl/skins/DarkFlat/style/black.css"); return false; }); $(".colorblue").click(function(){ $("link").attr("href", "app/tpl/skins/DarkFlat/style/blue.css"); return false; }); $(".colorgreen").click(function(){
Transitions between views in one page backbone app - jQuery Css3
I want to use some jQuery Css3 transitions like this http://designdrizzle.com/15-amazing-page-transitions-effects-tutorials-in-jquery-and-css3/ in a one page backbone application but I don’t know from where I have to start. Do I need to alter the way I represent all of my views (at present a typical swap view) to get effects? Also, I want to learn 3D thumbnail hover effects with CSS3 and jQuery 3D variations I am a newbie into front end development, so want some help.
Jquery on change and click event problem
Hi jQuery Community, i have a little problem with jQuery. I have a form . In a select choice many checkboxes are grouped reloaded with ajax. This works great so far. Now i have to count the checkboxes if they are checked. And there is a problem. The counter value is to be output once total for all selected checkboxes and even once within the groups . Within the checkbox groups there are also a checkAll and uncheckAll button. These should checkboxes completely checked or not within there groups. As
juqery autocomplete
Hi , I am implementing a jquery autocomplete functionality where I need to do an AJAX call to get the required data . There is a sample code in the jsfiddle below: http://jsfiddle.net/m3MGH/31/ Autocomplete does not work in this ,... can any suggest what is wrong ? Your help is highly appreciated !! Thanks in Advance
jQuery 2.1.4 bug
I have noticed that their is a bug in jQuery 2.1.4. I have made a code through which checking a main checkbox checks all the checkbox in the table. The code works for the first 2 click but does not work from 3 rd click . The code works correctly when i use jquery 1.4.3. You can see the page online at - http://www.yogihosting.com/check-uncheck-all-checkbox-using-jquery/ the jquery code is - <script type="text/javascript"> $(document).ready(function () { $("#mainCheckBox").click(function
How to call Javascript in Jquery Mobile Multipage Template?
Hi, I have a jquery mobile app (which is multipage tempalte) and external javascript needs to be called inside the index.html page. Its working for normal html page and not working multpage template. Please guide me.
Loading script through .load
I have a foreach loop that echoes all the comments, I also added a trash icon so the user can delete them, the problem is that I want the icon to be shown only if the user that wrote the comment hovers on it. Of course when the page is refreshed it works well, but since I'm using Ajax to update the comments on live I'm using this code to update again the loop -- " $( ".test" ).load('../home/{{$image->id}} .test'); ". I'm well aware that in this way scripts won't load, I would like to see if there
Return some html garbage from ajax call
I use the following code that ends up with"success" but the return data is as follows(see the red text): (it continues and I truncated, but I beleive you can get the idea). The real data that is beeng echoed from the php is "abc" " <br /> <font size='1'><table class='xdebug-error xe-notice' dir='ltr' border='1' cellspacing='0' cellpadding='1'> <tr><th align='left' bgcolor='#f57900' colspan="5"><span style='background-color: #cc0000; color: #fce94f; font-size: x-large;'>( ! )</span> Notice: Undefined
HTTPS blocking access from jquery.com/mobile/
Hi all, I was working on a site and experimenting with query.mobile. on my home test server all was working - but when I put it on the main server the query.mobile stopped working. I think I have it tracked down to the SSL cert - https When the .htaccess file is taken away and I view site on HTTP not HTTPS then it works but the HTTPS seems to block the header lines below..... Q: any idea how to fix these links? these are not a problem I think (on my server- not cloud) <link rel="stylesheet"
catcomplete error for jquery-ui v1.11.4
The following code for autocompletion with categories ran fine with jquery-ui v1.10.4: $.widget( "custom.catcomplete", $.ui.autocomplete, { _renderMenu: function( ul, items ) { var that = this, currentCategory = ""; $.each( items, function( index, item ) { if ( item.category != currentCategory ) { ul.append( "<li class='ui-autocomplete-category'>" + item.category + "</li>" ); currentCategory = item.category; }; that._renderItemData( ul, item ); }); } }); When using jquery-ui 1.11.4, I receive an
Simple jQuery Image Slider
Hi everyone i made a Simple jQuery Image Slider with 3 pictures after it gets to picture 3 than it stop. how do i code a simple image slider with autoplay? i appreciate your help bye
"Uncaught Unexpected literal at position 2" from MultiDatesPicker Plugin
I am using [MultiDatesPicker]( http://multidatespickr.sourceforge.net/ ) plugin in my Rails project. My goal is to do an Ajax call and then get the dates which needs to be disabled. After that, once I will click any enabled date it should select a range of date as per the Ajax response `interval`. Here is my code : $(function() { $(document).on('change', '#booking_package_type', function() { var bol = $.inArray( $(this).val(), [ "weekend", "full_week", "midweek", "" ] );
Jquery Help
Hi, I have incremented divs in jquery via plus minus. Inside a div there is a textbox which opens up another textbox, the problem is when i click in that textbox all textbox open and not on that particular div. A fiddle to explain: http://jsfiddle.net/LknLr2am/
Ask user to Save before leaving asp.net page
I have a lab report application built in ASP.Net with C#, with multiple pages in it. Each page can have 5 to 8 data entry sections, each with their own Save button. I am trying to make sure the user saves their entries before changing pages, going to a different site or closing the browser. I found this script, which almost works, but also fires whenever I select one of the Save buttons on the page, thus preventing the user from saving. I am very new to JQuery and need to know how to tell this script
how to expand all nested elements in filter
I am trying to create a script that will open both the parent and child that matches a search. What I want to achieve: http://prntscr.com/7gnnti Notice how the search matches children in both parents, and both parent and child are expanded. Here is the code that I have so far, which only expands the parent: http://jsfiddle.net/fishinapond/zr3aoh2r/1/#&togetherjs=xaNrc0NQNm
how to fix table cell's height and width fixed
Please find the fiddle below, http://jsfiddle.net/raving/3Lvth1dn/6/ When i am creating a 4x4 table the height and width are same, but when i create a table of 2x3 the cell's height and width is changed. Please let me know how to fix the cell's height and width irrespective of number of rows and columns entered. Thanks in Advance
This slider moves from highest price to lowest price and slider's handle should pop on top along with the handle
//calculation $(function() { $( "#pakslider" ).slider({ range: "min", value:0, min: 0, max:10, step: 1, animate:7500, slide: function( event, ui ) { //calcuation logic } } }); }); //getting value from db // some code // // assign value $().ready( function(){ $("#pakslider").slider('value', <?php echo $pd->quantity;>); }); // Append slider $('.ui-slider-handle:eq(0)').append('<span class="price-range-min value" id="slider-value">$' + $('#pakslider').slider('values', 0 ) + '</span>'); </script>
Searching for multiple items from a list in a second list
I have the following code... if ($("#filter_chemistry").val() != "") { $("td.polymerTypel").not(":contains('" + $("#filter_chemistry").val().toLowerCase() + "')").parent().hide(); } Where #filter_chemistry is a form text field, and the td's with the polymerTypel class will contain a list of items similar to st,ac,bde,va for example. If I enter "ac" into my text box, all table rows NOT containing ac in the list will be correctly hidden, all good so far. What I want is to be able to enter ac,va into
empty event
Hello, I'm working with jQuery 2.1.4. My web application uses different div tags and on one div tag there is called empty() from different modules. In my main module I would like to get an event if any submodule calls empty on my div. In code it should be: jQuery("#mydiv").on("empty", function(event) { console.log("div is cleared"); }); and on submodul jQuery("#mydiv").empty(); How can I do this? Thanks
How to remotely use methods of an instance from another html frame
Hi, I'm looking for a solution to change the selection of a tree item by clicking into a text content frame. Just to explain: I have 3 html files: - 1 HTML with the FrameSet <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title> This is my title </title> </head> <frameset cols="20%,*"> <frame src="src/index_toc.html" name="tocframe" id="tocframe" /> <frame src="src/index_main.html" name="main_content"
JQuery function($). Understanding syntax
I am starting to work with Backbone JS but, the problem is am not an expertised in JQuery. So having problem understanding the below code. Can someone help me out understand line by line execution of this JS code Right from the beginning. Would really appreciate the effort. What is function($) till the end (jQuery); (function($){ var ListView = Backbone.View.extend({ el: $('body'), // attaches `this.el` to an existing element. initialize: function(){ _.bindAll(this, 'render'); //
Question about Date object returned by Datepicker's getDate() method
I'm trying to get the date currently selected in the Datepicker. I was going through its API and saw a getDate() method, and it states it returns a Date object. When I clicked to read more about this Date object, it says "The Date type is a JavaScript object that represents a single moment in time, etc." As I read on, there were no listing of this Date object's methods, and yet I don't think it's the standard JavaScript's Date object because I can't access the usual standard Date object methods with
Updating totals with dynamic data using jquery
Hi The following table row repeats on my dust template, usually up to 10 or so results. Each line has a quantity selection. I would like to update the total in the last cell of the row with the quantity * the price on the current table row. Is this possible and what is the best way to do this? Thought I would ask before I wasted too much time trying the wrong thing :) Thanks. {#Lifts[0].Result.Items} <tr> <td> <h5 >{AgeCategory}</h5> <small >Ages {MinimumAge} - {MaximumAge}</small>
How can I select dates automatically while I will click on one date.
I am enabling some dates as per the Ajax response form the server. Here is the code for the same : $(function() { $(document).on('change', '#booking_package_type', function() { var bol = $.inArray($(this).val(), ["weekend", "full_week", "midweek", ""]); var pkg_type = $(this).val(); if (bol == -1) { $("#booking_end_date").prop("disabled", false); } else { $("#booking_end_date").prop("disabled", true); } $.get("/admin/bookings/fetch_dates",
Jquery define multiple custom validation to same input field using jquery validator
<form action="" method="post"> <p> <input data-validation="even_number" type="text"> </p> ... </form> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery-form-validator/2.2.1/jquery.form-validator.min.js"></script> <script> // Add validation $.formUtils.addValidator({ name : 'even_number', validatorFunction : function(value, $el, config, language, $form) { return parseInt(value, 10) % 2 === 0; }, errorMessage :
A relative jQuery beginner got stuck making a simple game
Everything's resolved. It was a typo in a function. Thanks for the effort.
I have some problems with drag and drop functions. There might be some bug that i dont see. If someone can go through my code and help me solve the issue, id be greatful !!!
HTML <!DOCTYPE html> <html> <head> <title>Problem</title> <link rel="stylesheet" type="text/css" href="jquery-ui.css"> <link rel="stylesheet" type="text/css" href="style.css"> <head> <body> <div id="menu"> <div class="intro"> <div class:"numbers" > <div class="number">0</div> <div class="number">1</div> <div class="number">2</div> <div class="number">3</div> <div class="number">4</div> <div class="number">5</div> <div class="number">6</div> <div class="number">7</div>
Why did this method stop firing?
I have this method: /* This causes the textbox to grow dynamically (vertically) as text/rows (lines) are added */ $("[id$=explainPaymentTextBox]").keyup(function (e) { while ($(this).outerHeight() < this.scrollHeight + parseFloat($(this).css("borderTopWidth")) + parseFloat($(this).css("borderBottomWidth"))) { $(this).height($(this).height() + 1); }; }); ...which was working fine (causes the textbox to grow vertically as necessary so that all text entered is visible), but all of a
Website Exit Popup
Hi! I have a jQuery script running on a clients WordPress site where if you click on a link that takes you away from their url it will popup a warning. Website: https://www.membersowncu.org. Go to this URL (https://www.membersowncu.org/loans/auto-loans/) and click on "apply online" in the third paragraph. Works great! However, I need to add a few urls as an exception. So, when they click on those other urls it won't trigger the popup. Here is my code: <script> jQuery(function() { function leave_now(event)
Check if Popup is open then close it
I am using Jquery Mobile for my Applicaion . In my page i have 5 popups as shown above <div data-role="popup" id="one" class="ui-content" data-theme="a"> </div> <div data-role="popup" id="two" class="ui-content" data-theme="a"> </div> <div data-role="popup" id="three" class="ui-content" data-theme="a"> </div> My requirement is that , On click of the device backup button , how can i check if any of the popup is open , close it I have tried
Why do my page sections play whack-a-mole on me?
I've got a web page (Web Part, to be more specific - this is a Sharepoint 2010 extravaganza) that morphs based on who is using it. This simply means that if you are in the "for someone else" category, you will see the entire page, but if you are in the "for self" category, you will see a subset of the page - certain sections will not be shown. The user self-identifies as to what type of user he is. The page begins with a default "for self" scenario (two sections are not shown unless they define themselves
IE 9 issue with Multiple File Upload Plug-in
Browser is IE 9.0.8112.16421 jQuery Multiple File Upload Plugin version is v1.48 (2013-02-19) (The latest I assume) One of my users is having issues getting the multiple attachments to show up when using this browser version. Is there any known issues with this plug in and IE9 or any idea how to possibly work around this? The use of the plug-in was very simple. I just added a "multiple" entry to the input tag and listed the allowed file types and it worked just fine in IE 11/Firefox Any help would
How to use jQuery to get scrollbar thumb positions
In my application, I need to be able to set the horizontal and vertical scrollbar thumbs manually to ensure the visibility of certain elements on my page. Imagine I have a <table> with many rows, enough so that a vertical scrollbar becomes necessary. Based on the user's input, my goal is to automatically position the vertical scrollbar thumb in such a way so that the row with the TARGET texts gets positioned center vertically. In my code snippet below, I use a button, but in actuality, it will be
fixed bottom footer help
Hi all, I am using jquery.mobile-1.4.5 and working on a fixed bottom footer currently as listed below... It works ok - but there is space between each button... Q: Is there a way to have each button auto width to fill so there is no empty space? --------- <footer data-role="footer" class="ui-barNAH" data-position="fixed" data-theme="a"> <div class="ui-grid-c"> <div class="ui-block-a"><a href="#" rel="external" data-role="button" class="ui-btn ui-shadow ui-corner-all ui-btn-icon-left ui-icon-home">Home</a></div>
Next Page