jsRender (client-side lightweight templates)
This morning, I came across a blog post about jsRender: http://www.htmlgoodies.com/beyond/javascript/display-json-data-using-the-jsrender-template-engine.html It's a lightweight template renderer that can be used with (or without) jQuery. https://github.com/BorisMoore/jsrender http://www.jsviews.com/ (try-it demo) Somehow, I hadn't heard of it before. I find it very attractive for my work. I write hybrid mobile apps using the Rhodes platform, and in Rhodes pages are (generally) produced from
Jquery tooltip plugin is detecting hover event only for 1st row in datatable
I'm using Tooltipster Plugin to create a tooltip everytime i hover over a <td> element in a datatable. To do so, i have looped over each row in the datatable and then selected the <td> element using childnode, and applied the .tooltipster() function. However, the tooltip works only for the 1st row <td> element. Any idea how to get it working for all rows ? $('#mytable tbody tr').each(function(){ //childNode[7] is the <td> element on which i want the tooltip $(this.childNodes[7]).tooltipster({
Can I user jQuery UI in vue.js
Can I user jQuery UI in vue.js? var $ = require('jquery'); var Vue = require('vue'); require('jquery-ui');
Datepicker - mutiple instances, disable buttons or readonly help
Hi, I have a gridview with a date column. Each row in this column shows it's date value with the datepicker. This is working great except for one thing. I don't want the date displayed by the datepicker to change - it should only show the value of the date which is in the column, even if a button is clicked. Oddly enough it is only the top datepicker in the first row which lets the input buttons change the date displayed. The rest of the datepickers do not change their value when clicking
MP3-jPlayer: skip to minutes by clinking the timeline
On this page I have the MP3-jPlayer WordPress plugin with the Text Skin, slightly modified. I have deleted the volume bar from the plugin’s html/php structure. I have also added a “seekbar”: <div class="seekbar-wrapper"> <div class="seekbar-container"> <div class="seekbar" value="0" max="1"></div> </div> </div> I have modified the plugin’s mp3-jplayer-2.7.js file in order to show, for every track (mp3 files), the timeline. After line 403 (jQuery(this.eID.indiM + j).empty().append('<span class="Smp3-tint
validation of forms with rows
Hi, I'm a newbie in javascript, please forgive me if this is plain and simple. I followed some tutorials on validation and got it al working for a simple form using: <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.3.min.js"></script> <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.0/jquery.validate.min.js"></script> and my own validation file : <script src="validation.js"></script> I can set if a field is required or has to be an email... But my form
BlockUI overrides blockUI.history with new data without restoring the previous.
Consider this scenario: You have blockUI block the page with the message being an element a div with id #dialog for example. Inside that div there is a button that does the following: Unblocks the page Executes some functionality which may result to an error. For example a failed ajax call. On that ajax failure callback you update an observable array with the error(-s) that occurred. On that observable array there is a subscription that when the length of the array is > 0 it will block the page and
select data with datatables plugin
Hello, I want to show data with the DataTable plugin. I use a mysql database for save the data. But now I get the error: No data found. But I want select the data from the php file. My question is: How can I select the data from the mysql with the DataTable plugin? Can someone help me what is going wrong? thanks in advance index.php: <!DOCTYPE html> <html> <title></title> <head> <link rel="stylesheet" type="text/css" href="css/jquery.dataTables.css"> <script src="js/jquery.js"></script>
Hello! I found BUG
Sorry, I bad speak English. I wrote the script /* Generator <?php $ucode = rand(1000,10000); $password = rand(100000,1000000); ?> /* Form <form method="post" action="form.php" id="Checker"> <input type="text" name="ucode" value="DF<?=$ucode?>" /> <input type="text" name="password" value="<?=$password?>" /> <input type="submit" name="send" value="SEND" /> </form> /* Handler form.php if(($_POST["click"])){ $ucode = clear_string($_POST['ucode']); $password = clear_string($_POST['password']); $test =
Sortable list saving the last state
Hello Im trying to create a sortable list but I need to save the last state of the list, I have been trying but didnt succeed. here an example of my code finddle I hope any one could help me. thanks in advance
Advanced Autosuggest Box
I wonder if you can recommend a paid script which will create an advanced autosuggest box at my website? I need it to allow rich CSS styling. It should also group results by categories. The best two examples of such autosuggest box are BLOOMBERG TEMINAL and REUTER EIKON. I have attached links to images which show the search bars of both. http://s3.amazonaws.com/libapps/accounts/10680/images/Bloomberg.jpg https://blogs.thomsonreuters.com/financial-risk/wp-content/uploads/sites/12/2016/09/eikon-data-visualization-screenshot2.png
How to use SelectMenu in WordPress with plugin jquery ui
Trying to use SelectMenu with background image option. can anyone provide information on how to use? Place code for item in WordPress Page How do I link page code to JQuery UI Where do I put the images
Insert data in DataBase - Using jQuey Seat Chart plugin
I use an adaptation of this plugin jQuery Seat Chart Here it is some lines: click: function () { //Click event if (this.status() == 'available') { //optional seat var maxSeats = 3; var ms = sc.find('selected').length; //alert(ms); if (ms < maxSeats) { price = this.settings.data.price; $('<option selected>R'+(this.settings.row+1)+' S'+this.settings.label+'</option>') .attr('id', 'cart-item-'+this.settings.id)
datatable order european data
HI i have a datatable this is the html : <div class='table-responsive'> <table id='datatable' class='table table-striped table-bordered table-advance table-hover'> <thead> <tr> <th>Cliente</th> <th>Data</th> <th>Ora Partenza</th> <th>Ora Arrivo</th> <th>Luogo Partenza</th> <th>Luogo Arrivo</th> <th>Note</th> </tr> </thead> <tbody> <tr> <td> Hotel Baglioni </td> <td> 13-02-2017</td> <td> 04:00</td> <td> 04:30</td> <td> Barberino Di Mugello</td> <td> Trani</td> <td> pto</td> </tr> <tr>
binding dynamic javascript array on simple-datagrid jquery plugin
Hi, I am using simple-datagrid plugin, and i try to bind my source data like an array to it. i create an html table <table id="tbl"> i loop from objects retrieved from sdk.REST.Retrievemultiple. the result is stocked on a table var tab =[]; for(var i=0; i<results.length;i++){ tab["id"]= results[i].id; tab["domaine"]=resutls[i].domaine; $('#tbl').simple-datagrid('loadData', tab); not working i have no rows. thanks for your help Regards }
DataTables: When scroll bar of tbody is hidden, fixed column gets messed up
I've got a table which includes: first Column is fixed tfoot horizontal scroll bar of tfoot have hidden horizontal scroll bar of tbody. Fiddle:https://jsfiddle.net/jbeteta/6sxh3gbk/12/ $(function() { $('#example').DataTable({ "fnInitComplete": function () { // Disable scrolling in Head $('.dataTables_scrollHead').css({ 'overflow-y': 'hidden !important'
How do I present a summary page after user has completed his/her form?
Greetings experts, I hope this is the correct forum for this question. I have a code that dynamically creates additional table rows. What is unique about this is that it has several Add More Rows buttons that it makes it extremely difficult to present summary page for the user. Per our requirements, once user completes filling out the boxes, s/he needs to be presented with summary page to review data entered. If everything goes well, user submits records to the database. If not, user goes back, makes
jquery autocomplete - Render Item contains space Issue
Hi All, I am using below jquery autocomplete plugin <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css"> <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> I have around 3 autocomplete functionality in a page. Every works perfectly except of items which returns spaces like words( "abc
Slick slider - getting rid of the horizontal scrollbar
Hi, I created an example to use Slick slider here: Slick Slider Example It works, but it shows the horizontal scrollbar and I can't find how to fix it. Could you please help me to get rid of the horizontal scrollbar? Thanks
Some guidance needed for MinicartJS Plugin code modification ---
Hi there, This is about a jquery based plugin I'm trying to use in amy application. It's the minicartJS which helps in a nice UI experience in e-commerce application plus some cool features for payment gateway interaction. Now' I've got the files necessary, the css and the js minified. If you would visit the main page itself www.minicartjs.com you would see the basic sample they've put up for reference. The 3 boxes each have 'add to cart' and the last one a 'view cart' thing to see the cart summary.
DatePicker
I am using the datepicker. I have two questions. I could not find the answers in the documentation.Or the answers are there and I didn't recognize it as such. 1. is it possible to allow the user the option to type in the date if they don't want to select from the calendar? they want to be able to either type in the date or select it from the calendar. 2. when the calendar displays, the word "today" is gray-out - disabled. is this normal? I am a bit confused at its purpose - to click on it and
multiAccordian Question
I'm using the plugins below and need help. I need to insert a button on the child elements and on click close the current child and open the next child. I need some direction or help explanation as to how to get that accomplished. I'm stuck so any help would be appreciated. Thank you for your help. http://www.jqueryscript.net/demo/Smooth-Nested-Accordion-Plugin-with-jQuery-jQuery-UI-multiAccordion/
Slick Slider Not Working
I am trying to use the Slick slider plugin. I tried downloading the physical files and linking to them and I have tried linking to the CDN file paths for them, but nothing happens. Nothing is styled and nothing functions. I used the Slick set up tutorial and looked up solutions, but alas, nothing helps. I'm hoping someone can assist me on this. Here is my simplified test of the Slick Slider, this one uses the CDN file paths: <!DOCTYPE HTML> <html class="no-js"> <head> <meta charset="utf-8">
jquery plugins
hello i tried running this code using sublime text but is not working.Someone help please!! <!doctype html> <!DOCTYPE html> <html> <head> <title>image slider</title> <script src="https://code.jquery.com/jquery-3.1.1.min.js"</script> <script src="http://malsup.github.io/min/jquery.cycle2.min.js" ></script> <script type="text/javascript"> $('#slider').cycle({ fx: 'fade', speed: 'fast', timeout: 3000, next: '#next', prev: '#prev' }); </script> <style type="text/css">
Tablesorter - looking for a way to get a min value for a numerical column for a slider control
Hello, Tablesorter is very good, glad to come across it. I am trying to setup a slider with a min / max range based on numbers in a column. I found a comment about this on web, https://github.com/Mottie/tablesorter/issues/503 , specifically var colMax = $cell.closest('table')[0].config.cache[0].colMax[indx]; that takes care of max value, is there no min available? Perhaps this could be done by inspecting column, but not sure how to go about it. Thanks
validator with jquery2
Does the jQueryValidator work with jQuery2?
SuperFish - how to open wth 2nd level collapsed?
Hi all Sorry my stupidness, it seems that the issue I'm asking about is does without saying so therefore I can't get it... I have SF menu on my websites, one of them is: THIS MY SHOP SF menu appears on screens <800px. And if to open it, all 2nd levels are expanded caused problems if two top-level sections are closer to each other. Stupid question: how to tune SuperFish not to expand 2md level without tap/focus on the 1st? Thanks
JQuery Validation Error Container is Hiding Server Messages while Validating the form. How to prevent this?
Again this question was asked on Stackoverflow. Error Container is also being used by server messages and jQuery Validation overrides visibility of server error messages. How can this be prevented?
Which carousel (slider) can I use to create something like this?
Hi, I need to create a carousel (slider) which should like something like this: [img]http://i65.tinypic.com/9t3grc.png[/img] Which jQuery (or any other) carousel can I use for it? Thanks
using a vectormap with JSON data
Not sure if this is the correct forum for this, I'm using a the vectormap plug in which I got working, I'm able to hard code colors for states with no problem, however, I need to color each state based on data that is coming from the DB in JSON format. here is the code I'm using that is hard coding the state colors: jQuery('#vmap').vectorMap({ map: 'usa_en', showTooltip: true, selectedColor: null, hoverColor: '#1a75ff', color: '#ffffff',
Newbie trying to understand how Tablesorter column headings work
Hi, I am trying to work out how tablesorter column headings work & where to add some code to hide or deactivate a heading. I can see from inspector what code I need to add but I cant work out where to put it. Its like the search row is not recognising there is 10 columns Code for head is <thead> <tr> <th class="sorter-false filter-false"></th> <th style="text-align: center; vertical-align: middle">ColumnB</th> <th style="text-align: center; vertical-align: middle">ColumnC</th>
Need help with Scrolling text with Pause on MouseEnter and Resume on MouseLeave
Im very new to jquery and would like some assistance please. I am trying to get scrolling text that pauses on mouse enter and resumes on mouse leave. here is my current code: <!doctype html> <head> <meta charset="UTF-8"> <title>Untitled Document</title> <link rel="stylesheet" type="text/css" href="css/style.css"> <script type="text/javascript" src="scripts/jquery-3.1.1.js"></script> <script type="text/javascript" src="https://raw.github.com/tobia/Pause/master/jquery.pause.min.js"></script> </head>
Flexslider not rotating
My Flexslider is not rotating when the browser is not on focus. If the browser is on focus, then the flexslider works fine. However, if i open up a notepad on top of the browser, then the flexslider is no longer rotating. How can i make the flexslider to continue rotate even though the browser is not on focus? My code used is as below. $('#home-flexslider .flexslider').flexslider({ animation: "fade", slideshow: true, pauseOnHover: true, smoothHeight: false, start: function (slider) { slider.removeClass('loading');
FullCalender plugin length description error.
Hey guys, I have problem with FullCalender plugin. My description is too long,thus plugin is not working? How can I solve this problem ?
MouseMove Drag con coordinate del livello e.pageX, e.pageY
Buongiorno Ho questo codice js, vorrei mostrare le coordinate X e Y considerando come 0,0 il livello div.contenitore-mappa anziché tutta la finestra. Come posso operare? Grazie $("div.contenitore-mappa").ready(function () { var $dragging = null; $("div.contenitore-mappa").on("mousemove", function (e) { if ($dragging) { $dragging.offset({ top: e.pageY, left: e.pageX
Jquery Nestable plugin error with php
Hey guys, I have a problem with Nestable plugin,The first thing I want to say,I know normal jquery sortable plugin but I don't understand Nestable. My Code is apperead in above images; * http://i.hizliresim.com/yNQ2o9.png * http://i.hizliresim.com/6rOYqE.png Now, I want to send output to ajax.php file via post method.How can do it ? What variables should I send ?
Am I over complicating my form validation?
I am trying to make my booking form a little more user friendly... I have three sections... First is a first/last name, email and phone number. Second is a calendar to pick your date Finally there is a dropdown select that shows a list of different time slots that are available. It looks like this: I am using tzjs to get the users time zone, and I am using moment.js to compare dates and times. The reason this form is complex is because I am only showing dates and times that are one hour in the future
slicknav
Hi, i got slicknav for mobilenav working, but i try to configre that after i clicked onto a link the navigation remember the link a clicked. Does s.o. has an idea how to get it to work? actually i called slicknav like this:: <script> $('#menu').slicknav({ label: 'MENU', duration: 1000, easingOpen: "easeOutBounce", //available with jQuery UI prependTo: "body", allowParentLinks: false, nestedParentLinks: true, easingClose: 'swing', parentTag: 'a', }); </script> Thanks
Using magnific popup type ajax in form Submit
I have a question. I am not much aware of javascript. I want to open a new page (showresults.asp) with all form data transferred to, using magnifique popup Type Ajax. The new window should open on pressing the form Submit (Send) button. I saw the following code in another post, it needs some modification for the requirements mentioned above. The link to post page is: <html> <head> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script src="https://rawgit.com/dimsemenov/Magnific-Popup/master/dist/jquery.magnific-popup.js"></script>
Problem sing jquery bootgrid on a html table with rowspan
Hi everybody, I have a html table with many rospans but when I try to page this table with the Jquery function bootgrid, the reported table loses all the rowspans option. Here is the code I used on my jsp: <div id="content" class="pure-form"> <s:if test="%{listaDelegati.size()>0}"> <table id="grid" class="table table-condensed table-hover table-striped"> <thead> <tr> <th data-column-id="nome" ><fmt:message key="label.form.ricerca.delegati.nome.title"/></th> <th data-column-id="cognome"
Next Page