Help with Active navigation
I need help with getting my active navigation to work. im not sure why it won't transfer prom the home page to lets say the navigation page. Here is my code of what I have done. This is for a school project so any help would be very appreciated. <DOCTYPE html> <html> <head> <title></title> <link rel="stylesheet" type="text/css" href="css/style.css"> </head> <body> <div class="background"> <div class="nav"> <a class="a active" href="#">Home</a> <a
jcarousel.responsive.js question
so the prev and next are driven by <a href="#" class="jcarousel-control-prev">‹</a> <a href="#" class="jcarousel-control-next">›</a> which call jcarousel.responsive.css and jcarousel.responsive.js in this latter is the the jquery function that includes $('.jcarousel-control-prev') .jcarouselControl({ target: '-=1' }); $('.jcarousel-control-next') .jcarouselControl({ target: '+=1' }); My problem
Word Count with Jquery, need some help please !!!
I'm using K2 Smartforms and essentially have a Text Area (its named textarea) Underneath the text area there are two data labels, one called WordCount, the other is called Script. Wordcount label stores the actual word count Script, has Literal property ticked and the following expression: <script async defer>$(document).ready(function () { var wrdCountDataLabel = $("[name='WordCount']"); wrdCountDataLabel.parent().find('input[type=text], textarea').keydown(function () { var s = $(this).val() .replace(/(^\s*)|(\s*$)/gi,"")
Invoke class method when slider value change
Hi there, In the following code, how can I make this.setValue to invoke when #sldr value change ? function test() { this.setValue = function () { $("#lbl").text($('#sldr').val()); } $("<input id='sldr' type='range' oninput='this.setValue' min='0' max='255' value='255' />").appendTo("body"); $("<label id='lbl />").text("label").appendTo("body"); } $(function () { new test(); });
problem using draggable()
Hi, I have a series of pages which are ajax-loaded into a column. Behind the column is a div of identical width which provides a semi-transparent background. I prefer to get rid of scrollbars, and give the viewer the means to scroll: using draggable-y. Now: if i use on the imported pages either margins or padding on the left or right, there's a non-scrollable area: and a mousedown in this area overlays the whole column with a blue colour. You can see the effect here Short of recoding all the pages
Syntax Error Unexpected Character
Hi, I need some help in jQuery where i'm receiving this error when try to run the script. {source} <div class="wrap"> <table class="headerTitle"> <tr> <td> <p class="pTitle">STEP 1 : CHOOSE A DONATION AMOUNT</p> </td> </tr> </table> <form id="donationAmount" method="post" action=""> <div id="divFullWidth"> <table class="option-button-donation"> <tr> <td>
Uncaught ReferenceError: $ is not defined
<body> <table id="tbl" style="width:100%"> <tr> <th>id</th> <th colspan="2">email</th> <th>phonenum</th> <th>username</th> <th>name</th> <th>isActive</th> <th>address</th> <th>lastlogin</th> </tremail <tr> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> </tr> </table> </body> <script type="text/javascript"> var rows=[{ id:"0001", email:"wahajzafar06@gmail.com", phonenum:"03314845914",
Jquery drop drag not working for mobile responsive
Hello, I have used this jquery ui min for drop and drag it working on computer (on desktop system) but for mobile responsive is it not working for touch drop and drag.Any suggestion ,how could I overcome from this issue? Thanks Jyoti Shinde
page display error in chrome
hi, i am too to try this jquery mobile. i did everythiing as in demo page. yet chrome through error. plase take a look the screen shop. hope you would help me fix. thanks kristtee
jQuery autocomplete with python cgi as remote source
I am new to python. I don't know how to get the data from python CGI script for jQuery autocomplete. The cgi script generates json data. For example. [{"product": "isoleucyl-tRNA synthetase"} My html so far : $(document).ready(function() { $( "#tags" ).autocomplete({ source: "./search_term.cgi" select: function(event,ui) { var availableTags = ui.item.product; } }); } ); Any help would be much appreciated.
Jquery onclick event
I am using a jquery date picker, i want to display some data from database whenever i click on any date, so i am looking for some onclick event, so that i can call ajax and fetch my data from database, can anyone help me please, how to do it
Hover slide out issue
I have a Div - full screen width. Inside that I ave a fontawesome icon with padding around it. When hovered over I want to expand a DIV below. I've got this done and works fine. But; Because there is white space between my icon and my expanded DIV as soon as I mouse out from the icon it goes away. I want it to remain expanded until I move away from the icon and expanded div
how to assign each value of Json to each textbox in the each column of each row
Hi Friends, https://jsfiddle.net/ch2ybdv3/ Refer the above code. I have a Json object and it may have any number of records and I have table with default 5 rows bcoz the requriement is minimum 5 rows should be visible by default. Now I want to load the json object to each row. Lets say I have json object has 10 records then I have to load 5 records to 5 rows and for the rest of the 5 rows I need to create rows on the fly. Can you help me how to load the records to the table. Each rows has two columns
Triger a tab control
Here is my URL problem: https://leadingchair.com/e-400/ Getting to the middle there is a tab control with 4 tabs. I need to catch the second click event and alert something. Anyone knows how? Thx
strange error in my code, because everything looks alright at least when it comes to colons
Hey, I experienced a strange error in my code, because everything looks alright at least when it comes to colons: <!DOCTYPE html> <html> <head> <title>Page Title</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> </head> <body> <h1>My fruit list:</h1> Fruit Name: <input type="text" id="fruitnameinput" value="" placeholder="Fruit Name"/><br> Fruit Color: <input type="text" id="fruitnamecolor" value="" placeholder="Fruit Color"/><br>
why this script wont work
<!DOCTYPE html> <html> <head> <title>Page Title</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> </head> <body> <h1>My fruit list:</h1> enter your fruits: <input type="text" id="foo" value="" /><br> <button id="buttonclick">Get Value</button> <ol id="fruitList"></ol> <script> var list = $("#fruitList"); var fruits = ["banana", "apple", "peach"]; function redraw (){ list.html(""); $.each(fruits, function(index, value){$("<li/>").text(value).appendTo(list);});
How to pass an object from a link to a function
Environment is MVC with jQuery. I built a cut down example to show my problem: From my web page I consume getDogs from my Controller: public ActionResult getDogs() { List<Dog> myDogs = new List<Dog>(); Dog d = new Dog(); d.dogName = "Doc"; d.dogBreed = "Many"; myDogs.Add(d); d = new Dog(); d.dogName = "Sadie"; d.dogBreed = "Boston Terrier"; myDogs.Add(d); return
loop through json object
Hi all, i have the folowing JSON object: var jsObject = { "name": "Student1", "members": { "data-content-type": "saAfterFullStud", "data-key": 1, "data-value": 007 } , "name": "Student2", "members": { "data-content-type": "saAfterRedStud", "data-key": 1, "data-value": 222
jQuery select input hidden value inside a div
Hi, I have this html <div class="spazio_canzoni_playlist bg-warning"> <div class="orario_playlist">12:40</div> <div class="titolo_autore_codice_selezionata">TEXT - TEXT</div> <div class="aggiungi_play" rel="4157"> <div class="btn btn-danger btn-md">Inserisci</div> </div> <div class="click_play_right start"> <input type="hidden" class="canzone_file" value="value to find"> </div> </div> this is my query function $('.aggiungi_play').click(function (){ // find the class pulsante_aggiungi = $(this);
Updating contents length / size on click
Hi Everyone, new to the forum. I don't know how to title this as it's not easy to explain. I have the following code: https://jsfiddle.net/xpvt214o/448284/ You can click the - in the right of the widget to send it to trash. This works beautifully but I want to be able to offer a way for the user to clear the trash "folder". I first added the following: $( '.trashwidgets' ).append( '<a class="cleartrash" href="#">Clear</a>' ); That works but everytime you add a widget to the trash, it duplicates the
Stay on same page after form, show result in div.
Hey guys n gals, Got a bit stuck, fairly noobish on the jQuery side of things here. (more back end coding only, but the designer guy has decided to step out for a bit. I am submitting a form, to a script, what i need back from is it is a dynamic response, in the form of a webpage pull after sending through the data via POST. (sorry if i'm explaining it wrong.. but like a jQuery powered dynamic select box, but... with a form post thrown in. thanks in advance, and would be much appriciated! Regards,
getJSON not working with typeahead
Bootstrap: 3.3.7 jQuery: 1.11.3 Hi Team, I am facing an issue with using typeahead with a ajax response. My input field looks like below, <input class="form-control typeahead" name="referredBy" value="" type="text" id="referredBy" data-provide="typeahead" autocomplete="off"> my js looks like below; $('.typeahead').typeahead({ hint: true, highlight: true, minLength: 2 }, { source: function(query, process) { var url = "not putting in the actual url" matches = [] teamMemberData = ""; var execAjaxEmployeeLookup
When using a hard-tap gesture, my jQuery Mobile screen freezes
Here's what happens when I do a hard-tap on any page: 1. The view window scrolls to the top of the page and the header and footer are displayed. 2. The screen freezes. I'm unable to scroll up or down. I can click my "Back" button which takes me to the home page. But the home page is also frozen. If I do a browser refresh, that resolves the problem until I do a hard-tap gesture on the screen. I only have an iPhone for testing; so I don't know if this same anomaly occurs with an Android device.
jQuery not working on my browser(chrome) for my pixel art project
Please help. I did a project on pixel art marker, but it is not working on my browser. jQuery is not running on my browser (chrome). the following error message is always returned in the console: Uncaught ReferenceError: $ is not defined at designs.js:1 below is the html and javascript code. <!DOCTYPE html> <html> <head> <title>Pixel Art Maker!</title> <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Monoton"> <link rel="stylesheet" href="styles.css"> <script
Eliminate white screen between animations
I have just discovered Barba.js and find it very useful. It provides smooth transitions between URLs of the same website. I have put together a Plunker consisting of two pages (index.html and about.html) that are loaded smoothly, with the help of jQuery’s fadeIn() and fadeOut() methods. $(document).ready(function() { var transEffect = Barba.BaseTransition.extend({ start: function() { this.newContainerLoading.then(val => this.fadeInNewcontent($(this.newContainer))); }, fadeInNewcontent:
jquery-3.3.1.min.js:2 Uncaught TypeError: Cannot read property 'indexOf' of undefined
I have upgraded jQuery version to 3.3.1 in my application and getting the following error: jquery-3.3.1.min.js:2 Uncaught TypeError: Cannot read property 'indexOf' of undefined at w.fn.init.w.fn.load (jquery-3.3.1.min.js:2) at HTMLDivElement.dispatch (jquery-3.3.1.min.js:2) at HTMLDivElement.y.handle (jquery-3.3.1.min.js:2) Please help solve this issue.
Trying to make form fields auto populate upon selection of drop-down
I'm trying to make form fields auto populate upon selection of drop-down. The drop down is for 'company' field (I already have this part setup in Django) which is related to another database table of contacts. I'd like to auto-fill the contact information in the form upon selection of the company. For instance - once you select the company from the drop down, the company address, city, state, etc. will be auto-filled in the corresponding form fields. Thanks for your help!
Moving existing divs
Hi All, I want to move existing divs below another div. This code is generated by Oracle APEX framework, hence not keen in adding ids. <div id="R118549394377418404_ig" class="a-IG"> <div style="z-index: -1; "><div style="position: absolute; transition: all 0s ease 0s; width: 200%; height: 200%;"></div></div> <div class="js-resize-sensor" style="direction: ltr; position: absolute; z-index: -1;"><div style="position: absolute;"></div></div> <div class="a-IG-header js-stickyWidget-toggle"
AJAX POST File failed on mobile
I want created a form to upload document by using POST method to call an API. It did work well in desktop, but mobile browser totally doesn't work on the upload action. Device : IPhone X - IOS 11.4 Mobile Browser: Google Chrome & Safari (both are the updated as now) Html Code: <form id="docsUpload"> <input type="hidden" name="token" value="aa"> <input type="file" class="upload-file" id="brFile" name="brFile" data-text="Find file"> <button id="submitBtn" class="btn btn-custom btn-upload"
Keeping track of last highlighted elements with use of Local Storage
I have a bit of a problem. So I have some tables within list elements, that I can move around and reorder, and also I select them by changing background color. The order of the tables or rather the order of the list elements are saved in Local Storage: function saveOrder() { var mapping = {} $(".sortable").each(function () { var key = $(this).attr("id"); var data = $(this).children().map(function () { return $(this).attr("id");
Changing css elements of classes with the same name?
Hello, I have an issue where I can have multiple instances of the same class being used, but only want to change something simple, like the text color, of one or more of this class, but not have the change effect ALL instances of this class. For example, below I have two text boxes, but they share the same class of "mstrmojo-DocTextfield-valueNode" but I want to be able to change the CSS of the text values independently. So, I may want the text color of one to be RED and the other to be BLUE.
CORB Error retrieving a json file
I am trying to recover the data of a JSON file from the following address: http://www.armada.mde.es/ihm/Documentacion/Mareas/json/2018/bonanza/bonanza_2018-07-26.json This is my code: var settings2 = { "async": true, "crossDomain": true, "url": "http://www.armada.mde.es/ihm/Documentacion/Mareas/json/2018/bonanza/bonanza_2018-07-26.json", "method": "GET", "headers": { "cache-control": "no-cache" } }; and I get the result of the attach picture. Some help to solve it? Thanks
Looping throught current select
$("select[id^='ticket_types_']").each(function () { var selectName = this.name; var selectId = this.id; var buttons; $("select[id=selectId] option").each(function () { alert("aa"); buttons += "<input type='button' value='" + this.value + "'/>"; }); alert(buttons); $("select[id=selectId]").replaceWith(buttons); // add a hidden
After Manipulating the DOM, the click does'nt works
Hi, does someone can help me ? After Manipulating the DOM of the row2 in my table, nothing appen; Please see more explanation and my code here : https://jsfiddle.net/xpvt214o/419272/
ajax
hello all, greetings from me guys i have a problem with below script..... function send_inquiry() { $('#loader_img').show(); $.ajax({ type: "POST", url: "<?php echo base_url();?>ajax", data: { action: "product_model.product_inquiry", name: $('#name').val(), email: $('#email').val(), phone: $('#phone').val(), address: $('#address').val(), country_id: $('#country_id').val(), country: $("#country_id option:selected").text(), inquiry_type: $('#inquiry_type').val(), note: $('#note').val(), pin:
2 DatePickers (Start & End Dates): Restrict date range
I'm using 2 DatePickers (Start & End Dates). I want to restrict the date range so that for whatever date is chosen for the Start Date, the End Date can be up to 2 weeks after the Start Date. How would I do this? For Example: I choose 07/15/2018 as the Start Date, so the End Date can be from 07/16-07/29 . Here's my current DatePicker code: <script> $( function() { var dateFormat = "mm/dd/yy", from = $( "#from" ) .datepicker({ defaultDate: "+1w", changeMonth:
Find the ONLY the next, innermost parent element above contains() target element
It occurs sometimes that I want to execute a function only on the next, innermost, certain element above a matching element. Simplified example: <div ....> ..... <div .....> <a ....> foobar </a> ... </div> .... </div> Only the innermost <div> should be removed. Therefore I coded in the past: $("div:contains('foobar')").eq(($("div:contains('foobar')").length) - 1).remove(); It works. However I wonder if there is a shorter way for this condition. The alternative way should also work if there is
Focusout repeats
I have this code that I use for every textbox I have: $("textarea").focusout(function () { //saveComments(); alert("Hello"); }); So if if I leave textbox 1 and click anywhere outside besides clicking any other textbox this code fires once. But if I click textbox 1 and then textbox 2 the focusout goes on repeatedly: "Hello", "Hello", "Hello"...etc. Why does it gets triggered several times when I enter another textbox? How can this be solved?
How do I access nested elements inside a list
I have this code: <li> <div class="wrapper"> <table> <body> <tr> <td></td> <td>Access this text</td> <td></td> </tr> </body> </table> </div> </li> How do I access the text inside tables first row and second cell?
jquery: API JSON example.
I have written the following code (as below) for an API JSON example but I cannot seem to output any information on screen? Moreover, if I use https://jsonplaceholder.typicode.com/posts/1 in my code it will function and output an answer? html: <h1>JSON Example</h1> <span id="output"></span> Jquery: $.getJSON('https://jsonplaceholder.typicode.com/albums', function(data) { $('#output").text(data.title); });
Next Page