scoll in select option disabled after using jqtransform - jqtransform

I have a problem with Jqtransform , when it transform the select input , it disable scrolling on the option value and make it appear very long drop down selection
like in the image i attached ![enter image description here][1]
i need help please
Thanks
http://imm.io/pi0d

jquery.jqtransform.js
add this code -> .css('height', 120)
line=265
looks like
var $ul = $('ul',
$wrapper).css('width',$select.width()).css('height', 120).hide();

Rather than giving height to it I would suggest give it an overflow-y:scroll
var $ul = $('ul', $wrapper).css('width',$select.width()).css('overflow-y', 'scroll').hide();
Let the height be given through CSS and not through JS...
Hope this helps :)

Related

Tornadofx Tableview row count

Hey guys can someone please enlighten me. what is the best way to have a label display SortedFilteredList size. I have a tableview and I want a label showing the current table row count while filtering using filterwhen
All you need to do is to create a StringBinding towards the sizeProperty of the SortedFilteredList. I've added an example to the TableViewSortFilterTest in the framework, check out https://github.com/edvin/tornadofx/blob/master/src/test/kotlin/tornadofx/testapps/TableViewSortFilterTest.kt for a complete example. Here I add an informational hbox to the bottom of the screen:
hbox(5) {
label("Filter count:")
label(data.sizeProperty.stringBinding { "$it records matching filter" })
}
The data property is my SortedFilteredList instance.

How to change Laravel crudbooster datamodal to a select2

The below code works and I can create a measurement modal that displays the kgs, grams etc but was wondering if there is a way to do it as a dropdown select2 instead as the list is quite short. the two I've tried below show just the label but no select2 box. Any ideas? regards
$columns = [];
$columns[] = ['label'=>'Quantity','name'=>'quantity','type'=>'number','required'=>true];
$columns[] = ['label'=>'Measure','name'=>'measures_id','type'=>'select2','datatable'=>'measures,measure'];
$columns[] = ['label'=>'Measure2','name'=>'measures_id','type'=>'select2','validation'=>'required|integer|min:0','width'=>'col-sm-5','datatable'=>'measures,measure'];
// $columns[] = ['label'=>'Measure','name'=>'measures_id','type'=>'datamodal','datamodal_table'=>'measures','datamodal_columns'=>'measure','datamodal_select_to'=>'measure:measure','required'=>true];
Found how to do it by changing select2 to select.Not sure what the difference is.
From:
$columns[] = ['label'=>'Measure','name'=>'measures_id','type'=>'select2','datatable'=>'measures,measure'];
to:
$columns[] = ['label'=>'Measure','name'=>'measures_id','type'=>'select','datatable'=>'measures,measure'];
That's correct. Since I cannot comment I'll suggest you the difference by adding an aswer.
The difference is:
Select : Standard HTML element, rendered by the browser and working according to its own code.
Select2: Select2 is a jQuery library that "improves" your select elements by adding HTML code to render options and adding functions. For example, you may add a search box to filter your options, or you can style the dropdown better.
Library url : select2.org

Add circle on Bokeh image

I'm working with Bokeh and I want to add a circle on a specific position on my image.
For the moment, I create my image like this :
img = image(image=[data],
x_range=[0, x_range],
y_range=[0, y_range],
x=x,
y=y,
dw=dw,
dh=dh,
tools=TOOLS,
palette=["Greys-9"],
title=title,
plot_width=plot_width,
plot_height=plot_height,
)
circle(x=10,y=10,radius=100,fill_color="#df1c1c",line_color="#df1c1c")
resources = Resources("inline")
plot_script, plot_div = components(img, resources)
html_script = encode_utf8(plot_script)
html_div = encode_utf8(plot_div)
hold()
figure()
return html_script, html_div
and send this to my HTML page.
The problem is that the circle is not on the final display. Maybe on background ? I don't know...
I tryed add function, add_glyph function, add_layout... None of these are functionnal!
Thanks for helping guys
The above code did not work due to a bug in Bokeh. However, the bug has since been fixed, and that code and code similar to it will function as expected.

Telerik MVC grid-How to set default row selected

Is it possible to render a Grid with one row selected as default (set the right page number and highlight the row)?
For highlighting, try using the "OnRowDataBound" event
.ClientEvents(events => events.OnRowDataBound("onRowDataBound"))
with something like
function onRowDataBound(e) {
var myId = $('#MyId').val();
if (e.dataItem.Id == myId)
e.row.className = 't-state-selected';
}
I'm still trying to figure out how to set the correct initial page number. This bloke might be on to something.
Use the Grid RowAction method, eg:
.RowAction(row => row.Selected = row.DataItem.CustomerCode.Equals(ViewBag.ID))
It is perhaps possible if you iterate in the grid source, locate the row which has to be selected in it, than use a formula to detect on which page will be displayed, and finally change the page index on initial load and select it.

jqGrid cell editing need to position the error message dialog

I'm using jqGrid with cell editing. I have setup the colModel properties using the editrules option. Everything works fine in that if I edit a cell and try to save an invalid value the grid displays an error dialog, but I need to know how to position the error message dialog that comes up because in the case of my layout it ends up behind a video. I'm not quite sure how to hook into this and there don't seem to be any obvious options on how to do it.
In this case the dialog I would be trying to manipulate is the one with ID of info_dialog.
Also I'm using the clientArray option for cellsubmit.
I realize this is rather old but upon searching I didn't find any indication this might have been added since, so I figured now that I've figured it out I'd let everyone know how I solved the positioning of mine.
$(document).ready(function ()
{
$.jgrid.jqModal = $.extend($.jgrid.jqModal || {}, {
beforeOpen: centerInfoDialog
});
});
function centerInfoDialog()
{
var $infoDlg = $("#info_dialog");
var $parentDiv = $infoDlg.parent();
var dlgWidth = $infoDlg.width();
var parentWidth = $parentDiv.width();
$infoDlg[0].style.left = Math.round((parentWidth - dlgWidth) / 2) + "px";
}
From what I could find in the jqGrid source code, you can add a beforeOpen and an afterOpen. In my case I'd rather position the thing before it's displayed (duh!). Would be nice if there was a parameter to hook it up in the grid declaration, but this does the trick in the mean time.
I hope this helps someone! I spent most of my afternoon on this!
Default value of zIndex parameter of info_dialog is 1000. The function info_dialog from grid.common.js part of jqGrid will be called from grid.celledit.js without usage a 4-th parameter which can change the option.
So the best pragmatical way which I could recomend you is to decrease zIndex value of your div with the video so that it will be less then 1000.

Resources