dialog not defined
Hi everyone, I have never tried jquery widgets so this part of jquery UI is new to me. Any suggestions would be appreciated. The presenting problem is that i get the error "dialog is undefined" error when the following code snippet runs: $(function () { $("#dialog-1").dialog({ autoOpen: false, }); $("#TestButton").click(function () { $("#dialog1").dialog('open'); }); }) Now this error is related to the references. Here is what I have
why is jQuery 3.3.1 not used in many jQuery UI demos?
i upgraded my web app to use jQuery 3.3.1 and jQuery UI 1.12.1 libraries. While i understand i need to also update my code to reflect changes in jQuery and jQuery UI, i noticed that many of the current jQuery UI demos do not use jQuery 3.3.1. I use the jQuery UI demo sources to help with constructing proper and current jQuery and jQuery UI code, but it does not help when the demos do not use the current jQuery version and things end up not looking or acting right. why is jQuery 3.3.1 not used in
Disable single day of a week in datepicker
Hi everyone. How can you disable a single day of a week in the datepicker? For example if a restaurant is closed on mondays so people can't choose that day in the calendar. Thanks a lot.
Change Datepicker minDate onClick
Hi there, I am looking for a way to change the minDate of my datepicker onClick. I have two buttons, one needs to set the minDate to 0 and the other one to 1. When the user then clicks the datepicker input field, the calender shows with the specific mindate. So far I have below code, but the onClick does not change the minDate. What am I missing? Thanks for the replies! $(function () { $("#datepicker").datepicker({ dateFormat: "M dd, yy" }); }); $('#testXX').click(function () {
Nesting drag and drop element problem
I am having a problem nesting a drag and drop element. I have a jsfiddle link below. I am trying to build a form via drag and drop. I drag a "Fieldset" from the left menu to the black working area. I can drag multiple then sort them to reorder. I want to then drop fields in to the fieldsets. The field is located in the left menu below the fieldsets. I want to drag the field from the menu to the working area and inside the dropped/sortable fieldsets already in the working space. When I drag
datepicker default hour settings
Hi, I'm new to jquery datepicker so apologies if my question is silly Sometimes, through firebug, my datepicker dates (here maxdate) show values one day less (here: Date 2018-03-31T22:00:00.000Z) than what the datepicker shows in the calendar: and I noticed that my datepicker dates substractions precision are more or less 1 day. I suspect a default hour setting or UTC zone problem. My website is in three languages. How can I control that datepicker works in universal time code and default hours,
Jquery datepicker
Hi I am using datepicker function in jquery but it not working for different Timezone, i have changed my system timezone as 12:15am and date was 03-29-2018. and pass this date to maxDate then i was not able select 29 and was able to select 28 only. it is working fine for some Timezone but not for all. Any one have idea regarding this.Please help me out ASAP. Thanks Rachana
tabsshow does not fire after upgrade to jQuery UI 1.10 (works just fine with 1.9)
Hello folks, I am executing the upgrade of jQuery UI in my project, and I found a problem. I am trying to upgrade to jQuery UI 1.11, but after upgrading the jQuery-ui version the 'tabsshow' event is not firing up anymore. I checked the changelog, but I could not find anything related to this event. Has anybody here experienced this before? I am currently using: jquery-ui-1.8.14 and jQuery v1.6.4. The code the is not being executed after the upgrade is the following: $(document).bind('tabsshow',
Datepicker - rolling back the years
Hi there, I'm considering using the datapicker fr an app, it's my first time looking at jQuery UI. The issue I can see from the demo is that the datepicker does not have the ability for the user to roll back the years, or select a particular year. Am I missing something?
Selectmenu loses initialization after switching tabs
We have an issue with tabs and selectmenu After we switch between tabs it looks like the selectmenu loses its intialization.However if I re-initialize the selectmenu, I get a second menu. All the content is requested via ajax. JQuery: 1.11.1 JQueryUI: 1.12 /Theo
How to make html table input text Resizable using Jquery
Dear All, I had written the sample program where I required to make "Re-sizable" for dynamically created input text control and binded to html table on button click. And I had followed JqueryUI Resizable ,But I am unable to make it. Can any one please help me how can I make it https://jsfiddle.net/spspecalist87/1dkuhrtd/ Srk
Autocomplete with categories and scrollbar
I'm having trouble with using autocomplete with categories and then adding a vertical scrollbar. When the list is shorter than the max-height the scrollbar does not show just like expected. But when the last item in the list is selected the scrollbar appears. JSFiddle example (taken right off the demo page, type "a" in the input) Any clues on how to solve this?
Autocomplete renderItem: Can you also render input text and clickable buttons
We have an existing code that uses jQuery Autocomplete on one of our search functionality utilizing _renderItem to customize the label. What I need is to also customize the rendered item to have an input field for quantity and a button for updating counts. Is there a way to utilize _renderItem for this functionality? Here is a sample screenshot of what I need to create: I have tried customizing the .append() but it seems to always trigger the select action wherever I click even if the anchor tags
Multiple Datepicker elements format problem
Hi In the following code, element datepicker1 is not initialised as per line 2 of script. But if I move line 1 after line 2, it works. Can someone please explain if this is a bug or intended behaviour. <p>Date: <input type="text" id="datepicker1" name="dp"></p> <p>Date: <input type="text" id="datepicker2" name="dp"></p> <p>Date: <input type="text" ></p> <script> //line 1 $( "input" ).datepicker(); //next line has no effect. However, if move this line after next line, it works.
Incorrect display of checkboxes
Hello, why can it be that some checkboxes are displayed incorrectly? Here is an example: http://loefe.de/jq/ I have tried the current v1.12.1 as well as the v1.11.4. In both cases, the lower checkboxes are displayed incorrectly. Tested with Seamonkey and Opera Browser. It seems as the combination of tab with control group and checkbox is causing problems. I hope one of you can help me.
Using jQuery-ui autocomplete with MySQL to fill two input fields
I have a need to fill two input fields using autocomplete. I'd like to pull from of my MySQL table Fname and Lname both in a different column of the table. It seemed to me if I were to concatenate the two fields using CONCAT(Fname, ', ', Lname) as FullName then pass this value back to source of jQuery. But I don't know what to do from there to split the 'term' value as it returns. Here is what I have. But the return puts both names 'Bill, Smith' for example in both the #Fname and #Lname. I just
JavaScript to expand submenu in a jquery website with Jquery ui plugin installed
Dear all, I am currently developing a automation testing program in IE to a jquery website with menu widget plugin installed. However using Selenium click function is not able reproduce the hovering of menu item to display the sub menu items. Hence I am thinking of directly call the JavaScript in the webpage to trigger the sub menu display. Can you guys advise how the JavaScript shall be written to trigger a display of sub menu items? (I.e. simulate hovering the menu item for display) Many thanks,
how to get the ids of element being moved and element being replaced with sortable?
i want to get the CORRECT ids of both elements, one which is being moved and one which is being replaced, following is my code but please DO NOT CONFUSE ,you will see its working but its not , just move the table rows up and down few times and see the console , you will see its not getting correct ids, so something is wrong , please help <table border="1"> <thead> <tr><td>position</td><td>description</td></tr> </thead> <tbody id="sortable" class="ui-sortable"> <tr class="ui-state-default"
Filter table with Datepicker
Hi everyone, I have a Datepicker and 2 drops down menus on my page. After the user selects the date i need a filter to check the date of the data values of the dropdowns and show or hide and bold the dates after the date selected. $('#Start').on('selectedFromDay', function(){ var value= this.value; var dateText = datepicker(); $('#results-tbody tr').each(function () { var element = $(this); element.data('filters', element.data('filters').replace(/changes/g, '')); if (value !== 'All' && dateText >=
Output object properties in 2 columns
I'm struggling to output the object array in 2 columns. I need to output match2 in 2 seperate solumns. Thank you. https://jsfiddle.net/eqf3tcx2/16/ JS: $(function() { createQuizLayout(); initQuiz(); $('#reset').on('click', function() { $('#source li').draggable('destroy'); $('#target li').droppable('destroy'); createQuizLayout(); initQuiz(); }); }); function createQuizLayout() { var match1 = ["One", "Two", "Three", "Four", "Five", "Six", "Seven", "Eight", "Nine", "Ten"];
I just installed jqery-ui from npm and there is no jquery-ui.min.js file in any of the directories
I have installed it two now and the file is just not there. is there an alternative? did the file name get changed since the instruction were written here: http://learn.jquery.com/jquery-ui/environments/bower/ I did not use bower but i assumed trhat the only difference would be the directory name. In bower the path would be: <script src="bower_components/jquery/dist/jquery.min.js"></script> in npm the path would similar but like: <script src="node_modules/jquery/dist/jquery.min.js"></script> So
Datepicker display error
Hi, everyone! I have two fields with datepicker inside a dialog. When I use them inside this dialog, everything works fine. The problem is when I close my dialog and re-open it to do other requests. My datepicker re-initialize whitout selecting any fields and do not close again. I've tried to close it manually with the dialog's close property but when I re-open it, my datepicker does'nt open again. Any idea? My form <div> <form onsubmit="return false;" id="formDialog"> <input type="hidden"
Disable today and future date in Datepicker
Hi , <script> $( ".dateOfPurchased" ).datepicker({ maxDate: new Date, minDate: new Date(2007, 6, 12) }); </script> I used above code to disable future dates. My requirement is To disable today date and future date in date picker I am using above JQuery to disable future date but not today date could any one cane help me in this
Cannot change jquery-ui tooltip content as it is being displayed
I am using jquery-validation alongside jquery-ui tooltip to do the validation and displaying of errors in my form. To do that, I set the errorPlacement option of jquery-validation as such errorPlacement : function(error, element) { element[0].title = errorMessage; } This sets the title of my element with the error message, and jquery-ui does the job of displaying it as a tooltip. Then, when the error is corrected, I simply clear the title of the error, in hopes of stopping the tooltip
Width of dialog when used in a loop
Hi I have a problem controlling the width of a dialog, when I use it in a loop (I have a dialog for each option in a for loop). My code is based on this example: http://api.jqueryui.com/dialog/#entry-examples , and when I run this example as it is, the width function is working perfectly. Adding the loop function, then the widht does not work. Anyone who knows what is wrong? My code: <?php $cars = array("Audi", "BMW", "Mercedes"); for($n=0;$n< sizeof($cars);$n++) { echo
multiple formats in datetimepicker
I am using the jquery-ui datetimepicker and I want it to accept dates and times with or without leading 0's and 2 or 4 digit years, e.g. 2/3/18 2/3/2018 02/3/18 02/03/18 02/02/2018 Currently it seems it will only accept one format. Is there way to have it support multiple formats?
Put object in droppable area on page load
I’m implementing a photo manager like the one on this website ( https://jqueryui.com/droppable/#photo-manager ). Upon dragging an image to a droppable area I set this image to be the default one in the database. This works fine. What I can't figure out is how to have this default image show up in the droppable area upon page load. Do I have to do this in asp.net or can I call a jquery function after the page has loaded? Any ideas would be welcome.
help - Slider script dies in Chrome, works great in Firefox
I implemented a slider along with input boxes that can work in tandem with the slider. When I started the records I was pulling in from the server was around 1000 and the slider worked well. Once the database table was updated and the amount increased to 7500, the slider has taken a dive in Chrome. So if I just select say up to 1500 records from the database then no problems but once I go over that amount the slider becomes stuck and won't move without waiting a long time and even then, is difficult
How to apply different colors in Jquery dialog box using dynamic way
I use following code. I need to apply multiple colors (themes) for each dialog box . is it possible ? The dialog box are created dynamic way. You can see see that from the code. I have 2 links (see that code below the jquery code) and each time It create different dialog box. Need to apply different background color and border color for each dialog. I mean First dialog background-color:red, for the secod - background-color:blue $(function () { $('a.clk').on('click', function (e) {
Nested accordion with not selector works, but I can't figure out why!
1) I built a nested accordion using the dt (definition term) of a dd (definition list) as the header. <dl class="accordion"> <dt>Term</dt> <dd>Description <dl class="accordion"> <dt>Term</dt> <dd>Description</dd> </dl> </dd> </dl> $(".accordion").accordion({ header: "dt", heightStyle: "content", active: false, collapsible: true }); 2) I found that clicking on the child (nested) accordion
jQuery Datepicker - empty date goes to 1970-01-01
Hi all, I'm using the jQuery Datepicker (https://jqueryui.com/datepicker) My users are allowed to leave the datepicker blank. When they send the form, I get a value of 1970-01-01, but I would like to get a blank value (empty space for example). Looking at the datepicker js file, I found this piece of code: _ticksTo1970: ( ( ( 1970 - 1 ) * 365 + Math.floor( 1970 / 4 ) - Math.floor( 1970 / 100 ) + Math.floor( 1970 / 400 ) ) * 24 * 60 * 60 * 10000000 ), I tried to alter this file, but it keeps
setting different position using jqurry UI dialog
hi all I am trying hard to set dynamic position of jquery ui dialog. As of now I am able to create multiple dialog window but all are on top of each other. I need to change its position whenever I click on each button It can be seen in http://fiddle.jshell.net/q2cU2/1/
Jquery datepicker inside gridview indide update panel. Need maxdate of datepicker as the date in another column of that same gridview
I'm new to jquery. I have a gridview which contain two date columns. In second column There is datepicker textbox in itemtemplate. I need to set maxdate of datepicker as the date loaded in the first column. Now it's working as follows. First row. First column date is 30-dec-2017. And 2nd column maxdate of datepicker is same as 30-dec-2017. But second row working wrongly. In second row , fisrt column date is 29-dec but second column maxdate od datepickeris 30-dec. All rows datepicker maxdate shows
The hyperlink click is not firing inside the dynamic div
I am trying to add the hyperlink button inside the dynamic div, here is my code: $('#btClickMe').click(function () { var dynamic_div = $("<div1 id= div" + iCnt + "><a href='#' class='delete'>sudhir</a></div1>").css({ border: '1px solid', position: 'absolute', left: '350', top: 110, width: '25', height: '25', url: '', padding: '2', margin: '50', }); $(dynamic_div).append('<input
JQuery Tabs Shows As Bullet Points in IE 11
I have a MVC website using JQuery 1.12 to create tabs. The website shows correct layout for all machines except one machine. That machine shows tabs as bullet points on screen. Even on JQuery's website, the tabs demo shows bullet points too. Please see the attached screenshot. That machine has IE 11 on it. I am thinking it might be some settings issue? Any suggestions? Thanks, David
jquery autocomplete ui matched text color
Hi, I am using the following for jquery autocomplete search code. Can anyone help in highlighting the matched text with a different color as someone types the letters? <link href="https://fonts.googleapis.com/css?family=Ubuntu" rel="stylesheet"> <script src="//code.jquery.com/jquery-1.10.2.js"></script> <script> $(function() { $( "#search-box" ).autocomplete({ source: 'livesearch.php'
How to accesss modal jquery dialog after it is generated?
I have a webpage which uses jQuery UI Dialog to generate a modal form. The jQuery js code itself is generated by a database. So I have a "double-dynamically-generated" form and no access to the sourcecode. So how can I access elements of this form after they are generated? My idea was to use on() or delegate(), but my form elements should have already changed when the form is loaded. Not on 'click' or something else.
Jquery draggable columns issue
Hi Team, I am new to jQuery and trying to use the draggable feature into my Salesforce VF page which is similar to HTML. The VF page table has around 20 columns approx and when the page get loaded it displays only first 15 or something and in order to acces further columns we need to use the scroll bar. The issue is when I try to drag the columns which are hidden using the scroll bar. jQuery would not recognize those columns and somehow picks and traverses back from only those columns which were
how to detect when i change a tab?
hi i have this script for make a list of tabs there is a event for detect when the user change of tab ? <script> $(function () { $("#tabss").tabs(); }); </script>
datepicker UI responsive
Can we make the datepicker (with popup and not inline) responsive with bootstrap? and so, how to proceed? Thank's for your answers
Next Page