add jquery datetimepicker to jqxgrid column of jqwidgets - datetimepicker

I want to add jquery datetimepicker to a column of jqxgrid. I tried to add by:
initeditor: function (row, cellvalue, editor) {
editor.datetimepicker();
}
But this is not working.
Please help. Thanks in advance.

You need to use this fuction in the column:
createeditor: function (row, cellvalue, editor) {
editor.datetimepicker();
}
This fuction is called when you initialize the column.

Related

I have 2 texts, list and grid.it will show list to grid when i click but i want to show the previous text again when i click on it .How to do that?

Initially I setted the text as list in use-state and it change to grid when I click on it.How to show the list again when I click?
const [buttonText, setButtonText] = useState('List');
function handleClick() {
setButtonText('Grid');
};
This is the use-state and the function that changes the text.Can anyone help me ?
You can call same method and use ternary operator (check your current state and setState according to it).
function handleClick() {
setButtonText(buttonText == 'Grid' ? 'List' : 'Grid');
};

Use dropdown input as placeholder in another field

Based on this threat I've managed (with special thanks to Tami) to create a dropdown menu with variable year numbers in it.
Now I would like to use that chosen value of that dropdown menu as a (part of the) placeholder for another input field.
I tried this with no luck:
[number* ba-maanden min:1 max:12 placeholder "cf7_get_input="recent-years""]
Does anyone has an idea how to get this done?
Thanks,
Vasco
This is not tested, but should work. You can either add this to your form itself by making it all inline and surrounded with <script> and </script> or add this to your theme's js file.
jQuery(function($) {
$('select[name="ba-maanden"]').on('change', function(){
// Assign variable $placeholder to the chosen value
let $placeholder = $(this).val();
// replace 'your-field-name' with the cf7 field name
$('input[name="your-field-name"]').attr('placeholder', $placeholder);
});
});

DataTables - createdRow in conjunction with dynamic column hide/unhide

I implemented a dynamic column visibility to hide/show columns, e.g. DT.columns(5).visible(true) and DT.columns(5).visible(false) to show/hide column 5. I also have a callback for createdRow which let's say makes a html button out of the text in column 5.
Currently in createdRow I check this.api().columns(5).visible() and if true then I proceed to do $('td:eq(5)',row).html('<button>'+data[5]+'</button>') cell content, and if false then I return because otherwise I'd overwrite the current 5th <td> which is not the intended one. But then when I unhide column 5, it comes up as text since I did not run the previous code.
I'd like to be able to run the code and cache the html of the cell in column 5 so that when it's unhidden, it comes up with the intended <button>. What's the best way to do that? The column-visibility event?
Note that I know I can use the render: function (...) {} option for the column, but I do not want to use that because it affects the raw data of the table and affects filtering and searching - I want the raw data to remain unaffected, which is why I was using the createdRow or rawCallback callbacks.
Assume column 5 has visibile: false in the DataTable initialization object which looks like this:
var DT = $('#dt').DataTable({
...
createdRow: function (row, data) {
if (this.api().column(5).visible()) {
$('<button>' + data[5] + </button>')
.appendTo($('td:eq(5)',row).text(''));
}
);
Cheers
Look into using columnDefs and the 'render' function instead...
var DT = $('#dt').DataTable({
...
"columnDefs":[
{
'targets':[0],
'visible':false,
'render':function(data, type, row, meta){
...
}
]
});
https://datatables.net/reference/option/columns.render
https://datatables.net/reference/option/columns.data

Dojo TreeGrid with computed values in summary row

I am developing a treegrid and have an object being passed into a formatter to generate a gfx graphic.
},{
field:"projects", name:"Projects", children:[
{field:"name", name:"Project Name", formatter: projectFormatter},
{field:"actual_cost", name:"Cost", width:'220px', formatter: costFormatter},
{field:"budget", name:"Budget"}
],
aggregate: "cnt",
itemAggregates: ["actual_cost"]
}
now the formatter function should be able to use this data....however for the life of me, I cannot get it to compute the values in the formatter
Any help is appreciated
Try passing a nameless function to the formatter:
...,formatter: function(value){return getExtImg(value);},...
In there you can call your custom function by name. Dont forget to return a value in your formatter function !

jquery datatables editable how to make cell 'read only' after editing?

I am using jquery-datatables-editable plugin with jQuery DataTables successfully. Is there a way to make editable cells UN-editable after they have been edited?
Basically I have a table with a checkbox, and once it is checked it needs to be uneditable. I am assuming this would be a 'fnOnCellUpdated' parameter or maybe part of a rowcallback function?
I feel like an idiot. It really is simpler than I thought:
"fnRowCallback": function( nRow, aData, iDisplayIndex ) {
var shop_ok_data = aData[15];
if(shop_ok_data == "checked"){
$('td:eq(10)', nRow).addClass("read_only");
}
return nRow;
},