Jquery Draggable effect lots after transferring divs
Im new with Jquery UI Draggable. heres my problem, I have 2 Divs which items may be transfered between two divs. Why does the draggable effect lost when a div transferred to other div then returned? I cannot use helper clone. element must be draggable at all time. Here is to replicate the issue on jsfiddle https://jsfiddle.net/w7vjuuqx/7/: drag and drop the blue box from red box to green box. drag and drop the blue box from green box to red box. repeat step 1. here the drag effect lost. HTML: <div
Send inputdata from textbox automatically
Goal: Every time you make a input data in the textbox (named txtInputData) you send the data to the server automatically and you compare the input data to the database's table. In the end you retrieve a true or false if the data of txtInputData is the same from the database. Problem: I don't know how to make the textbox to send the data to the server with json automatically in every time when you make a input data. I don't know where to start? It sounds to be more complicated than I thought. Info:
How can I collapse jquery accordion by default/on page load?
Please find the code on this bootply - http://www.bootply.com/jL12JxNqnF When the page gets loaded,I want all the minus signs should be plus and the accordion should be collapsed by default
Jquery Tabs:call tab inside a Tab
How do I call a nested tab inside tab from an external link ? for example : I call a tab from external link by using "serve.comp.com/index.html#parent-tab-1" , how do I extend it to the nested tab ? Any help is highly appreciated. Thanks In Advance.
disabled/enable checkboxes based on drop down menu selection
Hello, My original question was here (thanks for the huge help jakecigar), however instead of having the divs hidden initially, I have decided to change it up and have the checkboxes disabled in the beginning. Once the person selects a major from the drop down menu, the checkboxes (A,B,C,D,E) become intactive. This is working fine. However, once a gender radio button is clicked and then a citizen radio button is clicked, any or all of the checkboxes are supposed to become active/enabled. Unfortunately
advanced .selectable
Hello! Is it possible to make advanced .selectable with following ability: 1. Select ability as it is now. 2. Last value in dropdown list is input for write my own value (like general select). Thanks.
Custom non-bubbling events and jQuery delegated handlers
I posted this question over at StackOverflow if you want some more context, but I think I can post an abridged version here. I am creating custom events which are very similar in nature to mouseenter and mouseleave. Because of this, the elements do not bubble. Because the events don't bubble, the events don't trigger any delegated handlers. In jQuery's source there is a special case for mouseenter and mouseleave events to make them work with delegated handlers. Is it possible for my custom event
Draggable jumps at the first drag
Please refer to this jsFiddle example. I want the draggable being dragged into the sortable section so it could be sorted. At the first time dragging the draggable, it jumps out of viewable area. Yet it is still draggable. It just doesn't stick to mouse cursor. There is a very similar demo on jQuery UI's website. Somehow it doesn't have such an issue. The following code is the HTML page of my example. It could also be downloaded at here. <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8">
select statement instead for whole document for a subdocument (Tab content)
Hi all I have a TAB constellation with 3 TABS 2 of the TAB content html documents (Panel, MAP) are containing some equal ids because the same datapoints must be displayed (Manual Operation, Robot Stop) for actualization of data I'm looking for a selector to select only the document in the active tab and not the whole DOM. Otherwise just the first element with the id will be found in Panel, but not the second in MAP. // Map dynamic data function MapData(){ var active = $('#tabs').tabs( "option",
Positioning Elements (divs) Dynamically
Is there a way to position divs dynamically using jQuery? I want to achieve this basic layout but rather than typing in each div's absolute position I'm wondering whether jQuery can somehow specify an offset/position (so that each div is a specified distance from the previous div) together with the number of divs per row to achieve the same thing. JSFiddle I realise I could set the divs as in-line blocks in the parent div but I have reasons for not wanting to do that. I would like if it is possible
Windows Phone 8 Page Render Problems
Hello, I have been developing web site using JQM. When I open it at Windows Phone 8 device(Lumia 820 and Lumia 920), I see page render problems. I'm using jquery.mobile-1.3.2 and jquery-1.9.1. Problem appears in http://demos.jquerymobile.com/1.3.2/widgets/buttons/ web page too, at Disabled section. I tried to, Change x-ua-compatible as IE9, IE10, edge. Change viewport like, <meta name="viewport" content="initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height"
datetimepicker needs to block scroll mouse wheel ?
hi The form uses many datetimepicker input fields and has dozens of other fields that have to be scrolled thru alot, so as the user scrolls if the page brings up a datetimepicker textbox field, it stops scrolling the page and begins scrolling thru the date that was there. Is there something like a setting for "noSpinbtn:true" so that the text value does not increment on the mouse scroll? or disableMouseWheel?
Jquery mobile block my normal events in Jquery
Hi I have this script code to move a slide to left and right with function click on the arrows. I am using jquery 1.11.3 But I have a problem mobile device. I want to insert the event swipe but when I insert the script of Jquery mobile with Jquery, like this: Both the same time, my swipe event works perfect but the others function on jquery are block, not working. I don't why happend it. Any help ? Thank <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script> <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
show div based on drop down menu select option class
I'm not a newbie but let's just say I am advancing slowly. Thank you to all who have helped me up until this point. Here's my issue. While the code in my jsfiddle below works, I still get the following error: Uncaught ReferenceError: startFilter is not defined Of course, because of this error, I can't get any additional jquery to work. The purpose of the drop down menu is so that depending on what is selected, then the proper div or divs appear. the correct divs are appearing but until I figure
Publishing jQuery-UI version 1.11.2 to npm
We recently moved to npm from bower. Unfortunately version 1.11.2 is not supported in npm as its nor published. jQuery-UI version 1.11.2 was recently approved for eclipse smarthome project by eclipse CQ team(which took almost 3 months). But as npm does not have 1.11.2 the development of some features is halted. I know it a lot to ask but it would be really great if we could get version 1.11.2 published to npm. Approved CQ for jQuery-UI: https://github.com/eclipse/smarthome/pull/788#issuecomment-168435447
I've Developed TreeView Control
I've developed TreeView Control based on JSON model, how can I submit it to jQuery UI project to be tested and get implemented?
The theme changes just colors, dosen't allow editing.
Hi there, It may sound silly, but I've spent 2 days of installing and uninstalling themes but the end result is always just changing colors. Please help me with the above, because it drives me crazy! Cheers and Thanks! Zaggy Always like this:
jQuery AJAX not sending variable to PHP file
Hello, I am just starting to use jQuery and am using AJAX. On the click of a button, this function is called on the JS side: function generatePerson() { $.ajax({ url: "php/full_name.php", method: "POST", data: {post_ismale: true}, dataType: "html", success: function() { $("#data").load("php/person.php"); } }); } Now, the code works fine EXCEPT for the data that is being sent (post_ismale). This code returns nothing on the PHP side:
Inserting a value at the correct index in array;
Hi, if I have an array such as this; ages = new Array(19,22,24,29,27); // This could be any random numbers; and I want to add the age 26. How would I go about it in a function or is there a jQuery method I could use for it? Thanks in advance;
How to disable dates from mysql using jquery ui datepicker?
let's say you have a car rental system. you want to disable the startdate and the end_date for the cars that are already booked.
what will happen if i apply a jquery animation to an element which already have a css animation?
html: <div class="loader"></div> css: .loader{ animation : turn 2s infinite; } @keyframes turn{ /* turn a half round */ }js: var loader=$(".loader"); loader.style.animationPlayState="paused"; loader.animate({"transform":"rotate(360deg)"},300,"linear"); if i pause a css animation and then start a jquery animation,what will happen?
Navigate event not firimg
Hi, I'm new with JQM and I do not understand the navigate event within multipage document. I want to navigate through the different pages and make ajax requests to a server to refresh some of the content. The page structure is like this: <div data-role="page" id="map-page"> <div class="init"> <h1>Map Page</h1> <ul> <li><a href="#list-page">Go to List</a></li> <li><a href="#picture-page">Take Picture</a></li>
Line Break on a Tooltip
Is there a way to add/include a line break to a jQuery Tool Tip. I've tried 
 (amongst other things) but to no avail... <div class="menu" title="Click on a number to select which 
 game you'd like to play..."> I'd like to be able to control how the text appears in the tooltip (i.e. where the line break appears, rather than the automatic word wrap), e.g. I'd like to be able to show this tooltip as: Click on a number to select which game you'd like to play... rather than the way it defaults to
Default State on Page Load
I have ten different possible 'states' based on which button the user clicks on, e.g. if the user clicks button one, the first 15 divs are shown (with their associated css selectors), if they click button two, the first 20 divs are shown (with their associated css selectors) and so on. My question is, how can I make one particular 'setting' the default when the page is loaded, e.g., I would like to make this the default when the page is loaded (which is the equivalent of the user clicking button
Hide Remaining Elements
I have 28 'elements (div id's)' and I need to show a different 'start state' based on which 'one' of 'twelve' different buttons is selected by the user (e.g. if the user clicks on button 1, 15 of the 28 elements are shown, if the user clicks on button 2, 20 of the 28 divs are shown and so on. I'm using the following jquery code to reset the starting state each time a different button is clicked on... so I'm basically re-showing any previously hidden divs with: $("#answerCardHolder div:hidden").show();
Loop through list of field inputs and submit form in jquery
I want to submit a form repeatedly with different input values. I wrote a piece of code ages ago which I've tried to adapt for my current needs but I can't get it to work, it doesn't loop. My code so far looks like this: function mycode() { $("[name='searchtext']").val(inputArray[n]); $("button").click(); output[n] =$("span#outcome").text(); output[n] = ("|"+n+"|").concat(output[n]); n+=1; } var inputArray = ['A','B','C','D','E','F']; var output = []; var n = 0; $(document).ready(function() { setInterval(mycode(),
My script seems to be broken jQuery/JavaScript
Hi guys, First post here. So here is my problem, This was working perfectly, but after about some time it stopped working, I don't know what I changed and it is giving me the biggest headache I have ever had. What is supposed to happen is the JavaScript is supposed to call data and write it into its corresponding field. It has a timer of which it displays the different strings on the web portal. I call jQuery CDM from Microsofts source in the beginning of my site in the header: <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.12.1.min.js"></script>
jquery mobile reinitialize page as the beginning
hi,i have a problem in jq mobile app I have a page with form,input text,label,ecc ecc...when i return in this page through the back button,I would like to re-initialize the page as it is written in my index. how can I do?
image(profile picture) upload with html form by jquery and ajax only
i have html form and at the top of the html form i have profile picture feature so that user can upload his picture while filling the form what i want is, if user upload his profile picture i want to temporary show that image inside profile picture div and dont save it into folder or database until user will fill the form completely and save if user will save the rest of the form with profile picture than this image should saved in upload folder and its path must be saved in databse.but if user cancel
how to us blur() function with input mask
I am using this input mask plugin, http://digitalbush.com/wp-content/uploads/2013/01/jquery.maskedinput-1.3.1.min_.js. What I am trying to do is to use the blur(). Currently right now, I have blur working, but only to a certain extent. What I mean is that if the text field is empty, the blur() works. But if the text field contains data, the blur() is still kicking in and displaying the value that I have set for blur into the textfield rather than keeping what is inputting in the field. I am unsure
jQuery Hide attribute value past certain length
I have long base:64 strings that I am putting as the values of hidden elements. How can I limit how many are shown in the debug inspector? They are really annoying and take up a lot of space. E.g. Instead of this: <input name="[0].CoverImagePath" type="hidden" value="/9j/4AAQSkZJRgABAQEAYABgAAD/2wBDAAgGBgcGBQgHBwcJCQgKDBQNDAsLDBkSEw8UHRofHh0aHBwgJC4nICIsIxwcKDcpLDAxNDQ0Hyc5PTgyPC4zNDL/2wBDAQkJCQwLDBgNDRgyIRwhMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjL/wAARCADZANkDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R">
Comparing a Text Element and a String
I'm struggling to understand where I'm going wrong. I'm using a draggable/droppable element and I'm extracting the <p> tag value using: var rightNumber = ui.draggable.text(); and assigning it to the variable rightNumber. The value of the <p> tag is set to '4' (but can be changed dynamically). I want to use an if/else statement to compare the value of rightNumber with the value extracted from the <p> tag but it always defaults to false, irrespective of whether rightNumber actually equals "4". Running
Animation pictures with the removal, when going beyond the browser window
Hello. Can you please tell how to do the animation then car runs on background. Background has widht: 100% of browser window. When car come to the end of browser window (or background) it must disappear but only after crossing browser window (or background) JS Bin There is a background image, there are other pictures that move on its background. I did the animation itself with animate(), but I can not figure out how to: 1) remove the image when you crossing out of the browser (my window expands).
copy change event to keyup
Hi I'm fairly new to jquery, I'm in a situation where I need to copy the onchange event handler to the onkeyup event handler for a select statement. Can anyone offer a way to do this using jquery? <html> <head> <title>onchange test case</title> <script src=https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js></script> </head> <body> <form> <select id="testonchange"> <option>option1</option> <option>option2</option> <option>option3</option> </select> <button>bla</button> </form> <script>
issue re-opening a div tag after closing
Hello, Problem: reopening a a div tag via button. initial page load, the div tag is hidden by design, this works. User needs to change location information so he/she clicks the button(buttonONE) to open the div tag to make changes, this works. after the changes are made the user clicks the button(buttonTWO) to save the information and the div tag is closed at the same time, this also works. If a user decides to reopen the div tag using buttonONE (original button to open the div tag) the div tag remains
Question trying to use datepicker on a bootstrap dynatable field
Hello. I have had to change my pages recent to Bootstrap format. One of my pages contained a table that contained a date field that is available for update. In the past I was able to tie a class to the <input> field and then call datepicker using the class. Here is the code that I currently have defining the table and the datepicker function call: <div class="panel-body"> <div class="flextable" id="updateResults" > <table id="checkedTable"
Setting Header Bar Theme Across All Pages.
Hi, is there a way I can set the theme of the header across all pages. Currently I am using data-theme on the header itself. Thanks.
Newbie troubleshooting question
I am pretty new to jQuery but very excited to learn. What I am trying to accomplish is a series of dropdown menus. The first dropdown menu selection will determine which menu populates next and so on. After the fourth dropdown selection, I would like it to generate a single word. Basically it is a sizing calculator. The first problem I am having is that with this code (clearly something wrong) when I select "Mens", it shows the womens and vice versa. Also, I am having trouble figuring out how to
Passing Parameters with a button.
I have a button like this: <button id="btnthing<@currow>" class="btn" value="#div<@currow>,35">History</button> Ignore <@currow> I want to have the jQuery split the value into two variables. $(document).ready(function(){ $(".btn").click(function(event){ var me = $(this); Now I want to split the var "me" into two variables so I can use one to set the load div and the other to set the rescue_uid1 parameter in the URL. event.preventDefault(); $(me.val()).load("rescue.taf?_function=Listactivitiesonly&rescue_uid1=35");
Where do I find advanced jQuery tutorials?
Hey there, I'm Nick! I just wanted to ask where I can find more tutorials about jQuery (advanced level). Thanks for hearing me.
Next Page