mleibman / SlickGrid

A lightning fast JavaScript grid/spreadsheet
http://wiki.github.com/mleibman/SlickGrid
MIT License
6.81k stars 1.98k forks source link

Trying to get a large popover or modal when users mouse over first cell in column. #1125

Open RMoyles opened 7 years ago

RMoyles commented 7 years ago

I have a slick grid I'm using to display table information to users on a detail report. Some of the fields are input fields that get captured for a total detail report. On the first cell there is a input field that when clicked or mouse over focus (either is fine but probably click event would be better) I want to display a message reporting that this field could be used to do lookups on this number (it's a reference number) throughout the system by entering the reference number in the lookup box. The user won't know about this correlation without the prompt. How can I get a larger and different color popover under click or mouse over. I don't want the standard pale yellow pale text look of the standard popover or tooltip. I'm a slick grid newbie so I'm really struggling with this. I need to know what scripts I need to deploy and the correct order and what links to the scripts would look like. Also where should I deploy the script and what changes do I need to make to slick.editors.js or slick.grid.js or slick.autotooltips.js and if so what and where to make those changes. Thanks so much for your help I've been beating my head against the wall trying to get this to work.

Thanks !!!!!!

6pac commented 7 years ago

The Tooltip plugin appears to use jQueryUI, which allows you to just specify the 'title' attribute of the cell. So to change it you'd have to mess with or override the jQueryUI CSS, which is messy, and will affect every tooltip. The other option is to roll it yourself something like: http://www.w3schools.com/css/css_tooltip.asp, and perhaps copy the ToolTip plugin to create a new plugin for this new behaviour without using jQueryUI.

6pac commented 7 years ago

The best way to see what to do is to use the examples. It's all set up and working there. You'd be best advised to use my repo: 6pac/Slickgrid, since it's got a lot of updates and bug fixes for the later jQuery versions. This repo is frozen in time at jQuery 1.7.

RMoyles commented 7 years ago

Thanks for the suggestion but I spend hours on that page trying all possible combinations. I think it is a function of _Slickgrid_layout.Cshtml or _SlickgridScripts.cshtml or _layout.cshtml having the wrong sequence of calls. But right now I'm struggle with autocomplete and I searched the sight and can't find any relavent current information on it.

On Thu, Aug 11, 2016 at 10:07 PM, Ben McIntyre notifications@github.com wrote:

The best way to see what to do is to use the examples. It's all set up and working there. You'd be best advised to use my repo: 6pac/Slickgrid, since it's got a lot of updates and bug fixes for the later jQuery versions. This repo is frozen in time at jQuery 1.7.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/mleibman/SlickGrid/issues/1125#issuecomment-239344886, or mute the thread https://github.com/notifications/unsubscribe-auth/ATJUnyYlaYatFc4Sh4sbGHnOizSVMQLKks5qe9VrgaJpZM4JiHfX .

The information in this email (and any attachments) is confidential. If you are not the intended recipient, you must not use or disseminate the information. If you have received this email in error, please immediately notify me by "Reply" command and permanently delete the original and any copies or printouts thereof. Although this email and any attachments are believed to be free of any virus or other defect that might affect any computer system into which it is received and opened, it is the responsibility of the recipient to ensure that it is virus free and no responsibility is accepted by the companies, subsidiaries or affiliates either jointly or severally, that I represent, for any loss or damage

arising in any way from its use.

6pac commented 7 years ago

I don't think autocomplete has anything to do with SlickGrid.

6pac commented 7 years ago

Hi @RMoyles, it's important to get all your bits working at the correct jQuery level. If you're using the latest jQuery (1.11.x) then use SlickGrid from my repo, because there are bugs with the MLeibman version and the latest jQuery. Next you'll need a jQueryUI compatible with that version of jQuery (eg. jquery-ui-1.11.x).

You'll need to check the jQuery version used by the autocomplete example and check that it works with jQuery 1.11.x and jquery-ui-1.11.x (set up a stand-alone HTML test page like the example pages in the repo - once it's working you can submit it to my repo and I'll include it as a sample). The autocomplete code may use old jQuery deprecated method calls. If so, you've got to decide whether to fix it for the latest jQuery, or whether to use an old jQuery version that's compatible with it (in which case you'll need to make sure SlickGrid is also compatible - my repo is OK with jQuery 1.8+).

Once that's working, you can start integrating the autocomplete into the SlickGrid editor.

I won't have time to put an example up in the next few days, but I was going to put a Chosen (drop down) editor example up, and I could do autocomplete too, sometime in the next few weeks.

RMoyles commented 7 years ago

Okay, I got this working and it populates the text box with all the jquery UI type ahead features. It displays the countries and has the proper look in the text box and also is using the typeahead features correctly. The problem I'm having now is that it won't bind the chosen country from the text back to the database. It lets me choose the country from the text box using autocomplete and it shows in the text box but when I go to submit the form to store in database it says the field is empty. Not sure what to do next. Here is the exact line that I'm using to bind to autocomplete field. Im not sure why its not binding from the box to the database. Available Tags is the name of the array country array in the slickeditor.js for autocomplete. CoutryOfOrigin is the database field. Any help would be greatly appreciated.

Thanks

Githubissues.
  • Githubissues is a development platform for aggregating issues.